CardView:如何在保持半径的同时添加渐变背景 [英] CardView: How do I add a gradient background while maintaining the radius

问题描述

我想用CardView重新创建下面的图像.为此，我创建了一个渐变文件(btn_gradient.xml)，然后继续创建CardView.

CardView实现:

<android.support.v7.widget.CardView
        android:layout_width="match_parent"
        android:layout_height="44dp"
        android:layout_margin="25dp"
        app:cardElevation="0dp"
        app:cardCornerRadius="4dp"
        app:cardPreventCornerOverlap="false">

        <TextView
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:gravity="center"
            android:background="@drawable/btn_gradient"
            android:text="Create Account"
            android:textColor="#000000"
            android:textStyle="bold"
            android:textAllCaps="false"/>


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

除半径消失之外，所有其他方法都可以正常运行，这不是我想要的.有没有一种方法可以直接在CardView上设置渐变? cardBackgroundColor属性仅接受颜色，不接受可绘制对象.

任何帮助将不胜感激.

附录:
应要求，这是我的btn_gradient.xml文件:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<gradient
    android:type="linear"
    android:angle="0"
    android:startColor="#ffc200"
    android:endColor="#fca10b" />
</shape>

解决方案

如果我可能要问，您是否有机会在棒棒糖之前的Android设备上进行测试/运行?您的代码似乎可以按您期望的方式工作(弯曲的角以渐变显示)，例外在Android 4上.

要在棒棒糖之前的设备上获得所需的结果，可以将<corners android:radius="4dp" />添加到@drawable/btn_gradient文件中(您必须设置拐角半径以匹配CardView的cardCornerRadius.

I want to re-create the image below with a CardView. To achieve this, I created a gradient file (btn_gradient.xml) and then proceeded to create the CardView.

CardView implementation:

<android.support.v7.widget.CardView
        android:layout_width="match_parent"
        android:layout_height="44dp"
        android:layout_margin="25dp"
        app:cardElevation="0dp"
        app:cardCornerRadius="4dp"
        app:cardPreventCornerOverlap="false">

        <TextView
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:gravity="center"
            android:background="@drawable/btn_gradient"
            android:text="Create Account"
            android:textColor="#000000"
            android:textStyle="bold"
            android:textAllCaps="false"/>


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

Everything works fine this way except that the radius disappears and this is not what I want. Is there a way I can set the gradient directly on the CardView? The cardBackgroundColor attribute accepts only colors, not drawables.

Any help would be appreciated.

Addendum:
As requested, this is my btn_gradient.xml file:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<gradient
    android:type="linear"
    android:angle="0"
    android:startColor="#ffc200"
    android:endColor="#fca10b" />
</shape>

解决方案

If I may ask, are you per-chance testing/running on a pre-lollipop Android device? Your code seems to work as you desire (curved corners showing with the gradient) except on Android 4.

To achieve the desired result on pre-lollipop devices, you can add <corners android:radius="4dp" /> to your @drawable/btn_gradient file, (you would have to set the corner radius to match the CardView's cardCornerRadius.

这篇关于CardView:如何在保持半径的同时添加渐变背景的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！