一款简易的自定义数字键盘输入控件

实际效果如下:

首先布局layout文件,采用三总四横等比的方式进行布局:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:paddingStart="@dimen/dp_30"
    android:paddingEnd="@dimen/dp_30"
    android:paddingTop="@dimen/dp_20"
    android:paddingBottom="@dimen/dp_20"
    android:clickable="true"
    android:background="@drawable/concise_keyboard_bg">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:orientation="horizontal"
        android:layout_weight="1"
        android:gravity="center">

        <Button
            android:id="@+id/btn_of_1"
            android:layout_width="@dimen/dp_66"
            android:layout_height="@dimen/dp_66"
            android:text="1"
            android:stateListAnimator="@null"
            android:textColor="@color/text_first_level_color"
            android:textSize="@dimen/sp_28"
            android:background="@drawable/keyboard_btn_bg_selector"/>

        <Button
            android:id="@+id/btn_of_2"
            android:layout_width="@dimen/dp_66"
            android:layout_height="@dimen/dp_66"
            android:text="2"
            android:stateListAnimator="@null"
            android:layout_marginStart="@dimen/dp_50"
            android:textColor="@color/text_first_level_color"
            android:textSize="@dimen/sp_28"
            android:background="@drawable/keyboard_btn_bg_selector"/>

        <Button
            android:id="@+id/btn_of_3"
            android:layout_width="@dimen/dp_66"
            android:layout_height="@dimen/dp_66"
            android:text="3"
            android:stateListAnimator="@null"
            android:layout_marginStart="@dimen/dp_50"
            android:textColor="@color/text_first_level_color"
            android:textSize="@dimen/sp_28"
            android:background="@drawable/keyboard_btn_bg_selector"/>

    </LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:orientation="horizontal"
        android:layout_weight="1"
        android:layout_marginTop="@dimen/dp_14"
        android:gravity="center">

        <Button
            android:id="@+id/btn_of_4"
            android:layout_width="@dimen/dp_66"
            android:layout_height="@dimen/dp_66"
            android:text="4"
            android:stateListAnimator="@null"
            android:textColor="@color/text_first_level_color"
            android:textSize="@dimen/sp_28"
            android:background="@drawable/keyboard_btn_bg_selector"/>

        <Button
            android:id="@+id/btn_of_5"
            android:layout_width="@dimen/dp_66"
            android:layout_height="@dimen/dp_66"
            android:text="5"
            android:stateListAnimator="@null"
            android:layout_marginStart="@dimen/dp_50"
            android:textColor="@color/text_first_level_color"
            android:textSize="@dimen/sp_28"
            android:background="@drawable/keyboard_btn_bg_selector"/>

        <Button
            android:id="@+id/btn_of_6"
            android:layout_width="@dimen/dp_66"
            android:layout_height="@dimen/dp_66"
            android:text="6"
            android:stateListAnimator="@null"
            android:layout_marginStart="@dimen/dp_50"
            android:textColor="@color/text_first_level_color"
            android:textSize="@dimen/sp_28"
            android:background="@drawable/keyboard_btn_bg_selector"/>

    </LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:orientation="horizontal"
        android:layout_weight="1"
        android:layout_marginTop="@dimen/dp_14"
        android:gravity="center">

        <Button
            android:id="@+id/btn_of_7"
            android:layout_width="@dimen/dp_66"
            android:layout_height="@dimen/dp_66"
            android:text="7"
            android:stateListAnimator="@null"
            android:textColor="@color/text_first_level_color"
            android:textSize="@dimen/sp_28"
            android:background="@drawable/keyboard_btn_bg_selector"/>

        <Button
            android:id="@+id/btn_of_8"
            android:layout_width="@dimen/dp_66"
            android:layout_height="@dimen/dp_66"
            android:text="8"
            android:stateListAnimator="@null"
            android:layout_marginStart="@dimen/dp_50"
            android:textColor="@color/text_first_level_color"
            android:textSize="@dimen/sp_28"
            android:background="@drawable/keyboard_btn_bg_selector"/>

        <Button
            android:id="@+id/btn_of_9"
            android:layout_width="@dimen/dp_66"
            android:layout_height="@dimen/dp_66"
            android:text="9"
            android:stateListAnimator="@null"
            android:layout_marginStart="@dimen/dp_50"
            android:textColor="@color/text_first_level_color"
            android:textSize="@dimen/sp_28"
            android:background="@drawable/keyboard_btn_bg_selector"/>

    </LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:orientation="horizontal"
        android:layout_weight="1"
        android:layout_marginTop="@dimen/dp_14"
        android:gravity="center">

        <Button
            android:id="@+id/btn_of_del"
            android:layout_width="@dimen/dp_66"
            android:layout_height="@dimen/dp_66"
            android:text="删除"
            android:stateListAnimator="@null"
            android:textColor="@color/text_second_level_color"
            android:textSize="@dimen/sp_24"
            android:background="@drawable/keyboard_btn_bg_selector"/>

        <Button
            android:id="@+id/btn_of_0"
            android:layout_width="@dimen/dp_66"
            android:layout_height="@dimen/dp_66"
            android:text="0"
            android:stateListAnimator="@null"
            android:layout_marginStart="@dimen/dp_50"
            android:textColor="@color/text_first_level_color"
            android:textSize="@dimen/sp_28"
            android:background="@drawable/keyboard_btn_bg_selector"/>

        <Button
            android:id="@+id/btn_of_sure"
            android:layout_width="@dimen/dp_66"
            android:layout_height="@dimen/dp_66"
            android:text="确定"
            android:stateListAnimator="@null"
            android:layout_marginStart="@dimen/dp_50"
            android:textColor="@color/keyboard_join_room_btn_txt_color"
            android:textSize="@dimen/sp_24"
            android:background="@drawable/keyboard_btn_bg_selector"/>

    </LinearLayout>

</LinearLayout>

其次,采用继承LinearLayout的方式进行View扩展以达到自定义的目的。

可以看到,由于键盘上按钮功能比较单一,故避免采用重复方式进行控件初始化和相关操作,可以简化如下:

public class InputKeyboardView extends LinearLayout implements View.OnClickListener {

    private static final int[] mBtnIdArray = {
            R.id.btn_of_0, R.id.btn_of_1, R.id.btn_of_2, R.id.btn_of_3, R.id.btn_of_4, R.id.btn_of_5,
            R.id.btn_of_6, R.id.btn_of_7, R.id.btn_of_8, R.id.btn_of_9, R.id.btn_of_del, R.id.btn_of_sure
    };

    private OnActionChangedListener mListener;

    public void setOnActionChangedListener(OnActionChangedListener listener) {
        this.mListener = listener;
    }

    public InputKeyboardView(Context context) {
        super(context);
        initView(context);
    }

    public InputKeyboardView(Context context, @Nullable AttributeSet attrs) {
        super(context, attrs);
        initView(context);
    }

    public InputKeyboardView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        initView(context);
    }

    private void initView(Context context) {
        View view = inflate(context, R.layout.keyboard_layout, this);
        for (int id : mBtnIdArray) {
            view.findViewById(id).setOnClickListener(this);
        }
    }

    @Override
    public void onClick(View v) {
        if (v.getId() != NO_ID && mListener != null) {
            for (int i = 0; i < mBtnIdArray.length; i++) {
                if (v.getId() == mBtnIdArray[i]) {
                    if (mBtnIdArray[i] == R.id.btn_of_del) {
                        mListener.onDeleteClicked();
                    } else if (mBtnIdArray[i] == R.id.btn_of_sure) {
                        mListener.onSureClicked();
                    } else {
                        mListener.onAfterInput(i);
                    }
                }
            }
        }
    }

    /**
     * 输入文本变化的回调
     */
    public interface OnActionChangedListener {
        void onAfterInput(int num);
        void onDeleteClicked();
        void onSureClicked();
    }
}

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值