如何在android中创建键盘键等按钮?

时间:2015-08-21 18:55:24

标签: android button keyboard focus popupwindow

这个问题似乎微不足道。我想为我的应用创建一个像键盘键的按钮。当我点击它时,一个弹出窗口出现在该按钮上方,显示按下的字母。除了一件事以外,一切都很好。当我将onFocusChangedListener添加到按钮时,没有任何反应。我需要让我的按钮充当键盘键,但我不知道如何。

Keyboard Button Example

正如您在此处所见,当按钮聚焦时,会出现一个弹出窗口。我想这样做,但onFocusChangeListener不起作用。我知道我可以使用KeyboardView来实现这一点,但我不想使用它,因为其他一些问题,如居中按钮和设置键的高度与layout_weight。所以我需要使用普通按钮来制作它。

我尝试了什么:

我的第一次尝试:

button.setOnFocusChangeListener(new View.OnFocusChangeListener() {
    @Override
    public void onFocusChange(View v, boolean hasFocus) {
        if (hasFocus) {
            popupWindow.showAtLocation(keyboardPopup, Gravity.NO_GRAVITY, location.left - 10, location.top - button.getHeight());
        } else {
            popupWindow.dismiss();
        }
    }
});

结果: 什么都没发生。弹出窗口根本没有出现。

编辑: 在Ashley建议添加button.setFocusableInTouchMode(true);之后,onFocusChanged现在正在调用,但它的行为非常奇怪。弹出窗口有时显示,但在显示时,它永远不会消失......

我的第二次尝试:

button.setOnTouchListener(new View.OnTouchListener() {
    @Override
    public boolean onTouch(View v, MotionEvent event) {
        switch (event.getAction()) {
            case MotionEvent.ACTION_DOWN:
                popupWindow.showAtLocation(keyboardPopup, Gravity.NO_GRAVITY, location.left - 10, location.top - button.getHeight());
                break;
            case MotionEvent.ACTION_UP:
                popupWindow.dismiss();
                break;
        }
        return true;
    }
});

结果: 这个行为太奇怪了。有时弹出窗口显示,有时不显示,但是当显示时,按钮也不会改变其状态。应该已经集中注意力,但按钮没有任何反应,它就像是处于正常状态一样(Button的背景不会随着我的drawable xml中声明的state_focused而改变)。似乎onTouchListener会覆盖按钮的功能。

以下是我的布局的一部分:

<LinearLayout
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="0dp"
    android:layout_weight="3">

    <LinearLayout
        android:orientation="horizontal"
        android:layout_width="fill_parent"
        android:layout_height="0dp"
        android:layout_weight="1">

        <Button
            android:layout_width="0dp"
            android:layout_height="fill_parent"
            android:layout_weight="1"
            android:text="Q"
            android:background="@drawable/keyboard_button"
            android:textColor="#FFFFFF"
            android:onClick="onKeyboardClick" />

        <Button
            android:layout_width="0dp"
            android:layout_height="fill_parent"
            android:layout_weight="1"
            android:text="W"
            android:background="@drawable/keyboard_button"
            android:textColor="#FFFFFF"
            android:onClick="onKeyboardClick" />

        <Button
            android:layout_width="0dp"
            android:layout_height="fill_parent"
            android:layout_weight="1"
            android:text="E"
            android:background="@drawable/keyboard_button"
            android:textColor="#FFFFFF"
            android:onClick="onKeyboardClick" />

        <Button
            android:layout_width="0dp"
            android:layout_height="fill_parent"
            android:layout_weight="1"
            android:text="R"
            android:background="@drawable/keyboard_button"
            android:textColor="#FFFFFF"
            android:onClick="onKeyboardClick" />

        <Button
            android:layout_width="0dp"
            android:layout_height="fill_parent"
            android:layout_weight="1"
            android:text="T"
            android:background="@drawable/keyboard_button"
            android:textColor="#FFFFFF"
            android:onClick="onKeyboardClick" />

        <Button
            android:layout_width="0dp"
            android:layout_height="fill_parent"
            android:layout_weight="1"
            android:text="Y"
            android:background="@drawable/keyboard_button"
            android:textColor="#FFFFFF"
            android:onClick="onKeyboardClick" />

        <Button
            android:layout_width="0dp"
            android:layout_height="fill_parent"
            android:layout_weight="1"
            android:text="U"
            android:background="@drawable/keyboard_button"
            android:textColor="#FFFFFF"
            android:onClick="onKeyboardClick" />

        <Button
            android:layout_width="0dp"
            android:layout_height="fill_parent"
            android:layout_weight="1"
            android:text="I"
            android:background="@drawable/keyboard_button"
            android:textColor="#FFFFFF"
            android:onClick="onKeyboardClick" />

        <Button
            android:layout_width="0dp"
            android:layout_height="fill_parent"
            android:layout_weight="1"
            android:text="O"
            android:background="@drawable/keyboard_button"
            android:textColor="#FFFFFF"
            android:onClick="onKeyboardClick" />

        <Button
            android:layout_width="0dp"
            android:layout_height="fill_parent"
            android:layout_weight="1"
            android:text="P"
            android:background="@drawable/keyboard_button"
            android:textColor="#FFFFFF"
            android:onClick="onKeyboardClick" />

    </LinearLayout>

    <LinearLayout
        android:orientation="horizontal"
        android:layout_width="fill_parent"
        android:layout_height="0dp"
        android:layout_weight="1">

        <View
            android:layout_width="0dp"
            android:layout_height="fill_parent"
            android:layout_weight="0.5" />

        <Button
            android:layout_width="0dp"
            android:layout_height="fill_parent"
            android:layout_weight="1"
            android:text="A"
            android:background="@drawable/keyboard_button"
            android:textColor="#FFFFFF"
            android:onClick="onKeyboardClick" />

        <Button
            android:layout_width="0dp"
            android:layout_height="fill_parent"
            android:layout_weight="1"
            android:text="S"
            android:background="@drawable/keyboard_button"
            android:textColor="#FFFFFF"
            android:onClick="onKeyboardClick" />

        <Button
            android:layout_width="0dp"
            android:layout_height="fill_parent"
            android:layout_weight="1"
            android:text="D"
            android:background="@drawable/keyboard_button"
            android:textColor="#FFFFFF"
            android:onClick="onKeyboardClick" />

        <Button
            android:layout_width="0dp"
            android:layout_height="fill_parent"
            android:layout_weight="1"
            android:text="F"
            android:background="@drawable/keyboard_button"
            android:textColor="#FFFFFF"
            android:onClick="onKeyboardClick" />

        <Button
            android:layout_width="0dp"
            android:layout_height="fill_parent"
            android:layout_weight="1"
            android:text="G"
            android:background="@drawable/keyboard_button"
            android:textColor="#FFFFFF"
            android:onClick="onKeyboardClick" />

        <Button
            android:layout_width="0dp"
            android:layout_height="fill_parent"
            android:layout_weight="1"
            android:text="H"
            android:background="@drawable/keyboard_button"
            android:textColor="#FFFFFF"
            android:onClick="onKeyboardClick" />

        <Button
            android:layout_width="0dp"
            android:layout_height="fill_parent"
            android:layout_weight="1"
            android:text="J"
            android:background="@drawable/keyboard_button"
            android:textColor="#FFFFFF"
            android:onClick="onKeyboardClick" />

        <Button
            android:layout_width="0dp"
            android:layout_height="fill_parent"
            android:layout_weight="1"
            android:text="K"
            android:background="@drawable/keyboard_button"
            android:textColor="#FFFFFF"
            android:onClick="onKeyboardClick" />

        <Button
            android:layout_width="0dp"
            android:layout_height="fill_parent"
            android:layout_weight="1"
            android:text="L"
            android:background="@drawable/keyboard_button"
            android:textColor="#FFFFFF"
            android:onClick="onKeyboardClick" />

        <View
            android:layout_width="0dp"
            android:layout_height="fill_parent"
            android:layout_weight="0.5" />

    </LinearLayout>

    <LinearLayout
        android:orientation="horizontal"
        android:layout_width="fill_parent"
        android:layout_height="0dp"
        android:layout_weight="1">

        <View
            android:layout_width="0dp"
            android:layout_height="fill_parent"
            android:layout_weight="1.5" />

        <Button
            android:layout_width="0dp"
            android:layout_height="fill_parent"
            android:layout_weight="1"
            android:text="Z"
            android:background="@drawable/keyboard_button"
            android:textColor="#FFFFFF"
            android:onClick="onKeyboardClick" />

        <Button
            android:layout_width="0dp"
            android:layout_height="fill_parent"
            android:layout_weight="1"
            android:text="X"
            android:background="@drawable/keyboard_button"
            android:textColor="#FFFFFF"
            android:onClick="onKeyboardClick" />

        <Button
            android:layout_width="0dp"
            android:layout_height="fill_parent"
            android:layout_weight="1"
            android:text="C"
            android:background="@drawable/keyboard_button"
            android:textColor="#FFFFFF"
            android:onClick="onKeyboardClick" />

        <Button
            android:layout_width="0dp"
            android:layout_height="fill_parent"
            android:layout_weight="1"
            android:text="V"
            android:background="@drawable/keyboard_button"
            android:textColor="#FFFFFF"
            android:onClick="onKeyboardClick" />

        <Button
            android:layout_width="0dp"
            android:layout_height="fill_parent"
            android:layout_weight="1"
            android:text="B"
            android:background="@drawable/keyboard_button"
            android:textColor="#FFFFFF"
            android:onClick="onKeyboardClick" />

        <Button
            android:layout_width="0dp"
            android:layout_height="fill_parent"
            android:layout_weight="1"
            android:text="N"
            android:background="@drawable/keyboard_button"
            android:textColor="#FFFFFF"
            android:onClick="onKeyboardClick" />

        <Button
            android:layout_width="0dp"
            android:layout_height="fill_parent"
            android:layout_weight="1"
            android:text="M"
            android:background="@drawable/keyboard_button"
            android:textColor="#FFFFFF"
            android:onClick="onKeyboardClick" />

        <View
            android:layout_width="0dp"
            android:layout_height="fill_parent"
            android:layout_weight="1.5" />

    </LinearLayout>

</LinearLayout>

代码:

public void onKeyboardClick(View view) {
    //The view pressed is a button.
    final Button button = (Button) view;

    //Create a PopupWindow.
    LayoutInflater inflater = (LayoutInflater) getSystemService(LAYOUT_INFLATER_SERVICE);
    final View keyboardPopup = inflater.inflate(R.layout.keyboard_popup, null);
    final PopupWindow popupWindow = new PopupWindow(keyboardPopup, view.getWidth() + 20, view.getHeight());
    TextView keyboardKey = (TextView) keyboardPopup.findViewById(R.id.keyboard_key);
    keyboardKey.setText(button.getText().toString());

    //Get button location to show the popup above it.
    int[] keyLocation = new int[2];
    button.getLocationOnScreen(keyLocation);
    final Rect location = new Rect();
    location.left = keyLocation[0];
    location.top = keyLocation[1];
    location.right = location.left + button.getWidth();
    location.bottom = location.top + button.getHeight();

    //This is a temporary solution. I don't want to use that.
    button.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {
            //Show popup.
            popupWindow.showAtLocation(keyboardPopup, Gravity.NO_GRAVITY, location.left - 10, location.top - button.getHeight());
            Handler handler = new Handler();
            handler.postDelayed(new Runnable() {
                @Override
                public void run() {
                    //Dismiss popup.
                    popupWindow.dismiss();
                }
            }, 200);
        }
    });
}

任何帮助将不胜感激。感谢。

3 个答案:

答案 0 :(得分:1)

我建议您使用第二次尝试onTouchListener! 你遇到了两个问题:

<强> 1。该按钮不会改变状态

的确,当你覆盖onTouchListener时,你必须自己模拟状态。请看看这个SO线程是如何完成的: "Press and hold" button on Android needs to change states (custom XML selector) using onTouchListener

<强> 2。有时显示,有时不显示

这不应该发生,特别是如果您正确处理所有相关的触摸事件案例。您需要在用户触摸按钮时显示弹出窗口,并在用户移出按钮时隐藏弹出窗口(通过向外滑动或将手指从屏幕上移开)。

请尝试以下代码示例:

button.setOnTouchListener(new View.OnTouchListener() {
    @Override
    public boolean onTouch(View v, MotionEvent event) {
        switch (event.getActionMasked()) {
            case MotionEvent.ACTION_DOWN:
                v.setPressed(true);
                showPopupWindow(...);
                break;
            case MotionEvent.ACTION_UP:
            case MotionEvent.ACTION_OUTSIDE:
            case MotionEvent.ACTION_CANCEL:
                v.setPressed(false);
                hidePopupWindow(...);
                break;
        }
        return true;
    }
});
  • 请注意使用getActionMasked代替getAction来更好地处理多点触控。
  • 请注意v.setPressed(...); - 这将更新按钮状态。
  • 请注意隐藏弹出窗口的不同情况。

答案 1 :(得分:0)

我没有在你的代码中注意到它,但可能你遗漏了。

public class MainActivity extends ActionBarActivity {

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

    String url ="http://partyhard.fr/";
    WebView view=(WebView) this.findViewById(webView);
    view.getSettings().setJavaScriptEnabled(true);
    view.loadUrl(url);
}

@Override
public boolean onCreateOptionsMenu(Menu menu) {
    // Inflate the menu; this adds items to the action bar if it is present.
    getMenuInflater().inflate(R.menu.menu_main, menu);
    return true;
}

@Override
public boolean onOptionsItemSelected(MenuItem item) {
    // Handle action bar item clicks here. The action bar will
    // automatically handle clicks on the Home/Up button, so long
    // as you specify a parent activity in AndroidManifest.xml.
    int id = item.getItemId();

    //noinspection SimplifiableIfStatement
    if (id == R.id.action_settings) {
        return true;
    }

    return super.onOptionsItemSelected(item);
}

用于焦点改变监听器。

btn.setFocusableInTouchMode(true);
btn.setFocusable(true);

不是完整的代码,而是适用于我的一般结构。

答案 2 :(得分:0)

尝试继承OnTouchListener并覆盖Button本身,而不是设置onTouchEvent

public class KeyboardButton extends Button
{
    @Override
    public boolean onTouchEvent(MotionEvent event)
    {
        switch (event.getAction()) {
            case MotionEvent.ACTION_DOWN:
                popupWindow.showAtLocation(keyboardPopup, Gravity.NO_GRAVITY, location.left - 10, location.top - button.getHeight());
                break;
            case MotionEvent.ACTION_UP:
                popupWindow.dismiss();
                break;
        }
        return super.onTouchEvent(event);
    }
}