Как сделать градиентный фон в андроиде
Я хочу создать градиентный фон, где градиент находится в верхней половине, а в нижней - сплошной цвет, как на следующем рисунке:
![]()
Я не могу, потому что centerColor
распространяется на дно и верх.
![In the gradient for the button, a white horizontal line fades over blue toward the top and botton.]()
Как сделать фон похожим на первое изображение? Как я могу сделать маленький 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>
Ответы
Ответ 1
Вы можете создать этот "полуградиентный" вид, используя xml Layer-List, чтобы объединить верхний и нижний диапазоны в один файл. Каждая полоса представляет собой форму xml.
См. предыдущий ответ на SO для подробного руководства: Многоградиентные фигуры.
Ответ 2
Попробуйте следующее:
<?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>
Ответ 3
Визуальные примеры помогают в этом вопросе.
Boilerplate
Чтобы создать градиент, вы создаете xml файл в res/drawable. Я вызываю 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 = "линейные"
Установите angle
для типа linear
. Он должен быть кратным 45 градусов.
<gradient
android:type="linear"
android:angle="0"
android:startColor="#f6ee19"
android:endColor="#115ede" />
![введите описание изображения здесь]()
Type = "радиальные"
Установите gradientRadius
для типа radial
. Использование %p
означает, что это процент от наименьшего размера родителя.
<gradient
android:type="radial"
android:gradientRadius="10%p"
android:startColor="#f6ee19"
android:endColor="#115ede" />
![введите описание изображения здесь]()
тип = "зачистка"
Я не знаю, почему кто-то будет использовать развертку, но я включаю ее для полноты. Я не мог понять, как изменить угол, поэтому я включаю только одно изображение.
<gradient
android:type="sweep"
android:startColor="#f6ee19"
android:endColor="#115ede" />
![введите описание изображения здесь]()
Центр
Вы также можете изменить центр развертки или радиальных типов. Значения представляют собой доли ширины и высоты. Вы также можете использовать нотацию %p
.
android:centerX="0.2"
android:centerY="0.7"
![введите описание изображения здесь]()
Ответ 4
Следующая ссылка может помочь вам http://angrytools.com/gradient/. Это создаст пользовательский фон градиента в андроиде, как в Photoshop.
Ответ 5
Сначала вам нужно создать 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>
Ответ 6
Или вы можете использовать код, что бы вы ни думали в 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);
}
Ответ 7
//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
Ответ 8
Почему бы не создать изображение или изображение с 9 патчами и использовать его?
В приведенной ниже ссылке есть полезный справочник о том, как это сделать:
http://android.amberfog.com/?p=247
Если вы настаиваете на использовании Shape, попробуйте сайт ниже (выберите Android внизу слева):
http://angrytools.com/gradient/
Я создал подобный градиент (не точный) для того, который у вас есть по этой ссылке:
http://angrytools.com/gradient/?0_6586f0,54_4B6CD6,2_D6D6D6&0_100,100_100&l_269
Ответ 9
** используйте этот код в папке для рисования **
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<solid android:color="#3f5063"
/>
<corners android:bottomRightRadius="0dp" android:bottomLeftRadius="30dp" android:topLeftRadius="30dp" android:topRightRadius="0dp" />
<padding android:left="2dp" android:top="2dp" android:right="2dp" android:bottom="2dp" />
<gradient
android:startColor="#2ea4e7"
android:centerColor="#015664"
android:endColor="#636969"
android:angle="45"
>
</gradient>
<stroke android:color="#000000"
android:width="1dp">
</stroke>