如何创建具有半透明背景颜色和圆角半径的 CardView？答案

【问题标题】：How do I create a CardView with a semitransparent background color and a corner radius?如何创建具有半透明背景颜色和圆角半径的 CardView？
【发布时间】：2019-05-17 10:01:54
【问题描述】：

我正在尝试制作一个背景为#88FFFFFF 并带有圆角的 CardView。它不能正常工作，在 Android Studio 中边角是双重不透明的，而在我的设备上整个边框是双重不透明的。

代码如下：

<android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="100dp"
    android:layout_height="100dp"
    app:cardBackgroundColor="#88FFFFFF"
    app:cardElevation="2dp"
    app:cardCornerRadius="12dp">

</android.support.v7.widget.CardView>

结果如下：

有没有办法在不为背景创建可绘制对象的情况下解决这个问题？

【问题讨论】：

28.0.0，我也在使用深色应用主题 (Theme.AppCompat.NoActionBar)

标签： android android-cardview alpha rounded-corners

【解决方案1】：

只需在 Cardview 中使用线性布局。使用“#88FFFFFF”设置线性布局背景。

<CardView>
    <LinearLayout background=""></LinearLayout>
</CardView>

【讨论】：

【解决方案2】：

试试这个

<android.support.v7.widget.CardView
        android:layout_width="100dp"
        android:layout_height="100dp"
        app:cardBackgroundColor="#88FFFFFF"
        app:cardCornerRadius="6dp"
        app:cardUseCompatPadding="true"
        app:cardElevation="5dp">

【讨论】：

【解决方案3】：

尝试移除海拔，在新的MaterialCardView 组件中可用

app:cardElevation="0dp"
app:cardMaxElevation="0dp"

你也可以添加笔画，例如

app:strokeColor="#f9d5e9"
app:strokeWidth="1.5dp"

【讨论】：

【解决方案4】：

我在 Xamarin.Android 中遇到了 CardView 的这个问题，并找到了这个解决方案：

这是在 C#/Xamarin 中，但 Java/Kotlin 代码非常相似。

      // There is a bug with CardView
      // Where setting a semi-transparent colour + corner radius + elevation will display a border with the opaque (a=255) colour.
      // To resolve this I'm manually calculating the desired colour (with a=255/2) and using an 
      // Android.Graphics.Color without using the alpha channel
 
      float opacity = 0.5f;
      var color = GetDesiredColorOpaque();
      var viewBgColor = GetViewBgColor(); 
      var desiredColor = new Color(color.R, color.G, color.B, color.A / 2); // not used - but resulting flattenedCardColor will look equivalent without transparency
 
      // Formula based on https://filosophy.org/code/online-tool-to-lighten-color-without-alpha-channel/
      // NB this only works because we're not really needing transparency i.e. the resulting card is not transparent, it is just colored as if it was transparent and behind it was just empty viewBgColor 
      var flattenedCardColor = new Color(
        r: (byte) (opacity * color.R + (1 - opacity) * viewBgColor.R),
        g: (byte) (opacity * color.G + (1 - opacity) * viewBgColor.G),
        b: (byte) (opacity * color.B + (1 - opacity) * viewBgColor.B),
        a: (byte) 255);
      
      cardView.CardBackgroundColor = Android.Content.Res.ColorStateList.ValueOf(flattenedCardColor);

请注意，此解决方案通过使用不透明度方程计算所需的 CardView 背景颜色来工作，因此它实际上不会使 CardView 透明。我这样做是因为我认为这个问题是由 CardView 和半透明颜色的一些错误引起的，因为没有建议的解决方案适用于我的用例（需要以编程方式设置 CardView 颜色的样式）。

您得到的结果是正确着色的 CardView 背景，就像在 Alpha 通道中设置了不透明度一样，并且在使用 cardElevation 和/或 cardCornerRadius 时没有视觉错误。

感谢https://filosophy.org/code/online-tool-to-lighten-color-without-alpha-channel/ 提供方程式。

【讨论】：