创新互联鸿蒙OS教程：焦点逻辑

焦点移动是智慧屏的主要交互方式，本节将介绍焦点逻辑的主要规则。

公司专注于为企业提供成都做网站、网站制作、微信公众号开发、商城建设，重庆小程序开发，软件按需设计等一站式互联网企业服务。凭借多年丰富的经验，我们会仔细了解各客户的需求而做出多方面的分析、设计、整合，为客户设计出具风格及创意性的商业解决方案，成都创新互联公司更提供一系列网站制作和网站推广的服务。

• 容器组件焦点分发逻辑： 容器组件在第一次获焦时焦点一般都落在第一个可获焦的子组件上，再次获焦时焦点落在上一次失去焦点时获焦的子组件上。容器组件一般都有特定的焦点分发逻辑，以下分别说明常用容器组件的焦点分发逻辑。

1. div 组件通过按键移动获焦时，焦点会移动到在移动方向上与当前获焦组件布局中心距离最近的可获焦叶子节点上。如图 1 中焦点在上方的横向 div 的第二个子组件上，当点击 down 按键时，焦点要移动到下方的横向 div 中。这时下方的横向 div 中的子组件会与当前焦点所在的组件进行布局中心距离的计算，其中距离最近的子组件获焦。

图1 div 焦点移动时距离计算示例

1. list 组件包含 list-item 与 list-item-group，list 组件每次获焦时会使第一个可获焦的 item 获焦。list-item-group 为特殊的 list-item，且两者都与 div 的焦点逻辑相同。

1. stack 组件只能由自顶而下的第一个可获焦的子组件获焦。

1. swiper 的每个页面和 refresh 的页面的焦点逻辑都与 div 的相同。

1. tabs 组件包含 tab-bar 与 tab-content，tab-bar 中的子组件默认都能获焦，与是否有可获焦的叶子结点无关。tab-bar 与 tab-content 的每个页面都与 div 的焦点逻辑相同。

1. dialog 的 button 可获焦，若有多个 button，默认初始焦点落在第二个 button 上。

1. popup 无法获焦。

• focusable 属性使用

通用属性 focusable 主要用于控制组件能否获焦，本身不支持焦点的组件在设置此属性后可以拥有获取焦点的能力。如 text 组件本身不能获焦，焦点无法移动到它上面，设置 text 的 focusable 属性为 true 后，text 组件便可以获焦。特别的是，如果在没有使用 focusable 属性的情况下，使用了 focus，blur 或 key 事件，会默认添加 focusable 属性为 true。

容器组件是否可获焦依赖于是否拥有可获焦的子组件。如果容器组件内没有可以获焦的子组件，即使设置了 focusable 为 true，依然不能获焦。当容器组件 focusable 属性设置为 false，则它本身和它所包含的所有组件都不可获焦。

标题名称：创新互联鸿蒙OS教程：焦点逻辑
URL地址：http://www.shufengxianlan.com/qtweb/news9/286909.html

网站建设、网络推广公司-创新互联，是专注品牌与效果的网站制作，网络营销seo公司；服务项目有等

广告

声明：本网站发布的内容（图片、视频和文字）以用户投稿、用户转载内容为主，如果涉及侵权请尽快告知，我们将会在第一时间删除。文章观点不代表本网站立场，如需处理请联系客服。电话：028-86922220；邮箱：631063699@qq.com。内容未经允许不得转载，或转载时需注明来源： 创新互联