Android自定義軟鍵盤樣式:字母、數字、標點三種切換

第一次寫,直接上代碼吧:

先看效果圖:




1.在需要的調用軟鍵盤的activity_mian.xml中加入鍵盤控件

<!--自定義鍵盤控件-->
<RelativeLayout
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:gravity="center_horizontal">

    <android.inputmethodservice.KeyboardView
        android:id="@+id/keyboard_view"
        android:shadowRadius="0.0"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:focusable="true"
        android:focusableInTouchMode="true"
        android:keyPreviewLayout="@layout/key_preview_layout"
        android:background="#D6D9DE"
        android:keyBackground="@drawable/btn_keyboard_key"
        android:keyTextColor="#747474"
        android:keyTextSize="36dp"
        android:paddingTop="10dp"
        android:paddingBottom="10dp"
        android:paddingLeft="95dp"
        android:paddingRight="95dp"
        android:visibility="gone"
        />
</RelativeLayout>
1.1

android:keyPreviewLayout="@layout/key_preview_layout"這個是長按鍵盤時彈出框的樣式,如果不寫,系統默認,默認的有時會會看不清
key_preview_layout.xml:

<?xml version="1.0" encoding="utf-8"?>
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
          android:layout_width="wrap_content"
          android:layout_height="wrap_content"
          android:textSize="40sp"
          android:textColor="@android:color/white"
          android:gravity="center"
          android:background="#80929299"/>
1.2
android:keyBackground="@drawable/btn_keyboard_key"按鍵的形狀
btn_keyboard_key.xml:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <solid android:color="#FFFFFFFF"/>
    <corners android:topLeftRadius="8dip"
        android:topRightRadius="8dip"
        android:bottomRightRadius="8dip"
        android:bottomLeftRadius="8dip" />
</shape>

2.然後在res文件夾下新建文件夾,裏面新建三個文件,即每種鍵盤樣式的佈局分別爲qwerty.xml, symbols.xml, punctuate.xml

字母鍵盤-qwerty.xml:

<?xml version="1.0" encoding="UTF-8"?>
<Keyboard android:keyWidth="100dp" android:keyHeight="60dp"
   android:horizontalGap="10dp" android:verticalGap="15dp"
   xmlns:android="http://schemas.android.com/apk/res/android">
   <Row>
      <Key android:codes="113" android:keyEdgeFlags="left"
         android:keyLabel="q"  />
      <Key android:codes="119" android:keyLabel="w" />
      <Key android:codes="101" android:keyLabel="e" />
      <Key android:codes="114" android:keyLabel="r" />
      <Key android:codes="116" android:keyLabel="t" />
      <Key android:codes="121" android:keyLabel="y" />
      <Key android:codes="117" android:keyLabel="u" />
      <Key android:codes="105" android:keyLabel="i" />
      <Key android:codes="111" android:keyLabel="o" />
      <Key android:codes="112" android:keyEdgeFlags="right"
         android:keyLabel="p" />
   </Row>
   <Row>
      <Key android:horizontalGap="4.999995%p" android:codes="97"
         android:keyEdgeFlags="left" android:keyLabel="a" />
      <Key android:codes="115" android:keyLabel="s" />
      <Key android:codes="100" android:keyLabel="d" />
      <Key android:codes="102" android:keyLabel="f" />
      <Key android:codes="103" android:keyLabel="g" />
      <Key android:codes="104" android:keyLabel="h" />
      <Key android:codes="106" android:keyLabel="j" />
      <Key android:codes="107" android:keyLabel="k" />
      <Key android:codes="108" android:keyEdgeFlags="right"
         android:keyLabel="l" />
   </Row>
   <Row>
      <Key android:keyWidth="110dp" android:codes="-1"
         android:keyEdgeFlags="left" android:isModifier="true"
         android:horizontalGap="33dp"
         android:isSticky="true" android:keyIcon="@drawable/shift" />
      <Key android:codes="122" android:keyLabel="z" android:horizontalGap="30dp"/>
      <Key android:codes="120" android:keyLabel="x" />
      <Key android:codes="99" android:keyLabel="c" />
      <Key android:codes="118" android:keyLabel="v" />
      <Key android:codes="98" android:keyLabel="b" />
      <Key android:codes="110" android:keyLabel="n" />
      <Key android:codes="109" android:keyLabel="m" />
      <Key android:keyWidth="110dp" android:codes="-5"
         android:horizontalGap="30dp"
         android:keyEdgeFlags="right" android:isRepeatable="true"
         android:keyIcon="@drawable/delete" />
   </Row>
   <Row android:rowEdgeFlags="bottom">
      <Key android:keyWidth="110dp" android:codes="-2" android:horizontalGap="43dp"
         android:keyIcon="@drawable/number" />
      <Key android:keyWidth="110dp" android:codes="46"
         android:keyIcon="@drawable/point" />
      <Key android:keyWidth="540dp" android:codes="32"
         android:isRepeatable="true" android:keyIcon="@drawable/space" />
      <Key android:keyWidth="110dp" android:codes="47"
         android:keyIcon="@drawable/gang"/>
      <Key android:keyWidth="110dp" android:codes="-3"
         android:keyEdgeFlags="right" android:keyIcon="@drawable/complete" />
   </Row>
</Keyboard>
數字鍵盤-symbols.xml:

<?xml version="1.0" encoding="utf-8"?>
<Keyboard xmlns:android="http://schemas.android.com/apk/res/android"
   android:keyWidth="100dp" android:horizontalGap="10dp"
   android:verticalGap="15dp" android:keyHeight="60dp">

   <Row>
      <Key android:codes="49" android:keyEdgeFlags="left"
         android:keyLabel="1"  />
      <Key android:codes="50" android:keyLabel="2" />
      <Key android:codes="51" android:keyLabel="3" />
      <Key android:codes="52" android:keyLabel="4" />
      <Key android:codes="53" android:keyLabel="5" />
      <Key android:codes="54" android:keyLabel="6" />
      <Key android:codes="55" android:keyLabel="7" />
      <Key android:codes="55" android:keyLabel="8" />
      <Key android:codes="56" android:keyLabel="9" />
      <Key android:codes="48" android:keyEdgeFlags="right"
         android:keyLabel="0" />
   </Row>
   <Row>
      <Key android:codes="45" android:keyEdgeFlags="left"
         android:keyLabel="-"  />
      <Key android:codes="47" android:keyLabel="/" />
      <Key android:codes="65306" android:keyLabel=":" />
      <Key android:codes="65307" android:keyLabel=";" />
      <Key android:codes="65288" android:keyLabel="(" />
      <Key android:codes="65289" android:keyLabel=")" />
      <Key android:codes="37" android:keyLabel="%" />
      <Key android:codes="64" android:keyLabel="\@" />
      <Key android:codes="8220" android:keyLabel="“" />
      <Key android:codes="8221" android:keyEdgeFlags="right"
         android:keyLabel="”" />
   </Row>
   <Row>
      <Key android:keyWidth="110dp" android:codes="-7"
         android:keyEdgeFlags="left" android:isModifier="true" android:horizontalGap="90dp"
         android:isSticky="true" android:keyIcon="@drawable/punctuate" />
      <Key android:codes="12290" android:keyLabel="。" android:horizontalGap="30dp"/>
      <Key android:codes="65292" android:keyLabel="," />
      <Key android:codes="12289" android:keyLabel="、" />
      <Key android:codes="65311" android:keyLabel="?" />
      <Key android:codes="65281" android:keyLabel="!" />
      <Key android:codes="46" android:keyLabel="." />
      <Key android:keyWidth="110dp" android:codes="-5"
         android:horizontalGap="30dp"
         android:keyEdgeFlags="right" android:isRepeatable="true"
         android:keyIcon="@drawable/delete" />
   </Row>
   <Row android:rowEdgeFlags="bottom">
      <Key android:keyWidth="110dp" android:codes="-2" android:horizontalGap="90dp"
         android:keyIcon="@drawable/pinyin" />
      <Key android:keyWidth="650dp" android:codes="32" android:horizontalGap="30dp"
         android:isRepeatable="true" android:keyIcon="@drawable/space" />
      <Key android:keyWidth="110dp" android:codes="-3" android:horizontalGap="30dp"
         android:keyEdgeFlags="right" android:keyIcon="@drawable/complete" />
   </Row>

</Keyboard>
標點鍵盤-punctuate.xml

<?xml version="1.0" encoding="utf-8"?>
<Keyboard xmlns:android="http://schemas.android.com/apk/res/android"
    android:keyWidth="100dp" android:horizontalGap="17dp"
    android:verticalGap="15dp" android:keyHeight="60dp">

    <Row>
        <Key android:codes="12304" android:keyEdgeFlags="left"
             android:keyLabel="【"  android:horizontalGap="50dp"/>
        <Key android:codes="12305" android:keyLabel="】" />
        <Key android:codes="65371" android:keyLabel="{" />
        <Key android:codes="65373" android:keyLabel="}" />
        <Key android:codes="35" android:keyLabel="#" />
        <Key android:codes="94" android:keyLabel="^" />
        <Key android:codes="42" android:keyLabel="*" />
        <Key android:codes="43" android:keyLabel="+" />
        <Key android:codes="61" android:keyEdgeFlags="right"
            android:keyLabel="=" />
    </Row>
    <Row>
        <Key android:codes="45" android:keyEdgeFlags="left"
            android:keyLabel="-"  android:horizontalGap="50dp"/>
        <Key android:codes="8212" android:keyLabel="—" />
        <Key android:codes="92" android:keyLabel="&#92;&#92;" />
        <Key android:codes="124" android:keyLabel="|" />
        <Key android:codes="126" android:keyLabel="~" />
        <Key android:codes="12298" android:keyLabel="《" />
        <Key android:codes="12299" android:keyLabel="》" />
        <Key android:codes="38" android:keyLabel="&#038;"/>
        <Key android:codes="65509" android:keyEdgeFlags="right"
            android:keyLabel="¥" />
    </Row>
    <Row>
        <Key android:keyWidth="110dp" android:codes="-7"
            android:keyEdgeFlags="left" android:isModifier="true"
            android:horizontalGap="80dp"
            android:isSticky="true" android:keyIcon="@drawable/number" />
        <Key android:codes="8230" android:keyLabel="…" android:horizontalGap="30dp"/>
        <Key android:codes="65509" android:keyLabel="¥" />
        <Key android:codes="12289" android:keyLabel="、" />
        <Key android:codes="65311" android:keyLabel="?" />
        <Key android:codes="8216" android:keyLabel="‘" />
        <Key android:codes="8217" android:keyLabel="’" />
        <Key android:keyWidth="110dp" android:codes="-5"
            android:horizontalGap="30dp"
            android:keyEdgeFlags="right" android:isRepeatable="true"
            android:keyIcon="@drawable/delete" />
    </Row>
    <Row android:rowEdgeFlags="bottom">
        <Key android:keyWidth="110dp" android:codes="-2" android:horizontalGap="80dp"
            android:keyIcon="@drawable/pinyin" />
        <Key android:keyWidth="685dp" android:codes="32" android:horizontalGap="30dp"
            android:isRepeatable="true" android:keyIcon="@drawable/space" />
        <Key android:keyWidth="110dp" android:codes="-3" android:horizontalGap="30dp"
            android:keyEdgeFlags="right" android:keyIcon="@drawable/complete" />
    </Row>

</Keyboard>
android:keyIcon="@drawable/space" 的部分沒有圖片的話可以換成 android:keyLabel=" "括號裏用相應字母或符號代替


3.然後就是KeyBoardUtil工具類,網上有很多內容大同小異,我爲了實現三種鍵盤的切換進行了一些改動

KeyBoardUtil.java

package com.dcdz.app.base;

import android.app.Activity;
import android.content.Context;
import android.inputmethodservice.Keyboard;
import android.inputmethodservice.Keyboard.Key;
import android.inputmethodservice.KeyboardView;
import android.inputmethodservice.KeyboardView.OnKeyboardActionListener;
import android.text.Editable;
import android.view.View;
import android.widget.EditText;

import com.dcdz.app.R;

import java.util.List;

public class KeyboardUtil {
    private Context ctx;
    private Activity act;
    private KeyboardView keyboardView;
    private Keyboard k1;// 字母鍵盤
    private Keyboard k2;// 數字鍵盤
    private Keyboard k3;//標點符號鍵盤
    public boolean isnun = false;// 是否數據鍵盤
    public boolean ispun = false;//是否標點鍵盤
    public boolean isupper = false;// 是否大寫

    public static final int KEYCODE_PUN = -7;

    private EditText ed;

    public KeyboardUtil(Activity act, Context ctx, EditText edit) {
        this.act = act;
        this.ctx = ctx;
        this.ed = edit;
        k1 = new Keyboard(ctx, R.xml.qwerty);
        k2 = new Keyboard(ctx, R.xml.symbols);
        k3 = new Keyboard(ctx,R.xml.punctuate);
        keyboardView = (KeyboardView) act.findViewById(R.id.keyboard_view);
        keyboardView.setKeyboard(k1);
        keyboardView.setEnabled(true);
        keyboardView.setPreviewEnabled(true);
        keyboardView.setOnKeyboardActionListener(listener);
}

    private OnKeyboardActionListener listener = new OnKeyboardActionListener() {
        @Override
        public void swipeUp() {
        }

        @Override
        public void swipeRight() {
        }

        @Override
        public void swipeLeft() {
        }

        @Override
        public void swipeDown() {
        }

        @Override
        public void onText(CharSequence text) {
        }

        @Override
        public void onRelease(int primaryCode) {
        }

        @Override
        public void onPress(int primaryCode) {
        }

        @Override
        public void onKey(int primaryCode, int[] keyCodes) {
            Editable editable = ed.getText();
            int start = ed.getSelectionStart();
            if (primaryCode == Keyboard.KEYCODE_CANCEL) {// 完成
                hideKeyboard();
            } else if (primaryCode == Keyboard.KEYCODE_DELETE) {// 回退
                if (editable != null && editable.length() > 0) {
                    if (start > 0) {
                        editable.delete(start - 1, start);
                    }
                }
            } else if (primaryCode == Keyboard.KEYCODE_SHIFT) {// 大小寫切換
                changeKey();
                keyboardView.setKeyboard(k1);


            } else if (primaryCode == Keyboard.KEYCODE_MODE_CHANGE) {// 數字鍵盤切換
                if (isnun) {
                    isnun = false;
                    keyboardView.setKeyboard(k1);
                } else {
                    isnun = true;
                    keyboardView.setKeyboard(k2);
                }
            }else if(primaryCode == KEYCODE_PUN){
                if(ispun){
                    ispun = false;
                    keyboardView.setKeyboard(k2);
                }else {
                    ispun = true;
                    keyboardView.setKeyboard(k3);
                }
            }
            else if (primaryCode == 57419) { // go left
                if (start > 0) {
                    ed.setSelection(start - 1);
                }
            } else if (primaryCode == 57421) { // go right
                if (start < ed.length()) {
                    ed.setSelection(start + 1);
                }
            } else {
                editable.insert(start, Character.toString((char) primaryCode));
            }
        }
    };

    /**
     * 鍵盤大小寫切換
     */
    private void changeKey() {
        List<Key> keylist = k1.getKeys();
        if (isupper) {//大寫切換小寫
            isupper = false;
            for(Key key:keylist){
                if (key.label!=null && isword(key.label.toString())) {
                    key.label = key.label.toString().toLowerCase();
                    key.codes[0] = key.codes[0]+32;
                }
            }
        } else {//小寫切換大寫
            isupper = true;
            for(Key key:keylist){
                if (key.label!=null && isword(key.label.toString())) {
                    key.label = key.label.toString().toUpperCase();
                    key.codes[0] = key.codes[0]-32;
                }
            }
        }
    }

    public void showKeyboard() {
        int visibility = keyboardView.getVisibility();
        if (visibility == View.GONE || visibility == View.INVISIBLE) {
            keyboardView.setVisibility(View.VISIBLE);
        }
    }

    public void hideKeyboard() {
        int visibility = keyboardView.getVisibility();
        if (visibility == View.VISIBLE) {
            keyboardView.setVisibility(View.INVISIBLE);
        }
    }

    private boolean isword(String str){
        String wordstr = "abcdefghijklmnopqrstuvwxyz";
        if (wordstr.indexOf(str.toLowerCase())>-1) {
            return true;
        }
        return false;
    }


}


4.最後是調用

4.1在Fragment裏調

一般的項目都是在Fragment裏調的,這個根據你的文本框的位置具體來定吧

我這邊內容較多,只寫關鍵代碼

public class UserLoginFragment extends SupportFragment {
    FragmentFingerUserloginBinding binding;
    private EditText etUserName;
    private EditText etPassword;
 
    private Context ctx;
    private Activity act;
    private KeyboardView keyboardView;
  
   
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
                             Bundle savedInstanceState) {
        binding = DataBindingUtil.inflate(inflater, R.layout.fragment_finger_userlogin, container, false);

        act = getActivity();
        ctx = getActivity().getBaseContext();
        keyboardView = (KeyboardView) getActivity().findViewById(R.id.keyboard_view);
       
        etUserName = binding.etUsername;
        etPassword = binding.etPassword;

        initView();
        return binding.getRoot();
    }

    private void initView() {
        if (binding != null) {
            etUserName.requestFocus();
//            etUserName.setFocusableInTouchMode(true);
            etUserName.addTextChangedListener(watcher);
            etPassword.addTextChangedListener(watcher);

            etUserName.setImeOptions(EditorInfo.IME_FLAG_NO_EXTRACT_UI);
            etPassword.setImeOptions(EditorInfo.IME_FLAG_NO_EXTRACT_UI);

            //調用自定義鍵盤
            etUserName.setOnTouchListener(new View.OnTouchListener() {
                @Override
                public boolean onTouch(View v, MotionEvent event) {
                    keyboardView.setKeyboard(k1);
//                    int inputback = etUserName.getInputType();
//                    etUserName.setInputType(InputType.TYPE_NULL);
                    new KeyboardUtil(act,act.getBaseContext(), etUserName).showKeyboard();
//                    etUserName.setInputType(inputback);
                    return false;
                }
            });
            etPassword.setOnTouchListener(new View.OnTouchListener() {
                @Override
                public boolean onTouch(View v, MotionEvent event) {
                    keyboardView.setKeyboard(k2);
                    new KeyboardUtil(act, act.getBaseContext(), etPassword).showKeyboard();
                    return false;
                }
            });
        }

    }

}


4.2在Activity裏調,在Activity裏調我是爲了在這裏實現觸摸屏幕其他位置隱藏軟鍵盤

關鍵代碼

public class FingerActivity extends SupportActivity {
    private KeyboardView keyboardView;

    @SuppressLint("ResourceType")
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        binding = DataBindingUtil.setContentView(this, R.layout.activity_finger);

        keyboardView = (KeyboardView) findViewById(R.id.keyboard_view);

        initView();
        loadRootFragment(new UserLoginFragment());
    }

public boolean onTouchEvent(MotionEvent event) {
        if(null != this.getCurrentFocus()){
            /**
             * 點擊空白位置 隱藏軟鍵盤
             */
            keyboardView.setVisibility(View.INVISIBLE);
        }
        return super .onTouchEvent(event);
    }

5到這裏即基本可以實現了,在使用的時候肯定還會遇到很多小問題,這裏也不一 一列舉了。









發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章