Android imitation WeChat Alipay payment password input box example

Hello, I'm Li Xiaohua, a cute man. What we bring today is the imitation WeChat / Alipay password entry box. This effect has been out for some time, so there are still many netizens to realize it by searching, but, but! After a review, I found that their implementations are divided into two categories.

1、 Directly inherit EditText, and then make articles in OnDraw; 2、 EditText has a ViewGroup outside. I don't like these two implementation methods. I feel a little bloated, so I'll introduce my implementation method in detail: directly inherit the view, obtain the user's input, and then draw it out.

What we implement is the above password input box, this keyboard... The system comes with Oh, call the user input method for input, which is convenient for expansion.

Next, let's analyze how to implement this view. Start with the simple. Extensions view implements three constructors, which will not be discussed in detail, and then onmeasure:

What measurewidth and measureheight do is wrap_ Content returns - 1, otherwise it returns the exact size. PS: there is a previously defined size variable, which represents the side length of each grid.

OK, after the measurement, let's draw the rounded rectangle on the outside and the dividing line on the inside.

It is easy to understand. The reason why the width and height here are - 2 is that when drawing a rounded rectangle, if the line width is not 1, it is drawn based on the midpoint of the line width, which will cause the lines on the lower and right to be thinner, so leave a little edge here.

Well, after drawing these, fill in the point data test. Naturally, we will have the following effect diagram.

It looks like it's finished. In fact, it's still early. We haven't monitored the user's input. This is the key and difficult point. Please draw it! Let's recall how an ordinary EditText gets input. 1. Click to get the focus; 2. Coloring, cursor flashing prompt; 3. Pop up the soft keyboard; Then the user inputs; Well, let's do this first. Click to pop up a keyboard. Otherwise, how can I input it?

First, during initialization: this. Setfocusable (true); this.setFocusableInTouchMode(true); Let this view get the focus, and then in ontouchevent

Input is an input method management class. Click to get the focus, and then pop up the soft keyboard. If you lose the focus, you must hide the soft keyboard!

Oncheckistexteditor(), please override this method and return true. In order to tell the system that this view can accept input. OK, the keyboard pops up. How can we monitor user input? Don't worry. Whether it's a soft keyboard or a "hard" keyboard, the user's key is a keyevent. We directly set a listener to get the key number pressed by the user, and we will know what the user pressed. this.setOnKeyListener(new MyKeyListener());

Press the key representing the number, record it, and press Delete to delete it. Here is an ensurefinishinput, which is used to judge whether the input is finished or not. After the input, the callback interface will be called.

OK, it looks like it's over, but the pattern Tucson is broken. First of all, we pop up the soft keyboard above, without specifying the input type or operation type! what is it? Think of EditText. There is an inputtype and imetype. Otherwise, we only deal with numbers. He pops up an English keyboard for me. What's the matter? There is also a hidden bug. Click del to delete the soft keyboard without keyevent! This is more troublesome.

In order to solve the above problem, let's talk about input method first. What if we want to accept Chinese input? It's impossible to listen to a keyevent. The input method has phrases and words. Therefore, when the system pops up the input method, a link will be established with the target view, and then text will be transmitted to the view.

Therefore, we first establish a connection and rewrite the view method.

Here, you can set the numeric keypad that I want to pop up, and then implement base input connection

Here, we rewrite delete... Method, because pressing del on the soft keyboard will trigger this method, we manually simulate sending keyevent to view. Why not operate directly here? Because... If you have a 'hard' keyboard, that is, a mobile phone with an external physical keyboard, its del will still be triggered. We will handle it uniformly. Here is the great God on the reference stack overflow. I have to say that Google Dafa is good.

At this point, we have probably realized all the functions. However, there is another problem. If we press the home key or switch apps, our keyboard will not be hidden. Therefore, we still need to do this:

So far, the perfect end.

Code download: pswinputviewdemo_ jb51.rar

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.