美文网首页Android开发
Android 实现圆角按钮 ( selector状态选择器)

Android 实现圆角按钮 ( selector状态选择器)

作者: W会痛的石头 | 来源:发表于2020-05-15 18:01 被阅读0次

    不知道说什么,直接进入正题吧。开整

    selector

    <!--注意 android:background="@drawable/btn_selector"-->

        <Button

            android:id="@+id/Button1"

            android:layout_width="wrap_content"

            android:layout_height="wrap_content"

            android:layout_centerInParent="true"

            android:background="@drawable/btn_selector"

            android:text="@string/hello_world" />

    btn_selector是一个自定义的xml文件,继续看这个文件。在drawable目录下新建一个selector文件,btn_selector.xml

    <?xml version="1.0" encoding="utf-8"?>

    <selector xmlns:android="http://schemas.android.com/apk/res/android">

        <!-- Button正常状态下的背景 -->

        <item android:drawable="@drawable/btn_bg_normal" android:state_pressed="false"/>

        <!-- Button按下时的背景 -->

        <item android:drawable="@drawable/btn_bg_pressed" android:state_pressed="true"/>

    </selector>

    btn_selector.xml文件中大家又发现了btn_bg_normalbtn_bg_pressed,这两个文件也是在res/drawable目录下的定义的。

    btn_bg_normal.xml

    <?xml version="1.0" encoding="utf-8"?>

    <!-- 按钮正常的时候的背景 -->

    <!-- shape的默认形状是rectangle,还有oval(椭圆),line(线),ring(圆环)-->

    <shape xmlns:android="http://schemas.android.com/apk/res/android">

        <!-- 矩形的圆角弧度 -->

        <corners android:radius="10dp" />

        <!-- 矩形的填充色 -->

        <solid android:color="#FF4081" />

        <!-- 矩形的边框的宽度,每段虚线的长度,和两段虚线之间的颜色和颜色 -->

        <stroke

            android:width="1dp"

            android:dashWidth="8dp"

            android:dashGap="4dp"

            android:color="#4eb621" />

    </shape>

    btn_bg_pressed.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="#3F51B5" />

        <!-- 矩形的边框的宽度,每段虚线的长度,和两段虚线之间的颜色和颜色 -->

        <stroke

            android:width="1dp"

            android:color="#4eb621"

            android:dashGap="4dp"

            android:dashWidth="8dp" />

    </shape>

    gradient 渐变背景色

    <gradient

      android:angle="integer"

      android:centerX="Float"

      android:centerY="Float"

      android:centerColor="integer"

      android:startColor="color"

      android:endColor="color"

      android:gradientRadius="integer"

      android:type=["linear"|"radial"|"sweep"]

      android:usesLevel=["true"|"false"]

      />

    angle:角度,当 android:type=“linear”时有效 ,角度数应该是45度的倍数,逆时针方向旋转

    centerX:Float。渐变色中心的 X 相对位置( 0-1.0 )。当 android:type=“linear”时无效

    centerY:Float。渐变色中心的 Y 相对位置( 0-1.0 )。当 android:type=“linear”时无效

    centerColor:color。可选的颜色,出现在 start 和 end 颜色之间。

    gradientRadius:Float。渐变色的半径。当 android:type=“radial” 时有效。

    startcolor:开始的颜色

    endcolor:结束的颜色

    type:渐变色的样式。有效值为:

    “linear”:线性渐变,默认值

    “radial”:环形渐变。 start 颜色是处于中间的颜色

    “sweep”:扇形渐变

    useLevel:Boolean。“ true ”表示可以当作 LevelListDrawable 使用

    两种创建方式:

    以Xml方式写出状态选择器,然后将我们写好的selector状态器存在放res - drawable res - color 文件夹下,较为常用

    在代码中动态创建selector,实现不如前者简单,但胜在灵活,一般用在选择器状态改变频繁的情况下

    注意(请格外注意):

    设置 bankgrpud的时候,我们的selector状态选择器存放在res - drawable 下!!!

    设置TextColor属性的时候,我们的selector状态选择器存放在res - color 下!!!

    状态设置类型:

    常用类型

    //设置是否按压状态,一般在true时设置该属性,表示已按压状态,默认为false

    android:state_pressed

    //设置是否选中状态,true表示已选中,false表示未选中

    android:state_selected

    //设置是否勾选状态,主要用于CheckBox和RadioButton,true表示已被勾选,false表示未被勾选

    android:state_checked

    //设置勾选是否可用状态,类似state_enabled,只是state_enabled会影响触摸或点击事件,state_checkable影响勾选事件

    android:state_checkable

    //设置是否获得焦点状态,true表示获得焦点,默认为false,表示未获得焦点

    android:state_focused

    //设置触摸或点击事件是否可用状态,一般只在false时设置该属性,表示不可用状态

    android:state_enabled

    ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------

    常用类型示例:

    *样式一:点击改变字体颜色 - android:state_pressed(按压状态) **

    selector状态选择器(bg_btn_one (存放 res - color))

    <?xml version="1.0" encoding="utf-8"?>

    <selector xmlns:android="http://schemas.android.com/apk/res/android">

        <item android:color="@color/colorPrimary" android:state_pressed="true"/>

        <item android:color="@color/colorAccent" />

    </selector>

    使用处:

        <Button

            android:textColor="@color/bg_btn_one"

            android:layout_width="match_parent"

            android:layout_height="45dp"

            android:text="样式一:点击改变字体颜色"

            android:gravity="center"

            />

    样式二:点击改变背景颜色

    selector状态选择器(bg_btn_two (存放 res - drawable))

    <?xml version="1.0" encoding="utf-8"?>

    <selector xmlns:android="http://schemas.android.com/apk/res/android">

        <item android:drawable="@color/colorAccent" android:state_pressed="true"/>

        <item android:drawable="@color/colorPrimary" />

    </selector>

    使用处:

      <Button

            android:background="@drawable/bg_btn_two"

            android:layout_width="match_parent"

            android:layout_height="45dp"

            android:text="样式二:点击改变背景颜色"

            android:gravity="center"

            />

    样式三:改变背景色同时改变字体色

    selector状态选择器(bg_btn_one (存放 res - color))

    <?xml version="1.0" encoding="utf-8"?>

    <selector xmlns:android="http://schemas.android.com/apk/res/android">

        <item android:color="@color/colorPrimary" android:state_pressed="true"/>

        <item android:color="@color/colorAccent" />

    </selector>

    selector状态选择器(bg_btn_two (存放 res - drawable))

    <?xml version="1.0" encoding="utf-8"?>

    <selector xmlns:android="http://schemas.android.com/apk/res/android">

        <item android:drawable="@color/colorAccent" android:state_pressed="true"/>

        <item android:drawable="@color/colorPrimary" />

    </selector>

    使用处:

    <Button

            android:background="@drawable/bg_btn_two"

            android:textColor="@color/bg_btn_one"

            android:layout_width="match_parent"

            android:layout_height="45dp"

            android:text="样式三:改变背景色同时改变字体色"

            android:gravity="center"

            />

    样式四: android:state_checked (勾选状态)

    selector状态选择器(bg_check_three(存放 res - drawable))

    <?xml version="1.0" encoding="utf-8"?>

    <selector xmlns:android="http://schemas.android.com/apk/res/android">

        <item android:drawable="@color/colorPrimary" android:state_checked="true"/>

        <item android:drawable="@color/colorAccent" />

    </selector>

    使用处:

      <CheckBox

            android:layout_marginTop="20dp"

            android:id="@+id/btn"

            android:background="@drawable/bg_check_three"

            android:layout_width="match_parent"

            android:layout_height="45dp"

            android:text="Checked:点击后背景状态长存"

            android:gravity="center"

            />

    样式五:android:state_focused (焦点状态)

    selector状态选择器(bg_check_three(存放 res - color))

    <?xml version="1.0" encoding="utf-8"?>

    <selector xmlns:android="http://schemas.android.com/apk/res/android">

        <item android:color="@color/colorPrimary" android:state_focused="true"/>

        <item android:color="@color/colorAccent" />

    </selector>

    <EditText

            android:textColor="@color/bg_edittext_one"

            android:layout_width="match_parent"

            android:layout_height="45dp"

            android:text="焦点样式:改变背景色同时改变字体色"

            android:gravity="center"

            />

     读到最后的福利,这才是重点啊。哈哈哈哈哈哈

    相关文章

      网友评论

        本文标题:Android 实现圆角按钮 ( selector状态选择器)

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