如何在布局文件中更改可绘制形状的颜色

Question

我已经创建了一个可绘制的圆形形状。我将其用作线性布局的背景，目前正在正常运行。但问题是，我想创建6个不同颜色的圆圈。所以我可以使用一个可绘制的形状并为不同的圆圈更改其颜色吗？

这是我的可绘制圆形形状

<?xml version="1.0" encoding="utf-8"?>
<shape
xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval"
>

<solid
    android:color="@color/colorPrimary"
    />
<size
    android:width="30dp"
    android:height="30dp"/>
</shape>

我想使用不同颜色的drawable圆形来创建这个布局。

布局：

- hasan_shaikh

---

请查看这篇帖子：http://stackoverflow.com/questions/40183852/defined-custom-shape-for-button-in-xml-now-i-want-to-change-the-color-dynamical - Ali Bdeir

请查看此帖子。 - Akash Patel

Answer 1

您可以通过将同一个可绘制对象（即您提供的对象）设置为所有按钮的背景，然后在代码中实现：

示例：

Drawable mDrawable = ContextCompat.getDrawable(context, R.drawable.yourDrawable); 
mDrawable.setColorFilter(new PorterDuffColorFilter(yourColorInt,PorterDuff.Mode.MULTIPLY));

final int sdk = android.os.Build.VERSION.SDK_INT;
if(sdk < android.os.Build.VERSION_CODES.JELLY_BEAN) {
    yourButton.setBackgroundDrawable(mDrawable);
} else {
    yourButton.setBackground(mDrawable);
}

对于每个按钮，都要执行此操作，但记得将yourColorInt替换为您想要应用于该按钮的颜色。

- Ali Bdeir

Answer 2

虽然 @AbAppletic 的答案很好，但我想增加另一种解决问题的方式。您可以在Java中定义一个圆形视图，然后在XML布局中多次使用此视图，并根据需要更改其颜色。

圆形视图:

import android.content.Context;
import android.content.res.TypedArray;
import android.graphics.Canvas;
import android.graphics.Paint;
import android.util.AttributeSet;
import android.view.View;


public class Circle extends View {

Paint p;
int color ;
public Circle(Context context) {
    this(context, null);
}

public Circle(Context context, AttributeSet attrs) {
    this(context, attrs, 0);
}

public Circle(Context context, AttributeSet attrs, int defStyle) {
    super(context, attrs, defStyle);
    // real work here
    TypedArray a = context.getTheme().obtainStyledAttributes(
            attrs,
            R.styleable.Circle,
            0, 0
    );

    try {

        color = a.getColor(R.styleable.Circle_circleColor, 0xff000000);
    } finally {
        // release the TypedArray so that it can be reused.
        a.recycle();
    }
    init();
}

public void init()
{
    p = new Paint();
    p.setColor(color);
}

@Override
protected void onDraw(Canvas canvas) {
    // TODO Auto-generated method stub
    super.onDraw(canvas);
    if(canvas!=null)
    {
        canvas.drawCircle(getHeight()/2, getWidth()/2,getWidth()/2,p );
    }
}

}

把以下内容添加到attrs.xml文件中：

<declare-styleable name="Circle">
        <attr name="circleRadius" format="integer"/>
        <attr name="circleColor" format="color" />
    </declare-styleable>

然后，您可以在布局中多次使用此视图，并更改其背景：

<?xml version="1.0" encoding="utf-8"?>
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:orientation="vertical">

<TableRow android:gravity="center">

    <com.afranet.broadbandportal.view.Circle xmlns:app="http://schemas.android.com/apk/res-auto"
        android:id="@+id/cv"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_margin="5dp"
        android:background="@color/colorPrimary"
        app:circleColor="@color/color1" />

    <com.afranet.broadbandportal.view.Circle xmlns:app="http://schemas.android.com/apk/res-auto"
        android:id="@+id/cv2"
        android:layout_width="120dp"
        android:layout_height="120dp"
        android:layout_margin="5dp"
        android:background="@color/colorPrimary"
        app:circleColor="@color/color2" />

</TableRow>

<TableRow android:gravity="center">

    <com.afranet.broadbandportal.view.Circle xmlns:app="http://schemas.android.com/apk/res-auto"
        android:id="@+id/cv3"
        android:layout_width="120dp"
        android:layout_height="120dp"
        android:layout_margin="5dp"
        android:background="@color/colorPrimary"
        app:circleColor="@color/color3" />

    <com.afranet.broadbandportal.view.Circle xmlns:app="http://schemas.android.com/apk/res-auto"
        android:id="@+id/cv4"
        android:layout_width="120dp"
        android:layout_height="120dp"
        android:layout_margin="5dp"
        android:background="@color/colorPrimary"
        app:circleColor="@color/color4" />

</TableRow>

<TableRow android:gravity="center">

    <com.afranet.broadbandportal.view.Circle xmlns:app="http://schemas.android.com/apk/res-auto"
        android:id="@+id/cv5"
        android:layout_width="120dp"
        android:layout_height="120dp"
        android:layout_margin="5dp"
        android:background="@color/colorPrimary"
        app:circleColor="@color/color5" />

    <com.afranet.broadbandportal.view.Circle xmlns:app="http://schemas.android.com/apk/res-auto"
        android:id="@+id/cv6"
        android:layout_width="120dp"
        android:layout_height="120dp"
        android:layout_margin="5dp"
        android:background="@color/colorPrimary"
        app:circleColor="@color/color6" />

</TableRow>

这是屏幕截图：

- Milad Faridnia

---

非常好的回答。+1 - Ali Bdeir

@AbAppletic 谢谢，你的回答也很完美 ;) - Milad Faridnia

Answer 3

现在您可以使用backgroundTint标签来更改可绘制形状的颜色（API级别21）

                android:backgroundTint="@color/yellow_color"

- Aditya Rohilla

---

问题是轮廓/描边也会改变颜色。 - Rowan Gontier

Answer 4

保持相同的形状并应用不同的 app:backgroundTint。

android:background="@drawable/shape"
app:backgroundTint="@color/blue"

请注意app:（自定义命名空间），获取更多信息Android布局 - 何时使用app: vs android:?。

- Raymond Chenon