今天看啥  ›  专栏  ›  _Binguner

Anko 中使用 CardView 无法设置 radius 圆角

_Binguner  · 简书  ·  · 2018-10-24 15:15

Anko 提升了 Android 页面的渲染速度,但是在用 Anko 写布局的时却遇到了很多坑,用 XML 可以轻松实现的一些效果,在 Anko 中经常找不到解决方案。比如说题目中的这个问题。

XML 中 CardView 的实现

1. 首先在导入依赖

implementation 'com.android.support:cardview-v7:26.1.0'

2. XML 代码

 <android.support.v7.widget.CardView
    app:cardCornerRadius="@dimen/dp_10"
    app:cardElevation="@dimen/dp_10"
    app:cardPreventCornerOverlap="true"
    app:cardBackgroundColor="@color/colorBackground"
    android:foreground="?android:attr/selectableItemBackgroundBorderless"
    android:clickable="true"
    android:focusable="true"
    android:layout_gravity="center"
    android:layout_width="match_parent"
    android:layout_marginStart="20dp"
    android:layout_marginEnd="20dp"
    android:layout_height="80dp">
</android.support.v7.widget.CardView>

3. 属性详解

cardCornerRadius 属性用来设置 CardView 的圆角效果
cardElevation 属性用来提供 CardView 的阴影效果
cardBackgroundColor 属性用来设置 CardView 中的背景颜色
foreground 属性用来设置 CardView 的点击效果,前提是添加 clickable 和 focusable

效果

Anko 中 CardView 的实现

1. 导入依赖

implementation "org.jetbrains.anko:anko-cardview-v7:$anko_version"  // build.gradle  Module: app
ext.anko_version='0.10.7'  // build.gradle Project

2. Anko 代码

cardView {
    id_cardView = View.generateViewId()
    id = id_cardView
    radius = 43f
    cardElevation = 30f
    backgroundColor = ContextCompat.getColor(ctx, R.color.colorWhite)
    //background.setColorFilter(Color.WHITE,PorterDuff.Mode.SRC_ATOP)
}.lparams(width = matchParent, height = dip(200)) {
        leftMargin = dip(30)
        topMargin = dip(30)
        rightMargin = dip(30)
        topToBottom = id_toolbar
        startToStart = PARENT_ID
        endToEnd = PARENT_ID
}

代码看起来很完美,我们来看一下运行效果:

效果

圆角呢?圆角呢?圆角呢?

问题就出在了这句代码上:

backgroundColor = ContextCompat.getColor(ctx, R.color.colorWhite)

这句代码将背景色设置给了 ColorDrawable 而不是 RoundRectDrawable,所以应该把这句代码改成这样:

background.setColorFilter(ContextCompat.getColor(ctx,R.color.colorWhite),PorterDuff.Mode.SRC_ATOP)

修改之后的运行效果:

效果
欢迎关注



原文地址:访问原文地址
快照地址: 访问文章快照