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键时的焦点切换顺序：

▲