如何使梯度背景在android

我想创建一个渐变背景,渐变在上半部分,在下半部分有一个纯色,如下图所示:

.

我不能,因为centerColor展开覆盖底部和顶部。

在按钮的渐变中,一条白色的水平线淡出了蓝色的顶部和按钮。

我如何制作一个像第一张图片一样的背景?我如何能使小centerColor不展开?

这是上面后台按钮的XML代码。

<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle" >
<gradient
android:startColor="#6586F0"
android:centerColor="#D6D6D6"
android:endColor="#4B6CD6"
android:angle="90"/>
<corners
android:radius="0dp"/>




</shape>
549827 次浏览

为什么不创建一个图像或9补丁图像并使用它?

下面的链接提供了一个很好的指南:

http://android.amberfog.com/?p=247

如果你坚持使用一个形状,尝试下面的网站(选择Android在左下角): http://angrytools.com/gradient/ < / p >

我已经创建了一个类似的梯度(不精确),你有一个在这个链接: http://angrytools.com/gradient/?0_6586f0,54_4B6CD6,2_D6D6D6&0_100,100_100&l_269 < / p >

首先,您需要创建一个gradient.xml,如下所示

<shape>
<gradient android:angle="270" android:endColor="#181818" android:startColor="#616161" />


<stroke android:width="1dp" android:color="#343434" />
</shape>

然后你需要在布局的背景中提到上面的渐变。如下

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="@drawable/gradient"
>
</LinearLayout>

你可以通过使用xml Layer-List来创建这种“半渐变”外观,将顶部和底部的“带”合并到一个文件中。每个带都是一个xml形状。

有关详细教程,请参阅之前关于SO的回答:Multi-gradient形状

试试这个:

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


<gradient
android:angle="90"
android:centerColor="#555994"
android:endColor="#b5b6d2"
android:startColor="#555994"
android:type="linear" />


<corners
android:radius="0dp"/>


</shape>

或者你可以在代码中使用你在PSD中想到的任何东西:

    private void FillCustomGradient(View v) {
final View view = v;
Drawable[] layers = new Drawable[1];


ShapeDrawable.ShaderFactory sf = new ShapeDrawable.ShaderFactory() {
@Override
public Shader resize(int width, int height) {
LinearGradient lg = new LinearGradient(
0,
0,
0,
view.getHeight(),
new int[] {
getResources().getColor(R.color.color1), // please input your color from resource for color-4
getResources().getColor(R.color.color2),
getResources().getColor(R.color.color3),
getResources().getColor(R.color.color4)},
new float[] { 0, 0.49f, 0.50f, 1 },
Shader.TileMode.CLAMP);
return lg;
}
};
PaintDrawable p = new PaintDrawable();
p.setShape(new RectShape());
p.setShaderFactory(sf);
p.setCornerRadii(new float[] { 5, 5, 5, 5, 0, 0, 0, 0 });
layers[0] = (Drawable) p;


LayerDrawable composite = new LayerDrawable(layers);
view.setBackgroundDrawable(composite);
}

下面的链接可以帮助你http://angrytools.com/gradient/。这将在android中创建自定义渐变背景,就像在photoshop中一样。

//Color.parseColor() method allow us to convert
// a hexadecimal color string to an integer value (int color)
int[] colors = {Color.parseColor("#008000"),Color.parseColor("#ADFF2F")};


//create a new gradient color
GradientDrawable gd = new GradientDrawable(
GradientDrawable.Orientation.TOP_BOTTOM, colors);


gd.setCornerRadius(0f);
//apply the button background to newly created drawable gradient
btn.setBackground(gd);

此处参考 https://android--code.blogspot.in/2015/01/android-button-gradient-color.html < / p >

可视化的例子有助于解决这类问题。

样板

为了创建一个渐变,你在res/drawable中创建一个xml文件。我调用我的my_gradient_drawable.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="#f6ee19"
android:endColor="#115ede" />
</shape>

你把它设置为某个视图的背景。例如:

<View
android:layout_width="200dp"
android:layout_height="100dp"
android:background="@drawable/my_gradient_drawable"/>

type = "线性"

linear类型设置angle。它一定是45度的倍数。

<gradient
android:type="linear"
android:angle="0"
android:startColor="#f6ee19"
android:endColor="#115ede" />

enter image description here

type = "径向"

radial类型设置gradientRadius。使用%p意味着它是父类最小维度的百分比。

<gradient
android:type="radial"
android:gradientRadius="10%p"
android:startColor="#f6ee19"
android:endColor="#115ede" />

enter image description here

type = "扫描"

我不知道为什么有人会使用扫描,但我包括它的完整性。我不知道如何改变角度,所以我只包括一张图像。

<gradient
android:type="sweep"
android:startColor="#f6ee19"
android:endColor="#115ede" />

enter image description here

中心

还可以更改扫描类型的中心或径向类型。这些值是宽度和高度的分数。你也可以使用%p符号。

android:centerX="0.2"
android:centerY="0.7"

enter image description here

在可绘制文件夹中使用此代码。

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<solid android:color="#3f5063" />
<corners
android:bottomLeftRadius="30dp"
android:bottomRightRadius="0dp"
android:topLeftRadius="30dp"
android:topRightRadius="0dp" />
<padding
android:bottom="2dp"
android:left="2dp"
android:right="2dp"
android:top="2dp" />
<gradient
android:angle="45"
android:centerColor="#015664"
android:endColor="#636969"
android:startColor="#2ea4e7" />
<stroke
android:width="1dp"
android:color="#000000" />
</shape>

简单的方法

<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle" >
<gradient
android:startColor="@color/choclate_light1"
android:centerColor="@color/choclate_light"
android:endColor="@color/choclate"
android:angle="90"/>
<!--If you need then use Corners-->
<!--<corners
android:radius="@dimen/_20sdp"/>-->
</shape>