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

来源:互联网 发布:视频片头软件 编辑:程序博客网 时间:2024/05/16 19:51

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

步骤1 定义界面布局

  也就是说,允许用户当按“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键时的焦点切换顺序:

步骤1 定义界面布局

0 0
原创粉丝点击