Androidの模倣度の高いWeChat決済パスワード入力制御サンプルコード

この記事では、主にAndroid模倣性の高いWeChat決済パスワード入力制御の具体的な実装コードを誰でも簡単に紹介します。具体的な内容は以下の通りです

WeChatの支払いパスワード制御と同様に、最近のプロジェクトではこの機能が必要なので、この機能を実装する必要があります
古い撮影方法では、この「小さいながらも美しい」コントロールのアイデアは次のようになります

Ⅰ。グリッドビューを使用して入力数字キーボードをシミュレートします。 、画面の下部からポップアップが表示されます

Ⅲ、入力数字キーボードのイベントを監視し、

パスワードボックス

に入力番号を入力し、パスワードの長さが指定された場合にイベントコールバックを実行します。マップは次のようになります:

まず、必要に応じてパスワード ボックスを動的にロードする必要があります:

for (int i = 0; i <img src="/static/imghwm/default1.png" data-src="https://img.php.cn/upload/article/000/000/013/2513ff716929a423feac0b80f0d13262-0.jpg?x-oss-process=image/resize,p_40" class="lazy" id="theimg" alt="Androidの模倣度の高いWeChat決済パスワード入力制御サンプルコード"    style="max-width:90%"  style="max-width:90%" title="Androidの模倣度の高いWeChat決済パスワード入力制御サンプルコード"> ここでパスワードの長さを 6 に設定します。そして、これらの 6 つのパスワード ボックス コントロールをブルーミングに追加します。 これらのコントロールの親コントロールに移動し、次の操作を実行できるように、各パスワード入力コントロールをコントロール配列  に配置します <p style="text-align: left;"></p> 次に、グリッドビューを使用して 12- を生成します。正方形のシミュレートされた数値キーボード。シミュレートされたキーボードは次のようになります。 <p style="text-align: left;"><a href="http://www.php.cn/wiki/58.html" target="_blank"></a></p><p style="text-align: left;"> ソース コードは次のようになります。 </p><pre class="brush:php;toolbar:false"> /**
  * 加载数据的代码
  */
 private void initData() {
  /* 初始化按钮上应该显示的数字 */
  for (int i = 1; i  map = new HashMap<string>();
   if (i  parent, View view,
     int position, long id) {
    if (position = -1 && currentIndex = -1) { // 判断是否删除完毕————要小心数组越界
       tvList[currentIndex--].setText("");
      }
     }
    }
   }
  });
 }
  /**
   * GrideView的适配器
   */ 
 BaseAdapter adapter = new BaseAdapter() {
  @Override
  public int getCount() {
   return valueList.size();
  }
  @Override
  public Object getItem(int position) {
   return valueList.get(position);
  }
  @Override
  public long getItemId(int position) {
   return position;
  }
  @SuppressWarnings("deprecation")
  @Override
  public View getView(int position, View convertView, ViewGroup parent) {
   ViewHolder viewHolder;
   if (convertView == null) {
    convertView = View.inflate(context, R.layout.item_gride, null);
    viewHolder = new ViewHolder();
    viewHolder.btnKey = (TextView) convertView
      .findViewById(R.id.btn_keys);
    convertView.setTag(viewHolder);
   } else {
    viewHolder = (ViewHolder) convertView.getTag();
   }
   viewHolder.btnKey.setText(valueList.get(position).get("name"));
   if (position == 9||position==11) {
    viewHolder.btnKey.setBackgroundDrawable(Utils.getStateListDrawable(context));
    viewHolder.btnKey.setEnabled(false);
   }
   if (position == 11) {
    viewHolder.btnKey.setBackgroundDrawable(Utils.getStateListDrawable(context));
   }
   return convertView;
  }
 };
 
 
 /**
  * 存放控件
  */
 public final class ViewHolder {
  public TextView btnKey;
 }</string>

シミュレートされたキーボードにデータを 0 ～ 9 および x としてロードし、このデータを追加します。 Populate規則に従って、このシミュレートされたキーボードは、ポップアップ ウィンドウにグリッドビューを接続し、画面からポップアップします。対応するコードは次のとおりです:

View contentView = LayoutInflater.from(context).inflate(
    R.layout.layout_popupdemo, null);// 定义后退弹出框
  gridView = (GridView) contentView.findViewById(R.id.gv_keybord);// 泡泡窗口的布局 
 popupWindow = new PopupWindow(contentView,
    ViewGroup.LayoutParams.MATCH_PARENT,// width
    ViewGroup.LayoutParams.WRAP_CONTENT);// higth
  popupWindow.setFocusable(false);
  popupWindow.setAnimationStyle(R.style.animation);
   //从底部弹出
　　public void show() {
  popupWindow.showAtLocation(rl_bottom, Gravity.BOTTOM, 0, 0); // 确定在界面中出现的位置
 }
 @Override
 public void onWindowFocusChanged(boolean hasWindowFocus) {
  super.onWindowFocusChanged(hasWindowFocus);
  show();
 }

このコントロールが読み込まれると、ポップアップします

最後に、シミュレートされたキーボードを監視し、シミュレートされたキーボードからの入力を入力する必要があります。パスワード ボックスは非常にハイエンドに見えますが、実際には Gridview の onitemclick イベントをリッスンします。対応するコードは次のとおりです:

gridView.setOnItemClickListener(new AdapterView.OnItemClickListener() {
   @Override
   public void onItemClick(AdapterView> parent, View view,
     int position, long id) {
    if (position = -1 && currentIndex = -1) { // 判断是否删除完毕————要小心数组越界
       tvList[currentIndex--].setText("");
      }
     }
    }
   }
  });

ユーザーが 0 ～ 9 の数字をクリックした場合、パスワード ボックスに入力します。ユーザーが Backspace キーをクリックすると、対応するパスワード ボックスの内容が削除されます。上で使用したテキスト ボックスの配列リストが便利であることがわかりましたか。Backspace キーのクリック効果が異なるため、注意してください。ここにスタイルを設定するコード

パスワード ボックスへの入力が完了すると、対応するコードは次のとおりです:

// 设置监听方法，在第6位输入完成后触发
 public void setOnFinishInput(final OnPasswordInputFinish pass) {
  tvList[5].addTextChangedListener(new TextWatcher() {
   @Override
   public void beforeTextChanged(CharSequence s, int start, int count,
     int after) {
   }
   @Override
   public void onTextChanged(CharSequence s, int start, int before,
     int count) {
   }
   @Override
   public void afterTextChanged(Editable s) {
    if (s.toString().length() == 1) {
     strPassword = ""; // 每次触发都要先将strPassword置空，再重新获取，避免由于输入删除再输入造成混乱
     for (int i = 0; i  いくつかの変更の後、最終的な効果は次のようになります。 : <p style="text-align: left;"></p> <p style="text-align: left;"></p>

以上がAndroidの模倣度の高いWeChat決済パスワード入力制御サンプルコードの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。