Android Custom Input Payment password soft keyboard instance code _android

Android Custom Input Payment password soft keyboard

Have the project needs to do a password lock function, as well as their own soft keyboard, similar and Alipay kind, here is the collation of information, we can see, if there is a mistake, please comment

Requirements: To achieve similar payment of Alipay input payment password function, the effect of the chart is as follows:

Soft keyboard Effect Diagram

Use the Android.inputmethodservice.KeyboardView class to customize the soft keyboard

The realization of soft keyboard

1. Customize the soft keyboard Passwordkeyboardview class with only numeric input, inherit from Android.inputmethodservice.KeyboardView

/** * Enter the keyboard layout control for the numeric password. * * public class Passwordkeyboardview extends Keyboardview implements Android.inputmethodservice.KeyboardView.OnKeyboa

  Rdactionlistener {//Key to differentiate left-bottom blank keys private static final int keycode_empty =-10;
  private int mdeletebackgroundcolor;
  Private Rect Mdeletedrawrect;

  Private drawable mdeletedrawable;

  Private Ionkeyboardlistener Monkeyboardlistener;
    Public Passwordkeyboardview (context, AttributeSet attrs) {Super (context, attrs);
  Init (context, attrs, 0); Public Passwordkeyboardview (context, AttributeSet attrs, int defstyleattr) {Super (context, attrs,
    DEFSTYLEATTR);
  Init (context, attrs, defstyleattr); } private void init (context context, AttributeSet attrs, int defstyleattr) {TypedArray a = Context.obtainsty
    Ledattributes (Attrs, R.styleable.passwordkeyboardview, defstyleattr, 0); mdeletedrawable = a.getdrawable (r.styleable.passwordkeyboardview_pkvdeletedrawable); Mdeletebackgroundcolor = A.getcolor (R.styleable.passwordkeyboardview_pkvdeletebackgroundcolor, Color.TRAN
    Sparent);

    A.recycle ();
    Set the layout of the soft keyboard keys keyboard keyboard = new keyboard (context, R.xml.keyboard_number_password);

    Setkeyboard (keyboard);
    SetEnabled (TRUE);
    Setpreviewenabled (FALSE);
  Setonkeyboardactionlistener (this);

    @Override public void OnDraw (Canvas Canvas) {Super.ondraw (Canvas);
    Iterate through all the keys list<keyboard.key> keys = Getkeyboard (). Getkeys (); for (Keyboard.key Key:keys) {//If the key is blank in the lower left corner, redraw the background of the key if (key.codes[0] = = keycode_empty) {Drawkeybac
      Kground (Key, canvas, Mdeletebackgroundcolor); //If the DELETE key is in the lower right corner, repaint the background and draw the deleted icon else if (key.codes[0] = = Keyboard.keycode_delete) {Drawkeybackground (
        Key, canvas, Mdeletebackgroundcolor);
      Drawdeletebutton (key, canvas); The background of the button is drawn with private void Drawkeybackground (Keyboard.key key, CaNvas canvas, int color) {colordrawable drawable = new colordrawable (color);
    Drawable.setbounds (key.x, key.y, key.x + key.width, key.y + key.height);
  Drawable.draw (canvas); //Draw Delete key private void Drawdeletebutton (Keyboard.key key, Canvas Canvas) {if (mdeletedrawable = null) r

    Eturn; Calculates the coordinates of the delete icon drawn (Mdeletedrawrect = null | | mdeletedrawrect.isempty ()) {int intrinsicwidth = mdeletedrawable.
      Getintrinsicwidth ();
      int intrinsicheight = Mdeletedrawable.getintrinsicheight ();
      int drawwidth = Intrinsicwidth;

      int drawheight = Intrinsicheight;
        Limit the size of the icon to prevent the icon from exceeding the key if (DrawWidth > Key.width) {drawwidth = Key.width;
      Drawheight = DrawWidth * intrinsicheight/intrinsicwidth;
        } if (Drawheight > Key.height) {drawheight = Key.height;
      DrawWidth = Drawheight * intrinsicwidth/intrinsicheight; //Get delete icon drawn coordinates int left = key.x + (Key.width- DrawWidth)/2;
      int top = key.y + (key.height-drawheight)/2;
    Mdeletedrawrect = new Rect (left, top, left + drawwidth, top + drawheight); ///Draw the deleted icon if (mdeletedrawrect!= null &&!mdeletedrawrect.isempty ()) {Mdeletedrawable.setbounds
      (Mdeletedrawrect.left, Mdeletedrawrect.top, Mdeletedrawrect.right, Mdeletedrawrect.bottom);
    Mdeletedrawable.draw (canvas); @Override public void OnKey (int primarycode, int[] keycodes) {//Handle keystrokes Click event//Click delete button if (Primaryco 
      De = = Keyboard.keycode_delete {if (Monkeyboardlistener!= null) {monkeyboardlistener.ondeletekeyevent (); 
        }///Click on other keys that are not in the lower left corner else if (Primarycode!= keycode_empty) {if (Monkeyboardlistener!= null) {
      Monkeyboardlistener.oninsertkeyevent (character.tostring (char) primarycode)); @Override public void onpress (int primarycode) {} @Override Public void onrelease (int primarycode) {} @Override public void Ontext (charsequence text) {} @Override PU

  Blic void Swipeleft () {} @Override public void Swiperight () {} @Override public void Swipedown () {}
   @Override public void Swipeup () {}/** * Sets the listening event for the keyboard. * * @param Listener * Monitor Event/public void Setionkeyboardlistener (Ionkeyboardlistener listener) {THIS.M
  Onkeyboardlistener = listener;

    public interface Ionkeyboardlistener {void oninsertkeyevent (String text);
  void Ondeletekeyevent ();

 }
}

2. Custom attributes:

Values/attrs.xml

<declare-styleable name= "Passwordkeyboardview" >
  <attr name= "pkvdeletedrawable" format= "Reference"/ >
  <attr name= "Pkvdeletebackgroundcolor" format= "color|reference"/>
</declare-styleable>

3. Soft keyboard Key of the layout file Res/xml/keyboard_number_password:

Description

1. Android:keywidth= "33.33333%p": Specifies the width of the key to ensure that each column of the keyboard is the same width
2. Android:keyheight= "8%p": Setting the height of the keyboard
3. Android:horizontalgap= "1DP": to implement a split line between each column of the keyboard
4. Android:verticalgap= "1DP": to implement the split line between each line of the keyboard

<?xml version= "1.0" encoding= "Utf-8"?> <keyboard xmlns:android= "http://schemas.android.com/apk/res/" Android "Android:keywidth=" 33.33333%p "android:keyheight=" 8%p "android:horizontalgap=" 1DP "android:verticalgap=" 1d P "> <Row> <key android:codes=" "android:keylabel=" 1 "/> <key android:codes=

  "Android:keylabel=" "2"/> <key android:codes= "Wuyi" android:keylabel= "3"/> </Row>
      <Row> <key android:codes= "android:keylabel=" 4 "/> <key android:codes=" 53 " Android:keylabel= "5"/> <key android:codes= "si" android:keylabel= "6"/> </Row> <r ow> <key android:codes= "android:keylabel=" 7 "/> <key android:codes=" "
    Roid:keylabel= "8"/> <key android:codes= "android:keylabel=" 9 "/> </Row> <Row> <key android:codes= "-10 "android:keylabel=" "/> <key android:codes=" "android:keylabel=" 0 "/> <key a

 Ndroid:codes= "-5" android:keyicon= "@mipmap/keyboard_backspace"/> </Row> </Keyboard>

3. Reference soft keyboard controls in the layout:

<[Package name]. Passwordkeyboardview
  android:layout_width= "match_parent"
  android:layout_height= "Wrap_content"
  Android:background= "#b0b0b0"
  android:focusable= "true"
  android:focusableintouchmode= "true"
  Android: Keybackground= "#ffffff"
  android:keytextcolor= "#000000"
  android:shadowcolor= "#00000000"
  android: shadowradius= "0"
  app:pkvdeletebackgroundcolor= "#d2d2d2"
  app:pkvdeletedrawable= "@drawable/keyboard_ Backspace "/>

Implementation of random numeric keypad

There are two ways to realize this:

1. In the OnDraw method to redraw the text on the keyboard, overwriting the original keyboard, this implementation is relatively troublesome.
2. Call the Keyboardview.setkeyboard () method to reset the keyboard and implement the following code:

0-9 of the number
private final list<character> keycodes = arrays.aslist (
    ' 0 ', ' 1 ', ' 2 ', ' 3 ', ' 4 ', ' 5 ', ' 6 ', ' 7 ', ', ' 8 ', ' 9 ');

/**
 * Randomly disrupts the numeric order displayed on the numeric keypad.
 */public
void Shufflekeyboard () {
  keyboard keyboard = Getkeyboard ();
  if (keyboard!= null && keyboard.getkeys ()!= null
      && Keyboard.getkeys (). Size () > 0) {
    //random sort Digital
    collections.shuffle (keycodes);

    Iterate through all the keys
    list<keyboard.key> keys = Getkeyboard (). Getkeys ();
    int index = 0;
    for (Keyboard.key Key:keys) {
      //If the key is digital if
      (Key.codes[0]!= keycode_empty
          && key.codes[0]!= key Board. Keycode_delete) {
        char code = keycodes.get (index++);
        Key.codes[0] = code;
        Key.label = character.tostring (code);
      }
    }
    Update keyboard
    Setkeyboard (keyboard);
  }

Call Shufflekeyboard to generate a random keyboard.

The effect of the final implementation is as follows:

Random keyboard

Step on the pit.

1. Click on the key to the magnifying glass effect hint

Soft keyboard The default click button will show Magnifier effect, if you do not need to use Setpreviewenabled (false) settings do not show prompts.
You can use Android:keypreviewlayout in the layout to specify the layout of the hint text.

2. The key text is not clear

The soft keyboard key defaults to a shaded effect, causing the text to be unclear, and you can remove the shadow using the following method:

<[Package name]. Passwordkeyboardview
  android:shadowcolor= "@color/transparent"
  android:shadowradius= "0"
  ...
  />

Thank you for reading, I hope to help you, thank you for your support for this site!