美文网首页
焦点选中状态(二)

焦点选中状态(二)

作者: fengfancky | 来源:发表于2017-11-28 11:14 被阅读532次

用户使用遥控器控制电视界面,我们需要提示(或突出)当前焦点的位置,用户通过变焦点的位置来控制界面。Android系统提供了许多view,有些view获得焦点会有状态的改变,如:button;也有一些view在获得焦点的时候,默认状态是不会改变的,如:textView、imageView,这会导致用户找不到焦点进而无法有效的操作。通常我们使view的颜色、大小等状态发生改变来显示当前焦点。

selector

编写几个xml文件放到drawable目录下:

选中状态的drawable:view_focus.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <!--设置圆角-->
    <corners
        android:radius="10dp"/>
    <!--设置填充颜色-->
    <solid
        android:color="@color/trans" />
    <!-- 设置表框-->
    <stroke
        android:width="3dp"
        android:color="@color/blue"/>
</shape>

默认状态的drawable:view_normal.xml

  <?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
   
    <!--设置填充颜色-->
    <solid
        android:color="@color/trans" />

</shape>

selector: view_selector.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_focused="true" android:drawable="@drawable/view_focus"/>
    <!--<item android:state_focused="false" android:drawable="@drawable/view_normal"/>-->
    <item android:drawable="@drawable/view_normal"/>
</selector>

在xml中使用:

     <TextView
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:background="@drawable/view_selector"
        android:focusable="true"
        android:padding="3dp"  
        android:text="示例"
        android:textColor="#fff"
        android:textSize="16sp" />

当焦点选中该TextView时,TextView会显示一个蓝色的边框(如果未显示边框,你可以尝试设置padding ,因为边框很可能被视图自己遮住)。根据自己的需求写合适的drawable,当然也可以是图片。


使用动画

常常是过一个动画来突出焦点,比如:放大。示例如下:

 TextView textView=(TextView )findviewById(R.id.text_view);
 textView.setOnFocusChangeListener(new View.OnFocusChangeListener() {
        @Override
        public void onFocusChange(View v, boolean hasFocus) {
            if (hasFocus){
                textView.animate().scaleX(1.2f).scaleY(1.2f).setDuration(300).start();
            }else {
                textView.animate().scaleX(1.0f).scaleY(1.0f).setDuration(300).start();
            }
        }
    });

获取焦点时放大,失去后还原。
在RecyclerView中可以自定义item的焦点监听接口,在接口中完成上述动画。通常我们会将selector、动画、设置view颜色、设置背景等方式组合在一起使用。

运动焦点框

后续内容。

相关文章

  • 焦点选中状态(二)

    用户使用遥控器控制电视界面,我们需要提示(或突出)当前焦点的位置,用户通过变焦点的位置来控制界面。Android系...

  • Android TV 开发总结概览

    焦点设置(一)焦点选中状态(二)焦点导航(三)事件(四)AndroidTVWidget框架之运动焦点框(五)And...

  • Material Design——状态设计(上)

    状态是组件或可交互元素的视觉表达方式。 内容 使用视觉解析禁用状态悬停状态焦点状态选中状态激活状态按下状态拖动状态...

  • 【Unity】EventTrigger各事件触发时机解释

    OnSelect () :当鼠标按下了一个当前未在选中状态的UI时触发。如果一个UI已经被选中(成为焦点UI),那...

  • Android TextView/Button 获取焦点的样式S

    TextView/Button 获取焦点、选中状态样式 当接入外接键盘 按下左右键使得控件活动焦点,同时点击效果也能生效

  • 下拉列表控件---iOS---多级下拉列表控件

    简单好用的, 可自定义选中和非选中状态样式的 (最多支持二级的)下拉列表菜单控件---支持默认选中的条件状态改变 ...

  • UITableView实战总结(二)——点击状态与删除样式

    一、点击时状态 1、不显示选中状态 2、点击时的颜色 二、点击时动画 1、正常点击(选中的图层不覆盖图片) 2、特...

  • TV-焦点-2

    安卓 - Tv , 一般分为两种 焦点动画; 第一种 是 单独给 View 设置 背景(焦点选中,焦点不选中),再...

  • iOS TableViewCell

    //Cell被点击的时候调用,处于选中状态(当有选中状态的Cell时,处于选中状态的Cell也会调)。//长按不放...

  • 数学逻辑VS用户逻辑

    方案一:标签1、2全选后,取消标签1的选中状态,取消标签1及内全部用户的选中状态。方案二:标签1、2全选后,取消标...

网友评论

      本文标题:焦点选中状态(二)

      本文链接:https://www.haomeiwen.com/subject/ubmwvxtx.html