如何使用 XML 创建具有三种以上颜色的渐变
How to create Gradient with more than three colors using XML
我需要创建一个具有 5 种不同颜色的线性渐变。
我尝试了以下方法:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<layer-list>
<item>
<shape>
<gradient
android:startColor="@color/diagramBlueColor"
android:endColor="@color/diagramGreenColor"
android:type="linear"
android:angle="0" />
</shape>
</item>
<item>
<shape>
<gradient
android:startColor="@color/diagramGreenColor"
android:endColor="@color/diagramYellowColor"
android:type="linear"
android:angle="0" />
</shape>
</item>
<item>
<shape>
<gradient
android:startColor="@color/diagramYellowColor"
android:endColor="@color/diagramOrangeColor"
android:type="linear"
android:angle="0" />
</shape>
</item>
<item>
<shape>
<gradient
android:startColor="@color/diagramOrangeColor"
android:endColor="@color/diagramRedColor"
android:type="linear"
android:angle="0" />
</shape>
</item>
</layer-list>
</item>
</selector>
但是每个形状都覆盖了之前的形状。我需要使用 xml 创建渐变。我该怎么做?
如果纯 xml 无法实现,那么我该如何在 java 代码中实现?
我试过这个:
/**
*
* @return
*/
public static PaintDrawable getColorScala() {
ShapeDrawable.ShaderFactory shaderFactory = new ShapeDrawable.ShaderFactory() {
@Override
public Shader resize(int width, int height) {
LinearGradient linearGradient = new LinearGradient(0, 0, width, height,
new int[] {
0xFF1e5799,
0xFF207cca,
0xFF2989d8,
0xFF207cca }, //substitute the correct colors for these
new float[] {
0, 0.40f, 0.60f, 1 },
Shader.TileMode.REPEAT);
return linearGradient;
}
};
PaintDrawable paint = new PaintDrawable();
paint.setShape(new RectShape());
paint.setShaderFactory(shaderFactory);
return paint;
}
但是当我设置视图的背景时:
view.setBackground(Colors.getColorScala());
我的视图背景是白色的。我希望它看起来像这样:
您已经发现不能。查找颜色以使其在代码中更加灵活,我认为这是最好的方法
getColor(R.color.rainbow_1);
getColor(R.color.rainbow_2);
getColor(R.color.rainbow_3);
getColor(R.color.rainbow_4);
getColor(R.color.rainbow_5);
并创建你的数组
您可以通过 colors.xml 的 getColor 获取您的颜色或解析它..
int[] gradientColors = new int[] {
Color.parseColor("#80E1F1"),
Color.parseColor("#5257F6"),
Color.parseColor("#8222FC")
};
float[] gradientColorPos = new float[] {
0, 0.5f, 1f
};
像这样使用..
paint.setShader(new LinearGradient(0, 0, width, height, gradientColors, gradientColorPos, Shader.TileMode.MIRROR));
我需要创建一个具有 5 种不同颜色的线性渐变。 我尝试了以下方法:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<layer-list>
<item>
<shape>
<gradient
android:startColor="@color/diagramBlueColor"
android:endColor="@color/diagramGreenColor"
android:type="linear"
android:angle="0" />
</shape>
</item>
<item>
<shape>
<gradient
android:startColor="@color/diagramGreenColor"
android:endColor="@color/diagramYellowColor"
android:type="linear"
android:angle="0" />
</shape>
</item>
<item>
<shape>
<gradient
android:startColor="@color/diagramYellowColor"
android:endColor="@color/diagramOrangeColor"
android:type="linear"
android:angle="0" />
</shape>
</item>
<item>
<shape>
<gradient
android:startColor="@color/diagramOrangeColor"
android:endColor="@color/diagramRedColor"
android:type="linear"
android:angle="0" />
</shape>
</item>
</layer-list>
</item>
</selector>
但是每个形状都覆盖了之前的形状。我需要使用 xml 创建渐变。我该怎么做?
如果纯 xml 无法实现,那么我该如何在 java 代码中实现? 我试过这个:
/**
*
* @return
*/
public static PaintDrawable getColorScala() {
ShapeDrawable.ShaderFactory shaderFactory = new ShapeDrawable.ShaderFactory() {
@Override
public Shader resize(int width, int height) {
LinearGradient linearGradient = new LinearGradient(0, 0, width, height,
new int[] {
0xFF1e5799,
0xFF207cca,
0xFF2989d8,
0xFF207cca }, //substitute the correct colors for these
new float[] {
0, 0.40f, 0.60f, 1 },
Shader.TileMode.REPEAT);
return linearGradient;
}
};
PaintDrawable paint = new PaintDrawable();
paint.setShape(new RectShape());
paint.setShaderFactory(shaderFactory);
return paint;
}
但是当我设置视图的背景时:
view.setBackground(Colors.getColorScala());
我的视图背景是白色的。我希望它看起来像这样:
您已经发现不能。查找颜色以使其在代码中更加灵活,我认为这是最好的方法
getColor(R.color.rainbow_1);
getColor(R.color.rainbow_2);
getColor(R.color.rainbow_3);
getColor(R.color.rainbow_4);
getColor(R.color.rainbow_5);
并创建你的数组
您可以通过 colors.xml 的 getColor 获取您的颜色或解析它..
int[] gradientColors = new int[] {
Color.parseColor("#80E1F1"),
Color.parseColor("#5257F6"),
Color.parseColor("#8222FC")
};
float[] gradientColorPos = new float[] {
0, 0.5f, 1f
};
像这样使用..
paint.setShader(new LinearGradient(0, 0, width, height, gradientColors, gradientColorPos, Shader.TileMode.MIRROR));