Android custom view draws randomly generated picture verification code

This article is about the randomly generated image verification code of Android custom view. We often need to randomly generate image verification code during development, but this is the second. We mainly want to summarize the development process of some custom views and some areas that need attention.

As usual, look at the renderings first:

1、 First, summarize the steps of customizing the view:

1. Customize the view properties 2. Obtain our customized properties in the view construction method 3. Rewrite onmesure 4. Rewrite OnDraw. The onmesure method does not have to be rewritten, but it still needs to be rewritten in most cases

2、 Several constructors of view

1. Public customview (context context) > when java code directly creates a new customview instance, it will call the constructor with only one parameter; 2. Public customview (context, attributeset, attrs) - > this constructor with two parameters is called when it is created in the default XML layout file. The parameter of attributeset type is responsible for bringing the customized attributes in the XML layout file into the view through attributeset; 3. Public customview (context, attributeset, attrs, int defstyleattr) - > the third parameter in the constructor is the default style. The default style here refers to its default style in the theme used by the current application or activity, and it will be called only when explicitly called. 4. Public customview (context, int defstyleattr, int defstyleres) - > this constructor was added only when api21 was

3、 Let's start to look at the code

1. To customize the view attribute, first create an attr.xml under RES / values / to define the attributes we need and declare the value type of the corresponding attribute

We define four attributes: font, font color, font size and font background color. Format is the value type of this attribute. There are 10 types of format value types, including string, color, dimension, integer, enum, reference, float, Boolean, fraction and flag.

2. Then declare our custom view in the XML layout

Be sure to introduce xmlns: Custom = "" http://schemas.android.com/apk/res-auto ”, we can use res atuo namespace in Android studio, so we don't need to add the full class name of custom view.

3. In the view construction method, get our custom style

We have rewritten three construction methods. In the above construction methods, we said that the default layout file calls the construction method of two parameters, so remember to let all construction methods call the construction method of three parameters, and then obtain the self-defined attribute in the construction method of three parameters. At first, the construction methods of one parameter and two parameters are as follows:

It should be noted that super should be changed to this, and then let the construction method of one parameter refer to the construction method of two parameters, and the construction method of two parameters refer to the construction method of three parameters. The code is as follows:

4. Override OnDraw, onmesure methods

The drawing process of view starts from the performtravarsals method of viewroot. A view can be finally drawn through three processes: measure, layout and draw. Among them: • measure -- onmeasure(): used to measure the width and height of the view to determine the size of the view • layout -- onlayout(): used to determine the placement position of the view in the parent container ViewGroup • draw -- ondraw() : responsible for drawing the view on the screen

Let's take a look at the renderings at this time

Careful friends will find that in the above layout file, we set the width and height to wrap_ Content, but the rendering is not what we want, because the height and width measured by the system are match by default_ Parnet, when we set a clear width and height, the measurement result of the system is the result of our setting. This is right. But in addition to setting explicit width and height, no matter what we set to wrap_ Content or match_ Parent, the measurement result of the system is match_ Parent, so when we set wrap_ Content, we need to measure ourselves, that is, we need to rewrite the onmesure method

Here is our code for rewriting onmeasure:

Measurespec encapsulates the layout requirements passed from the parent layout to the child layout. The specmode of measurespec has three modes: (1) fully: generally, it sets an explicit value or match_ Parent, the parent element determines the size of the child element, and the child element will be limited to a given range, ignoring its own size; （2）AT_ Most (at most): indicates that the child element reaches at most a given maximum value, usually warp_ CONTENT；

Let's look at the renderings:

Now this is the result we want. Let's go back to the topic. Today we are talking about the randomly generated image verification code of the custom view. Now we have completed the part of the custom view, and I'll post the complete code

We added a click event. Every time I click view, I ask it to print the generated verification code, font color and font background color, as shown below:

The above is the whole content of this article. I hope it will be helpful to your study, and I hope you can support programming tips.