Android界面设计之创建自定义的控件焦点顺序

我们尝试创建自定义的控件焦点顺序，即同时允许在上面的界面中，当用户按键时，以顺时针或逆时针进行控件切换，如下图：



　　也就是说，允许用户当按“Down”或“Right”键时，切换顺序是顺时针方向，比如假设当前在键12上，按“Down”或“Right”键时，会切换到键1，而按“Up”或”Left”时，会切换到键11，如此类推。要实现这点，可以在每个按钮中进行设置如下四个属性：

　　android:nextFocusUp- 定义当点up键时，哪个控件将获得焦点

　　android:nextFocusDown-定义当点down键时，哪个控件将获得焦点

　　android:nextFocusLeft-定义当点left键时，哪个控件将获得焦点

　　android:nextFocusRight--定义当点right键时，哪个控件将获得焦点

　　下面是其代码：

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout

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

    android:layout_width="fill_parent"

    android:layout_height="fill_parent">

    <Button

        style="@style/clockFaceNum"

        android:text="12"

        android:id="@+id/button12"

        android:layout_alignParentTop="true"

        android:layout_centerHorizontal="true"

        android:nextFocusUp="@+id/button11"

        android:nextFocusLeft="@+id/button11"

        android:nextFocusRight="@+id/button1"

        android:nextFocusDown="@+id/button1">

    </Button>

    <Button

        style="@style/clockFaceNum"

        android:text="11"

        android:id="@+id/button11"

        android:layout_below="@+id/button12"

        android:layout_toLeftOf="@+id/button12"

        android:nextFocusUp="@+id/button10"

        android:nextFocusLeft="@+id/button10"

        android:nextFocusRight="@+id/button12"

        android:nextFocusDown="@+id/button12">

    </Button>

    <Button

        style="@style/clockFaceNum"

        android:text="1"

        android:id="@+id/button1"

        android:layout_below="@+id/button12"

        android:layout_toRightOf="@+id/button12"

        android:nextFocusUp="@+id/button12"

        android:nextFocusLeft="@+id/button12"

        android:nextFocusRight="@+id/button2"

        android:nextFocusDown="@+id/button2">

    </Button>

    <Button

        style="@style/clockFaceNum"

        android:text="10"

        android:id="@+id/button10"

        android:layout_below="@+id/button11"

        android:layout_toLeftOf="@+id/button11"

        android:nextFocusUp="@+id/button9"

        android:nextFocusLeft="@+id/button9"

        android:nextFocusRight="@+id/button11"

        android:nextFocusDown="@+id/button11">

    </Button>

    <Button

        style="@style/clockFaceNum"

        android:text="2"

        android:id="@+id/button2"

        android:layout_below="@+id/button1"

        android:layout_toRightOf="@+id/button1"

        android:nextFocusUp="@+id/button1"

        android:nextFocusLeft="@+id/button1"

        android:nextFocusRight="@+id/button3"

        android:nextFocusDown="@+id/button3">

    </Button>

    <Button

        style="@style/clockFaceNum"

        android:text="9"

        android:id="@+id/button9"

        android:layout_below="@+id/button10"

        android:layout_toLeftOf="@+id/button10"

        android:nextFocusUp="@+id/button8"

        android:nextFocusLeft="@+id/button8"

        android:nextFocusRight="@+id/button10"

        android:nextFocusDown="@+id/button10">

    </Button>

    <Button

        style="@style/clockFaceNum"

        android:text="3"

        android:id="@+id/button3"

        android:layout_below="@+id/button2"

        android:layout_toRightOf="@+id/button2"

        android:nextFocusUp="@+id/button2"

        android:nextFocusLeft="@+id/button2"

        android:nextFocusRight="@+id/button4"

        android:nextFocusDown="@+id/button4">

    </Button>

    <Button

        style="@style/clockFaceNum"

        android:text="8"

        android:id="@+id/button8"

        android:layout_below="@+id/button9"

        android:layout_toRightOf="@+id/button9"

        android:nextFocusUp="@+id/button7"

        android:nextFocusLeft="@+id/button7"

        android:nextFocusRight="@+id/button9"

        android:nextFocusDown="@+id/button9">

    </Button>

    <Button

        style="@style/clockFaceNum"

        android:text="4"

        android:id="@+id/button4"

        android:layout_below="@+id/button3"

        android:layout_toLeftOf="@+id/button3"

        android:nextFocusUp="@+id/button3"

        android:nextFocusLeft="@+id/button3"

        android:nextFocusRight="@+id/button5"

        android:nextFocusDown="@+id/button5">

    </Button>

    <Button

        style="@style/clockFaceNum"

        android:text="7"

        android:id="@+id/button7"

        android:layout_below="@+id/button8"

        android:layout_toRightOf="@+id/button8"

        android:nextFocusUp="@+id/button6"

        android:nextFocusLeft="@+id/button6"

        android:nextFocusRight="@+id/button8"

        android:nextFocusDown="@+id/button8">

    </Button>

    <Button

        style="@style/clockFaceNum"

        android:text="5"

        android:id="@+id/button5"

        android:layout_below="@+id/button4"

        android:layout_toLeftOf="@+id/button4"

        android:nextFocusUp="@+id/button4"

        android:nextFocusLeft="@+id/button4"

        android:nextFocusRight="@+id/button6"

        android:nextFocusDown="@+id/button6">

    </Button>

    <Button

        style="@style/clockFaceNum"

        android:text="6"

        android:id="@+id/button6"

        android:layout_below="@+id/button5"

        android:layout_centerHorizontal="true"

        android:nextFocusUp="@+id/button5"

        android:nextFocusLeft="@+id/button5"

        android:nextFocusRight="@+id/button7"

        android:nextFocusDown="@+id/button7">

    </Button>
</RelativeLayout>

　　下图中是假定在键12开始按down键时的焦点切换顺序：



▲