关于android Ripple Effect的那些事
2018-02-22 14:05
295 查看
一直觉得android的Ripple Effect这个效果比较有意思,更好的地方在于它不需要多张图,比如以前的常规一个效果,点击后一个效果。比较坑爹的一点在于它只在v21及后面的版本可以使用,貌似有些做法是v21以下的做兼容处理。瞬间感觉好麻烦,
然后继续找 发现了 https://stackoverflow.com/questions/26686250/material-effect-on-button-with-background-color 这个,只需要设置一个即可,关键的属性是设置style
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"
tools:context="cn.yeagle.rippleeffect.MainActivity">
<android.support.v7.widget.AppCompatButton
android:id="@+id/btn_mobile_login"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.45"
android:text="登录"
style="@style/login_btn_style"
/>
</android.support.constraint.ConstraintLayout>
<?xml version="1.0" encoding="utf-8"?>
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
android:color="?android:colorPrimaryDark"
>
<item>
<shape
android:shape="rectangle"
xmlns:android="http://schemas.android.com/apk/res/android">
<solid android:color="#fffc985e" />
<corners android:radius="70dp" />
</shape>
</item>
</ripple>
parent="@style/Widget.AppCompat.Button.Borderless">
Widget.AppCompat.Toolbar.Button.Navigation这个只是一个圆形区域,然后可以设置
<item name="android:minWidth">35dp</item>来限制宽度,不然有时候根本不是那么宽
mark一下:ripple只是针对背景的,想imageview 设置src完全就没有效果,设置背景,就会根据背景颜色的透明度先显示区域
然后继续找 发现了 https://stackoverflow.com/questions/26686250/material-effect-on-button-with-background-color 这个,只需要设置一个即可,关键的属性是设置style
Widget.AppCompat.Button.Colored。看到这里高兴的像个200斤的孩子,赶紧一试发现完全没有效果。
布局如下:<android.support.constraint.ConstraintLayout 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"
tools:context="cn.yeagle.rippleeffect.MainActivity">
<android.support.v7.widget.AppCompatButton
android:id="@+id/btn_mobile_login"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.45"
android:text="登录"
style="@style/login_btn_style"
/>
</android.support.constraint.ConstraintLayout>
<style name="base_btn_style1" parent="@style/Widget.AppCompat.Button.Colored"> <!--parent="@style/Widget.AppCompat.Button.Borderless"--> <item name="android:textColor">#fd8803</item> <item name="android:textSize">16sp</item> <item name="android:background">@drawable/btn_circle_stroke_bg</item> </style> <style name="login_btn_style" parent="base_btn_style1"> <item name="android:layout_width">match_parent</item> <item name="android:layout_height">40dp</item> <item name="android:layout_marginLeft">30dp</item> <item name="android:layout_marginRight">30dp</item>
<?xml version="1.0" encoding="utf-8"?> <shape android:shape="rectangle" xmlns:android="http://schemas.android.com/apk/res/android"> <solid android:color="#01f0f0f0" /> <corners android:radius="70dp" /> <stroke android:width="1px" android:color="#fffc985e" /> </shape>
后面才发现shape的问题,针对自己设置的shape根本无效。既然这样那么我适配v21的,我也要看下效果吧
添加v21的效果
<?xml version="1.0" encoding="utf-8"?>
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
android:color="?android:colorPrimaryDark"
>
<item>
<shape
android:shape="rectangle"
xmlns:android="http://schemas.android.com/apk/res/android">
<solid android:color="#fffc985e" />
<corners android:radius="70dp" />
</shape>
</item>
</ripple>
效果是有了,但是发现四周有了一个阴影,这个倒是比较简单
parent="@style/Widget.AppCompat.Button.Borderless">
将上面的parent,改成这个就好了。其实中间还有个问题就是,我在设置shape的时候,想把solid设置成透明,结果效果也不出来,好像上面的颜色alpha跟这个alpha一致,改成不透明的里面就可以了。
样式名 | 说明 |
---|---|
Widget.AppCompat.Button | 正常 |
Widget.AppCompat.Button.Small | 小按钮 |
Widget.AppCompat.Button.Borderless | 无背景 |
Widget.AppCompat.Button.Borderless.Colored | 无背景有预设文本颜色 |
Widget.AppCompat.Button.Colored | 有预设文本颜色 |
另外在自定义标题栏,同样这样设置,发现好丑,哈哈。再看系统有专门的style,
Widget.AppCompat.Toolbar.Button.Navigation这个只是一个圆形区域,然后可以设置
<item name="android:minWidth">35dp</item>来限制宽度,不然有时候根本不是那么宽
mark一下:ripple只是针对背景的,想imageview 设置src完全就没有效果,设置背景,就会根据背景颜色的透明度先显示区域
相关文章推荐
- android开发中,那些年关于焦点返回的那些事
- 关于Android架构那些事
- 关于android资源文件那些事。
- Android中关于Fragment的那些事、那些坑
- 关于Android源码的那些事
- Android 关于手机屏幕的那些事
- Android关于ListView中item与控件抢夺焦点的那些事
- Android关于面试那些事
- 关于Android权限那些事(应用程序获取root权限,system权限)
- 【Android开发经验】关于ListView中item与控件抢夺焦点的那些事
- Android 关于GridView那些事
- Android 关于 px、dp、sp 的那些事
- 从零开始打造一个新闻订阅APP之Android篇(三、关于图片加载、展示的那些事)
- 说说关于Android使用Gson解析Json所需实体类的那些事~
- Android 关于回调的那些事
- 关于Android适配那些事
- 【Android界面实现】关于自定义Dialog的那些事
- 关于android LayoutInflater那些事
- 关于Android Volley的那些事(一)
- 关于Android的透明度的那些事