인앱 키보드

이 답변은 앱 내에서 독점적으로 사용할 맞춤형 키보드를 만드는 방법을 알려줍니다. 모든 앱에서 사용할 수있는 시스템 키보드를 만들고 싶다면 다른 답변 을 참조하십시오 .

예제는 다음과 같습니다. 모든 키보드 레이아웃에 대해 수정할 수 있습니다.

1. 새 Android 프로젝트 시작

내 프로젝트 이름을 InAppKeyboard. 원하는대로 전화하십시오.

2. 레이아웃 파일 추가

키보드 배열

res/layout폴더에 레이아웃 파일을 추가 합니다. 나는 나의 것을 불렀다 keyboard. 키보드는 이 xml 레이아웃 파일에서 확장 할 사용자 지정 복합보기 입니다. 원하는 레이아웃을 사용하여 키를 정렬 할 수 있지만 LinearLayout. merge태그에 유의하십시오 .

res / layout / keyboard.xml

<merge xmlns:android="http://schemas.android.com/apk/res/android">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal">

            <Button
                android:id="@+id/button_1"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:text="1"/>

            <Button
                android:id="@+id/button_2"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:text="2"/>

            <Button
                android:id="@+id/button_3"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:text="3"/>

            <Button
                android:id="@+id/button_4"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:text="4"/>

            <Button
                android:id="@+id/button_5"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:text="5"/>

        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal">

            <Button
                android:id="@+id/button_6"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:text="6"/>

            <Button
                android:id="@+id/button_7"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:text="7"/>

            <Button
                android:id="@+id/button_8"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:text="8"/>

            <Button
                android:id="@+id/button_9"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:text="9"/>

            <Button
                android:id="@+id/button_0"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:text="0"/>

        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal">

            <Button
                android:id="@+id/button_delete"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="2"
                android:text="Delete"/>

            <Button
                android:id="@+id/button_enter"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="3"
                android:text="Enter"/>

        </LinearLayout>
    </LinearLayout>

</merge>

활동 레이아웃

데모 목적으로 우리 활동에는 단일이 EditText있고 키보드는 맨 아래에 있습니다. 내 사용자 정의 키보드보기를 호출했습니다 MyKeyboard. (곧이 코드를 추가 할 예정이므로 지금은 오류를 무시하십시오.) 모든 키보드 코드를 단일보기에 넣는 이점은 다른 활동이나 앱에서 쉽게 재사용 할 수 있다는 것입니다.

res / layout / activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.example.inappkeyboard.MainActivity">

    <EditText
        android:id="@+id/editText"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="#c9c9f1"
        android:layout_margin="50dp"
        android:padding="5dp"
        android:layout_alignParentTop="true"/>

    <com.example.inappkeyboard.MyKeyboard
        android:id="@+id/keyboard"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        android:layout_alignParentBottom="true"/>

</RelativeLayout>

3. 키보드 Java 파일 추가

새 Java 파일을 추가하십시오. 나는 나의 것을 불렀다 MyKeyboard.

여기서 주목해야 할 가장 중요한 점은 EditText또는에 대한 하드 링크가 없다는 것입니다 Activity. 이를 통해 필요한 모든 앱 또는 활동에 쉽게 연결할 수 있습니다. 이 사용자 정의 키보드보기는 InputConnection시스템 키보드가 EditText. 이것이 우리가 하드 링크를 피하는 방법입니다.

MyKeyboard 위에서 정의한 뷰 레이아웃을 확장하는 복합 뷰입니다.

MyKeyboard.java

public class MyKeyboard extends LinearLayout implements View.OnClickListener {

    // constructors
    public MyKeyboard(Context context) {
        this(context, null, 0);
    }

    public MyKeyboard(Context context, AttributeSet attrs) {
        this(context, attrs, 0);
    }

    public MyKeyboard(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        init(context, attrs);
    }

    // keyboard keys (buttons)
    private Button mButton1;
    private Button mButton2;
    private Button mButton3;
    private Button mButton4;
    private Button mButton5;
    private Button mButton6;
    private Button mButton7;
    private Button mButton8;
    private Button mButton9;
    private Button mButton0;
    private Button mButtonDelete;
    private Button mButtonEnter;

    // This will map the button resource id to the String value that we want to 
    // input when that button is clicked.
    SparseArray<String> keyValues = new SparseArray<>();

    // Our communication link to the EditText
    InputConnection inputConnection;

    private void init(Context context, AttributeSet attrs) {

        // initialize buttons
        LayoutInflater.from(context).inflate(R.layout.keyboard, this, true);
        mButton1 = (Button) findViewById(R.id.button_1);
        mButton2 = (Button) findViewById(R.id.button_2);
        mButton3 = (Button) findViewById(R.id.button_3);
        mButton4 = (Button) findViewById(R.id.button_4);
        mButton5 = (Button) findViewById(R.id.button_5);
        mButton6 = (Button) findViewById(R.id.button_6);
        mButton7 = (Button) findViewById(R.id.button_7);
        mButton8 = (Button) findViewById(R.id.button_8);
        mButton9 = (Button) findViewById(R.id.button_9);
        mButton0 = (Button) findViewById(R.id.button_0);
        mButtonDelete = (Button) findViewById(R.id.button_delete);
        mButtonEnter = (Button) findViewById(R.id.button_enter);

        // set button click listeners
        mButton1.setOnClickListener(this);
        mButton2.setOnClickListener(this);
        mButton3.setOnClickListener(this);
        mButton4.setOnClickListener(this);
        mButton5.setOnClickListener(this);
        mButton6.setOnClickListener(this);
        mButton7.setOnClickListener(this);
        mButton8.setOnClickListener(this);
        mButton9.setOnClickListener(this);
        mButton0.setOnClickListener(this);
        mButtonDelete.setOnClickListener(this);
        mButtonEnter.setOnClickListener(this);

        // map buttons IDs to input strings
        keyValues.put(R.id.button_1, "1");
        keyValues.put(R.id.button_2, "2");
        keyValues.put(R.id.button_3, "3");
        keyValues.put(R.id.button_4, "4");
        keyValues.put(R.id.button_5, "5");
        keyValues.put(R.id.button_6, "6");
        keyValues.put(R.id.button_7, "7");
        keyValues.put(R.id.button_8, "8");
        keyValues.put(R.id.button_9, "9");
        keyValues.put(R.id.button_0, "0");
        keyValues.put(R.id.button_enter, "\n");
    }

    @Override
    public void onClick(View v) {

        // do nothing if the InputConnection has not been set yet
        if (inputConnection == null) return;

        // Delete text or input key value
        // All communication goes through the InputConnection
        if (v.getId() == R.id.button_delete) {
            CharSequence selectedText = inputConnection.getSelectedText(0);
            if (TextUtils.isEmpty(selectedText)) {
                // no selection, so delete previous character
                inputConnection.deleteSurroundingText(1, 0);
            } else {
                // delete the selection
                inputConnection.commitText("", 1);
            }
        } else {
            String value = keyValues.get(v.getId());
            inputConnection.commitText(value, 1);
        }
    }

    // The activity (or some parent or controller) must give us 
    // a reference to the current EditText's InputConnection
    public void setInputConnection(InputConnection ic) {
        this.inputConnection = ic;
    }
}

4. 키보드로 EditText를 가리 킵니다.

시스템 키보드의 경우 Android는 InputMethodManager 를 사용 하여 키보드를 포커스가있는 EditText. 이 예에서는에서 EditText사용자 지정 키보드로 의 링크를 제공하여 활동을 대신 합니다.

시스템 키보드를 사용하지 않기 때문에을 터치 할 때 팝업되지 않도록 비활성화해야합니다 EditText. 둘째, 우리는을 얻을 필요가 InputConnection로부터 EditText우리의 키보드를 제공합니다.

MainActivity.java

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        EditText editText = (EditText) findViewById(R.id.editText);
        MyKeyboard keyboard = (MyKeyboard) findViewById(R.id.keyboard);

        // prevent system keyboard from appearing when EditText is tapped
        editText.setRawInputType(InputType.TYPE_CLASS_TEXT);
        editText.setTextIsSelectable(true);

        // pass the InputConnection from the EditText to the keyboard
        InputConnection ic = editText.onCreateInputConnection(new EditorInfo());
        keyboard.setInputConnection(ic);
    }
}

활동에 여러 EditText가있는 경우 올바른 EditText InputConnection를 키보드 에 전달하는 코드를 작성해야합니다 . (당신은 추가하여이 작업을 수행 할 수 있습니다 OnFocusChangeListener및 OnClickListener참조하십시오. EditTexts에 이 문서 . 그의 논의를) 당신은 또한 숨길 또는 적절한 시간에 키보드를 표시 할 수 있습니다.

끝마친

그게 다야. 이제 예제 앱을 실행하고 원하는대로 텍스트를 입력하거나 삭제할 수 있어야합니다. 다음 단계는 모든 것을 자신의 필요에 맞게 수정하는 것입니다. 예를 들어, 일부 키보드에서는 사용자 지정이 더 쉽기 때문에 Button 대신 TextView를 사용했습니다.

노트

• 은 XML 레이아웃 파일에서, 당신은 또한 사용할 수 있습니다 TextView오히려를 Button하면 키가 더 잘 보이게하려는 경우. 그런 다음 배경을 눌렀을 때 모양 상태를 변경하는 드로어 블로 만드십시오.
• 고급 사용자 정의 키보드 : 키보드 모양과 키보드 전환의 유연성을 높이기 위해 이제 하위 클래스 인 사용자 정의 키보기와 하위 클래스 인 View사용자 정의 키보드를 만들고 있습니다 ViewGroup. 키보드는 모든 키를 프로그래밍 방식으로 배치합니다. 키는 인터페이스를 사용하여 키보드와 통신합니다 (조각이 활동과 통신하는 방식과 유사). xml 레이아웃이 제대로 작동하므로 단일 키보드 레이아웃 만 필요한 경우에는 필요하지 않습니다. 하지만 제가 작업 한 내용의 예를 보려면 여기 에서 모든 Key*및 Keyboard*클래스를 확인 하십시오 . 또한 키보드를 안팎으로 바꾸는 기능을 가진 컨테이너 뷰를 사용합니다.

답변

KeyboardView kbd = new KeyboardView(context);
kbd.setKeyboard(new Keyboard(this, R.xml.custom));

kbd.setOnKeyboardActionListener(new OnKeyboardActionListener() {
    ....
}

    <com.donbrody.customkeyboard.components.keyboard.CustomKeyboardView
    android:id="@+id/customKeyboardView"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentBottom="true" />

override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    setContentView(R.layout.activity_main)

    val numberField: EditText = findViewById(R.id.testNumberField)
    val numberDecimalField: EditText = findViewById(R.id.testNumberDecimalField)
    val qwertyField: EditText = findViewById(R.id.testQwertyField)

    keyboard = findViewById(R.id.customKeyboardView)
    keyboard.registerEditText(CustomKeyboardView.KeyboardType.NUMBER, numberField)
    keyboard.registerEditText(CustomKeyboardView.KeyboardType.NUMBER_DECIMAL, numberDecimalField)
    keyboard.registerEditText(CustomKeyboardView.KeyboardType.QWERTY, qwertyField)
}