美文网首页
关于Android Button水波纹效果

关于Android Button水波纹效果

作者: 晓风残月酒醒 | 来源:发表于2017-07-19 15:49 被阅读0次

    今天设计给我出了一个难题,让我把按钮改成水波纹的样式并且制定固定的颜色。在网上找了好几个小时也没有解决这个问题,最终找到大神提供的解决方案,原文在这里:http://blog.csdn.net/u012045061/article/details/50973425

    此图片非项目对应图片
    稍有不同的地方在于,设计要求按钮在disable的时候展示另一种颜色和字体,这就比较麻烦了。
    由于动画都有固定的时间限制,所以采用动画的方式并不是特别可取,诸位看官还请留意,最好使用Android系统提供的。
    不说了,直接上代码:
    1.style中的theme需要使用AppCompat的主题,没必要给按钮设置固定的style
    2.Activity和Fragment中无需做任何操作
    3.字体颜色选择器:btn_color_selector.xml
    <selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:color="#808080" android:state_enabled="false" />
    <item android:color="@android:color/white" android:state_enabled="true" />
    </selector>

    4.正常状态下button的样式:dot_check_009ee7.xml
    <shape xmlns:android="http://schemas.android.com/apk/res/android">
    <solid android:color="#009ee7" />
    <corners android:radius="22dp" />
    </shape>

    5.按压状态下按钮的样式:dot_check_2d63af.xml
    <shape xmlns:android="http://schemas.android.com/apk/res/android">
    <solid android:color="#2d63af" />
    <corners android:radius="22dp" />
    </shape>

    6.不可点击状态下的按钮样式:dot_check_b3b3b3.xml
    <shape xmlns:android="http://schemas.android.com/apk/res/android">
    <solid android:color="#b3b3b3" />
    <corners android:radius="22dp" />
    </shape>

    7.创建默认的背景选择器:selector_btn_blue.xml
    <selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@drawable/dot_check_b3b3b3" android:state_enabled="false" />
    <item android:drawable="@drawable/dot_check_2d63af" android:state_pressed="true" />
    <item android:drawable="@drawable/dot_check_2d63af" android:state_focused="true" />
    <item android:drawable="@drawable/dot_check_2d63af" android:state_selected="true" />
    <item android:drawable="@drawable/dot_check_009ee7" />
    </selector>

    8.在res目录下创建drawable-v21目录:

    创建drawable-v21目录.png
    9.在drawable-v21目录中创建一个水波纹背景选择样式:selector_btn_blue.xml
    <ripple xmlns:android="http://schemas.android.com/apk/res/android"
    android:color="#2d63af">//这里是扩散水波纹的色值里面的色值可以任选一个
    <item>
    <selector>
    // 这里是当按钮处于disable状态下的颜色
    <item
    android:drawable="@drawable/dot_check_b3b3b3"
    android:state_enabled="false" />
    // 这里是默认展示出来的颜色
    <item
    android:drawable="@drawable/dot_check_009ee7"
    android:state_enabled="true" />
    </selector>
    </item>
    </ripple>
    10.在布局文件中引用:
    <RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <Button
        android:id="@+id/tv_certificate_enterprise_submit"
        android:layout_width="@dimen/button_width"
        android:layout_height="@dimen/button_height"
        android:layout_centerInParent="true"
        android:background="@drawable/selector_btn_blue"
        style="?android:attr/borderlessButtonStyle"
        android:enabled="true"
        android:gravity="center"
        android:text="提交审核"
        android:textColor="@drawable/btn_color_selector"
        android:textSize="16sp" />
    
    <!--style="?android:attr/borderlessButtonStyle"-->
    <!--用于去除按钮的底部阴影效果-->
    

    </RelativeLayout>

    整体的样式.png

    相关文章

      网友评论

          本文标题:关于Android Button水波纹效果

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