美文网首页
Android学习笔记——TextView点击效果

Android学习笔记——TextView点击效果

作者: 我想努力变得更好 | 来源:发表于2016-11-13 20:12 被阅读0次

    前言

    本类文章是我在学习过程中所遇到已经解决过的问题(Q.Q),把这些自己已经解决过问题发出来,如果有新手遇到和我类似的问题以便能快速解决,节省自己的时间。因为本人还是菜鸟,如有错误希望指正。

    Android 中 Selector 的用法

    Selector 用法例子说明

    在做项目的过程中有遇到过这样一个问题:在点击一个 TextView 或者 Button 之类的控件时,需要给出点击的效果。比如在一个 Textview 在点击前文本文字是白色的,在手指按下时颜色发生改变(比如颜色变浅),之后当手指松开时文本的颜色恢复原来的颜色,这里的效果图用的是亮色(蓝色和绿色)想用其他颜色直接替换即可,效果图如下:
    首先是手指没有点下去的时候:


    手指没有点下去.png

    之后便是手指点下去的时候:


    手指点下去了保持不动.png
    最后就是手指离开屏幕:
    手指离开屏幕.png

    也上的效果能够给客户比较好的点击反馈,提高体验。

    如何使用 Selector

    以 selector_text_color.xml 为例
    首先在 res 目录下新建 drawable 文件夹,再在新建的 drawable 文件夹中新建selector_text_color.xml ,其目录结构为:res/drawable/selector_text_color.xml 。
    这样就把 selector 给建立好了,后面要根据具体的需求要编写里面的内容。

    Selector 常用的属性

    android:state_pressed 如果是 true,当被点击时显示该图片,如果是 false 没被按下时显示默认。
    android:state_focused 如果是 true,获得焦点时显示;如果是 false 没获得焦点显示默认。                  
    android:state_selected 如果是 true,当被选择时显示该图片;是 false 未被选择时显示该图片。                  
    android:state_checkable 如果值为 true,当 CheckBox 能使用时显示该图片;false,当 CheckBox 不能使用时显示该片。                  
    android:state_checked 如果值为 true,当 CheckBox 选中时显示该图片;false,当 CheckBox 为选中时显示该图片。                  
    android:state_enabled 如果值为 true,当该组件能使用时显示该图片;false,当该组件不能使用时显示该图片。                   
    android:state_window_focused 如果值为 true,当此 activity 获得焦点在最前面时显示该图片; false,当没在最前面时显示该图片。

    Selector 用法的实例

    首先在 res/values/colors.xml 下把颜色的代码写进去(引用代码而不是直接写入颜色的代码,要不然会报错) 代码如下:

    <?xml version="1.0" encoding="utf-8"?>
    <resources>
    <color name="colorPrimary">#3F51B5</color>
    <color name="colorPrimaryDark">#303F9F</color>
    <color name="colorAccent">#FF4081</color>
    <color name="textBlue">#2196F3</color>
    <color name="textGreen">#86cd3e</color>
    </resources>
    

    上面三个是系统自带的,下面三个是我自己写入的。 之后便是在 drawable 中创建 XML 文件了,因为这里只是演示,主要还是根据个人的需求来写,这里是当被点击时显示该文字颜色发生改变。创建好的文件代码如下:

    <?xml version="1.0" encoding="utf-8"?>
    <selector xmlns:android="http://schemas.android.com/apk/res/android">  
     <item android:state_pressed="false" android:color="@color/textBlue"/>
     <item android:state_pressed="true" android:color="@color/textGreen"/>
    </selector>
    

    之后便是在布局文件中写入设置好的属性,如果是用的是 TextView 只要在 Texview 属性里面把 android:textColor="XXXXXXX" 里面的改成你原先写好 drawable 下文件的名字就好,如果是 Button 则修改android:background="XXXXXX" ,这里用的是Textview 则属性应该为 android:textColor="@drawable/selector_text_color"。下面贴上布局文件的代码(这个比较简单,实际还是根据个人需求来做)。

    <?xml version="1.0" encoding="utf-8"?>
    <RelativeLayout    xmlns:android="http://schemas.android.com/apk/res/android" 
    android:id="@+id/activity_main"     
    android:layout_width="match_parent" 
    android:layout_height="match_parent"> 
     <TextView android:id="@+id/text"   
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content"                 
     android:text="我是可以变色的噢"     
     android:layout_centerInParent="true"      
     android:textColor="@drawable/selector_text_color"/>
    </RelativeLayout>
    

    最后只要在 Activity 中初始化 Textview 和添加点击事件就行了,代码如下:

    package com.example.xiaozhang.myapplication;import android.support.v7.app.AppCompatActivity;
    import android.os.Bundle;
    import android.view.View;
    import android.widget.TextView;
    public class MainActivity extends AppCompatActivity {
      private TextView mTextView;  
    @Override 
     protected void onCreate(Bundle savedInstanceState) {    
    super.onCreate(savedInstanceState);   
    setContentView(R.layout.activity_main); 
    mTextView = (TextView) findViewById(R.id.text);    
    mTextView.setOnClickListener(new View.OnClickListener() { 
         @Override public void onClick(View view) {
          } 
       }); 
     }
    }
    

    总结

    利用这种方法就可以给客户提供良好的体验效果,让客户知道了已经点击了该按钮,也不需要在代码中设置多次点击切换的图片,减少代码量,也减少美工妹子的制作图片的工作。菜鸟写作,如有错误望指正。

    参考内容

    Android中的Selector的用法

    相关文章

      网友评论

          本文标题:Android学习笔记——TextView点击效果

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