现在，随着越来越多的Android的应用出现在Android Market上，如何能更加吸引用户成为摆在开发者面前的重要课题。作为Android应用，不仅要在内容上取胜，在比如界面等细节上也要很重视用户的使用体验，如果用户觉得操作困难和不符合操作习惯的话，就会认为应用不好用而不去下载或购买。在用户体验中，一些细节的问题更容易引起程序员的忽视。本文将介绍，在Android的界面设计中的各个控件的焦点顺序其中要注意的问题，这个很似简单的问题，值得开发者的重视。
AD：
Android设备有多种多样，操纵界面也有所不同，比如有触摸屏、轨迹球，传统的手机键盘等，因此开发者需要更好地了解，当用户在应用程序界面中的不同控件间移动时，各个控件的获得焦点和失去焦点的顺序，以及如何根据用户的操作习惯去自定义这些顺序。
一般情况下，Android对于特定的布局界面，会自动得出一个合适的控件焦点顺序，很多情况下是足够用的了。但是在有的情况下是有例外的。控件的下一个焦点会到达哪一个控件，主要是判断当前控件在指定的方向布局上(up/down/left/right)，哪一个是最领近的控件，其扫描顺序为从左到右，从上到下，就象平时阅读书籍一样。
然而，这种顺序有时会带来一点小问题，比如当控件都布置在屏幕的上方时，如果用户再按“up”键，则不会有任何效果，同样，当控件都在屏幕下方、左边、右边时，此时再按如“down”、“Left”,“Right”键时都不会再获得控件的焦点。
在本文的例子中，将讲解如何修改默认的控件焦点顺序，以定制特定的控件切换顺序，例子中，多个按钮以一个圆形进行了排列，例子可以在
http://android-mt-tutorials.googlecode.com/svn/trunk/SimpleFocus中下载。
步骤1 定义界面布局
我们先设计出界面的布局，代码如下，使用的是Relative相对布局：
1.<?xml version="1.0" encoding="utf-8"?>
2.<RelativeLayout
3. xmlns:android="http://schemas.android.com/apk/res/android"
4. android:layout_width="fill_parent"
5. android:layout_height="fill_parent">
6. <Button
7. style="@style/clockFaceNum"
8. android:text="12"
9. android:id="@+id/button12"
10. android:layout_alignParentTop="true"
11. android:layout_centerHorizontal="true">
12. </Button>
13. <Button
14. style="@style/clockFaceNum"
15. android:text="11"
16. android:id="@+id/button11"
17. android:layout_below="@+id/button12"
18. android:layout_toLeftOf="@+id/button12">
19. </Button>
20. <Button
21. style="@style/clockFaceNum"
22. android:text="1"
23. android:id="@+id/button1"
24. android:layout_below="@+id/button12"
25. android:layout_toRightOf="@+id/button12">
26. </Button>
27. <Button
28. style="@style/clockFaceNum"
29. android:text="10"
30. android:id="@+id/button10"
31. android:layout_below="@+id/button11"
32. android:layout_toLeftOf="@+id/button11">
33. </Button>
34. <Button
35. style="@style/clockFaceNum"
36. android:text="2"
37. android:id="@+id/button2"
38. android:layout_below="@+id/button1"
39. android:layout_toRightOf="@+id/button1">
40. </Button>
41. <Button
42. style="@style/clockFaceNum"
43. android:text="9"
44. android:id="@+id/button9"
45. android:layout_below="@+id/button10"
46. android:layout_toLeftOf="@+id/button10">
47. </Button>
48.
49. <Button
50. style="@style/clockFaceNum"
51. android:text="3"
52. android:id="@+id/button3"
53. android:layout_below="@+id/button2"
54. android:layout_toRightOf="@+id/button2">
55. </Button>
56. <Button
57. style="@style/clockFaceNum"
58. android:text="8"
59. android:id="@+id/button8"
60. android:layout_below="@+id/button9"
61. android:layout_toRightOf="@+id/button9">
62. </Button>
63. <Button
64. style="@style/clockFaceNum"
65. android:text="4"
66. android:id="@+id/button4"
67. android:layout_below="@+id/button3"
68. android:layout_toLeftOf="@+id/button3">
69. </Button>
70. <Button
71. style="@style/clockFaceNum"
72. android:text="7"
73. android:id="@+id/button7"
74. android:layout_below="@+id/button8"
75. android:layout_toRightOf="@+id/button8">
76. </Button>
77. <Button
78. style="@style/clockFaceNum"
79. android:text="5"
80. android:id="@+id/button5"
81. android:layout_below="@+id/button4"
82. android:layout_toLeftOf="@+id/button4">
83. </Button>
84. <Button
85. style="@style/clockFaceNum"
86. android:text="6"
87. android:id="@+id/button6"
88. android:layout_below="@+id/button5"
89. android:layout_centerHorizontal="true">
90. </Button>
91.</RelativeLayout>
92.
上面定义的style文件如下：
1.<?xml version="1.0" encoding="utf-8"?>
2.<resources>
3. <style
4. name="clockFaceNum">
5. <item
6. name="android:layout_width">38dp</item>
7. <item
8. name="android:layout_height">38dp</item>
9. <item
10. name="android:onClick">numClicked</item>
11. <item
12. name="android:textSize">9sp</item>
13. </style>
14.</resources>
运行后，效果如下图：
步骤2 默认的控件焦点切换顺序
比如当用户将控件焦点点在12号按钮时，点往下的“down”按钮，默认的控件焦点切换顺序如下图：
也就是说，当在按钮12上往下按的时候，控件的焦点会切换到11，接着就是键10，如此类推。
步骤3 创建自定义的控件焦点顺序
下面，我们尝试创建自定义的控件焦点顺序，即同时允许在上面的界面中，当用户按键时，以顺时针或逆时针进行控件切换，如下图：
也就是说，允许用户当按“Down”或“Right”键时，切换顺序是顺时针方向，比如假设当前在键12上，按“Down”或“Right”键时，会切换到键1，而按“Up”或”Left”时，会切换到键11，如此类推。要实现这点，可以在每个按钮中进行设置如下四个属性：
android:nextFocusUp- 定义当点up键时，哪个控件将获得焦点
android:nextFocusDown-定义当点down键时，哪个控件将获得焦点
android:nextFocusLeft-定义当点left键时，哪个控件将获得焦点
android:nextFocusRight--定义当点right键时，哪个控件将获得焦点
下面是其代码：
1.<?xml version="1.0" encoding="utf-8"?>
2.<RelativeLayout
3. xmlns:android="http://schemas.android.com/apk/res/android"
4. android:layout_width="fill_parent"
5. android:layout_height="fill_parent">
6. <Button
7. style="@style/clockFaceNum"
8. android:text="12"
9. android:id="@+id/button12"
10. android:layout_alignParentTop="true"
11. android:layout_centerHorizontal="true"
12. android:nextFocusUp="@+id/button11"
13. android:nextFocusLeft="@+id/button11"
14. android:nextFocusRight="@+id/button1"
15. android:nextFocusDown="@+id/button1">
16. </Button>
17. <Button
18. style="@style/clockFaceNum"
19. android:text="11"
20. android:id="@+id/button11"
21. android:layout_below="@+id/button12"
22. android:layout_toLeftOf="@+id/button12"
23. android:nextFocusUp="@+id/button10"
24. android:nextFocusLeft="@+id/button10"
25. android:nextFocusRight="@+id/button12"
26. android:nextFocusDown="@+id/button12">
27. </Button>
28. <Button
29. style="@style/clockFaceNum"
30. android:text="1"
31. android:id="@+id/button1"
32. android:layout_below="@+id/button12"
33. android:layout_toRightOf="@+id/button12"
34. android:nextFocusUp="@+id/button12"
35. android:nextFocusLeft="@+id/button12"
36. android:nextFocusRight="@+id/button2"
37. android:nextFocusDown="@+id/button2">
38. </Button>
39. <Button
40. style="@style/clockFaceNum"
41. android:text="10"
42. android:id="@+id/button10"
43. android:layout_below="@+id/button11"
44. android:layout_toLeftOf="@+id/button11"
45. android:nextFocusUp="@+id/button9"
46. android:nextFocusLeft="@+id/button9"
47. android:nextFocusRight="@+id/button11"
48. android:nextFocusDown="@+id/button11">
49. </Button>
50. <Button
51. style="@style/clockFaceNum"
52. android:text="2"
53. android:id="@+id/button2"
54. android:layout_below="@+id/button1"
55. android:layout_toRightOf="@+id/button1"
56. android:nextFocusUp="@+id/button1"
57. android:nextFocusLeft="@+id/button1"
58. android:nextFocusRight="@+id/button3"
59. android:nextFocusDown="@+id/button3">
60. </Button>
61. <Button
62. style="@style/clockFaceNum"
63. android:text="9"
64. android:id="@+id/button9"
65. android:layout_below="@+id/button10"
66. android:layout_toLeftOf="@+id/button10"
67. android:nextFocusUp="@+id/button8"
68. android:nextFocusLeft="@+id/button8"
69. android:nextFocusRight="@+id/button10"
70. android:nextFocusDown="@+id/button10">
71. </Button>
72.
73. <Button
74. style="@style/clockFaceNum"
75. android:text="3"
76. android:id="@+id/button3"
77. android:layout_below="@+id/button2"
78. android:layout_toRightOf="@+id/button2"
79. android:nextFocusUp="@+id/button2"
80. android:nextFocusLeft="@+id/button2"
81. android:nextFocusRight="@+id/button4"
82. android:nextFocusDown="@+id/button4">
83. </Button>
84. <Button
85. style="@style/clockFaceNum"
86. android:text="8"
87. android:id="@+id/button8"
88. android:layout_below="@+id/button9"
89. android:layout_toRightOf="@+id/button9"
90. android:nextFocusUp="@+id/button7"
91. android:nextFocusLeft="@+id/button7"
92. android:nextFocusRight="@+id/button9"
93. android:nextFocusDown="@+id/button9">
94. </Button>
95. <Button
96. style="@style/clockFaceNum"
97. android:text="4"
98. android:id="@+id/button4"
99. android:layout_below="@+id/button3"
100. android:layout_toLeftOf="@+id/button3"
101. android:nextFocusUp="@+id/button3"
102. android:nextFocusLeft="@+id/button3"
103. android:nextFocusRight="@+id/button5"
104. android:nextFocusDown="@+id/button5">
105. </Button>
106. <Button
107. style="@style/clockFaceNum"
108. android:text="7"
109. android:id="@+id/button7"
110. android:layout_below="@+id/button8"
111. android:layout_toRightOf="@+id/button8"
112. android:nextFocusUp="@+id/button6"
113. android:nextFocusLeft="@+id/button6"
114. android:nextFocusRight="@+id/button8"
115. android:nextFocusDown="@+id/button8">
116. </Button>
117. <Button
118. style="@style/clockFaceNum"
119. android:text="5"
120. android:id="@+id/button5"
121. android:layout_below="@+id/button4"
122. android:layout_toLeftOf="@+id/button4"
123. android:nextFocusUp="@+id/button4"
124. android:nextFocusLeft="@+id/button4"
125. android:nextFocusRight="@+id/button6"
126. android:nextFocusDown="@+id/button6">
127. </Button>
128. <Button
129. style="@style/clockFaceNum"
130. android:text="6"
131. android:id="@+id/button6"
132. android:layout_below="@+id/button5"
133. android:layout_centerHorizontal="true"
134. android:nextFocusUp="@+id/button5"
135. android:nextFocusLeft="@+id/button5"
136. android:nextFocusRight="@+id/button7"
137. android:nextFocusDown="@+id/button7">
138. </Button>
139.</RelativeLayout>
下图中是假定在键12开始按down键时的焦点切换顺序：
步骤4 设置界面的初始控件焦点
在每个页面加载时，可以设置界面中初始的控件焦点，以方便用户的定位操作，只需要在控件中加入即可。比如：
1.<Button
2. style="@style/clockFaceNum"
3. android:text="12"
4. android:id="@+id/button12"
5. android:layout_alignParentTop="true"
6. android:layout_centerHorizontal="true"
7. android:nextFocusUp="@+id/button11"
8. android:nextFocusLeft="@+id/button11"
9. android:nextFocusRight="@+id/button1"
10. android:nextFocusDown="@+id/button1">
11. <requestFocus />
12. </Button>
小结
作为开发者，一定要记住由于Android设备的多样性，用户如何在界面上方便地进行输入或在不同的控件中来回切换是十分重要的，本文简单介绍了用户如何自定义控件的焦点切换顺序，这对于用户界面的体验是很有好处的。
相关推荐
在Android开发中，自定义控件是提升用户体验和界面独特性的重要手段。"android自定义IP控件"是一个专门设计用于模拟标准IP地址输入的组件。这个控件旨在让用户能够像在传统网络设置中那样，方便地输入IPv4格式的地址...
首先，Android中的焦点控制主要包括四个步骤： 1. **焦点获取**：当用户操作（如点击或按键）使得某个控件变得可聚焦时，该控件会获取焦点。例如，用户点击屏幕上的一个按钮，按钮就会获得焦点。 2. **焦点转移**...
在Android开发领域，创建一个高仿QQ登录界面是一项常见的练习，可以帮助开发者提升UI设计和实现能力。本项目基于Android Studio，结合SDK和JDK，旨在为初学者提供一个学习和交流的平台。以下是对这个"android高仿qq...
Android应用的用户界面（UI）构造是指开发者如何设计和实现与用户交互的界面。UI界面的重要性在于它不仅需要具有吸引力，更应具备良好的用户体验和直观的操作性。一个优秀的UI应包含如下几个方面的知识点： 1. ...
Android界面主要由XML布局文件定义，通常位于`res/layout`目录下。为了创建用户注册界面，我们需要修改该目录下的布局文件，添加必要的组件来收集用户信息，如用户名和密码。 1. 我们从一个相对布局（`...
在Android开发中，TimePicker是一个常用...通过以上步骤，我们可以创建一个响应用户按键事件、与其他控件之间焦点切换流畅的TimePicker。这种实现方式提高了应用的可用性和用户满意度，是Android开发中的一个重要实践。
1. 设计原则：遵循Android Material Design指南，确保界面一致性，提供清晰的视觉层次和明确的用户反馈。 2. 布局：通常使用LinearLayout或ConstraintLayout作为根布局，以实现组件的排列和约束。 3. 控件：包括...
ListView是Android中的一个基础组件，用于展示一列可滚动的数据项。开发者可以自定义每个列表项的视图，并通过适配器（Adapter）来填充数据。ListView的一个关键特性是它可以高效地处理大量数据，因为它只渲染屏幕上...
在Xamarin Android应用开发中，有时会遇到一个问题：当用户打开软键盘进行输入时，由于屏幕高度限制，软键盘可能会遮挡住部分应用界面，特别是那些位于屏幕底部的控件。这种情况给用户带来了不便，因为他们无法直接...
综上，自定义控件是Android开发中的一个重要实践，它能帮助我们创建独特且功能丰富的界面。通过深入理解绘制流程、属性定义以及事件处理，可以更好地实现自定义控件的功能。在实际项目中，自定义控件能够大大提高...
- **步骤4**：在 `attrs.xml` 文件中定义自定义属性，并在构造函数中读取这些属性，使得控件可以通过布局文件配置。 5. **MyToggleButton 示例** - 定义自定义控件 `MyToggleButton`，继承自 **View**。 - 在...
在Android开发中，焦点图（通常也称为轮播图或滑动图片展示）是一种常见的UI设计元素，用于展示多张图片或内容，并允许用户通过滑动来切换。本篇文章将详细探讨如何使用Gallery和ViewPager这两种组件来实现Android...
二维码扫描控件是Android开发中的一个重要组件，它允许应用程序实现快速、便捷的二维码读取功能。自定义二维码扫描控件的目的是为了满足开发者对于扫描功能的个性化需求，提高用户体验，并且能够灵活地集成到各种...
在Android开发中，创建自定义ViewGroup以实现自动换行的功能是一个常见的需求，尤其是在构建复杂的用户界面时。这个场景特别适用于邮件应用中的收件人输入框，用户可以连续添加多个收件人，而这些收件人的显示需要...
总之，Android TV端的推荐列表展示，尤其是针对不规则视图的焦点放大动画，是一项涉及到布局管理、动画设计、用户体验等多个方面的综合任务。通过自定义布局和动画，我们可以为用户提供一个更具吸引力和易用性的交互...
在Android开发中，"模仿小米焦点控制"是一个常见的需求，特别是在设计用户界面（UI）时，尤其是对于电视盒或者智能电视应用。小米盒子UI以其独特的交互体验和视觉效果著称，其中焦点放大与阴影效果是其特点之一。...
在Android应用开发中，创建一个吸引用户的欢迎界面和新手引导页面是至关重要的。"安卓欢迎界面引导页面viewpager相关-MaterialShowcaseViewMaterial风格的新手引导控件.rar"这个资源包，显然提供了一个使用ViewPager...
在Android开发中，让一个Activity实现悬浮并且透明的效果是一项常见的需求，这通常涉及到窗口权限、主题设置以及自定义布局等方面的知识。以下将详细介绍如何实现这一功能。 首先，我们需要理解Android的窗口管理...