Android线性布局渐变背景

我有麻烦应用梯度背景到线性布局。

从我所读到的来看,这应该是相对简单的,但它似乎并不奏效。作为参考,我正在2.1-update1上开发。

header_bg.xml:

<?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:startColor="#FFFF0000"
android:endColor="#FF00FF00"
android:type="linear"/>
</shape>

main_header.xml:

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

如果我改变@drawable/header_bg的颜色-例如,#FF0000,它工作得很好。我是不是遗漏了什么明显的东西?

306272 次浏览

尝试删除android: gradienttradius ="90"。这里有一个适合我的方法:

<shape
xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle"
>
<gradient
android:startColor="@color/purple"
android:endColor="@color/pink"
android:angle="270" />
</shape>

好的,我已经设法解决这个使用选择器。参见下面的代码:

main_header.xml:

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

main_header_selector.xml:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape>
<gradient
android:angle="90"
android:startColor="#FFFF0000"
android:endColor="#FF00FF00"
android:type="linear" />
</shape>
</item>
</selector>

希望这能帮助到有同样问题的人。

我会检查你渐变颜色的alpha通道。对我来说,当我在测试我的代码时,我把alpha通道设置错了颜色,它不适合我。一旦我把alpha频道设置好,它就全部工作了!

我的问题是. XML扩展名没有添加到新创建的XML文件的文件名中。添加.xml扩展名解决了我的问题。

也可以有第三种颜色(中间)。还有不同的形状。

例如在drawable/gradient.xml中:

<shape
xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<gradient
android:startColor="#000000"
android:centerColor="#5b5b5b"
android:endColor="#000000"
android:angle="0" />
</shape>

这给你黑色-灰色-黑色(从左到右),这是我最喜欢的黑色背景atm。

记住在你的布局xml中添加gradient.xml作为背景:

android:background="@drawable/gradient"

也可以旋转,使用:

角= " 0 "

得到一条垂直线

角= " 90 "

得到一条水平线

可能的角度为:

0 90 180 270。

还有几种不同的形状:

android:形状=“矩形”

圆形的形状:

android:形状=“椭圆”

可能还会更多。

希望有帮助,干杯!

我不知道这是否会帮助任何人,但我的问题是,我试图将渐变设置为ImageView的“src”属性,如下所示:

<ImageView
android:id="@+id/imgToast"
android:layout_width="wrap_content"
android:layout_height="60dp"
android:src="@drawable/toast_bg"
android:adjustViewBounds="true"
android:scaleType="fitXY"/>

不是100%确定为什么这没有工作,但现在我改变了它,把drawable放在ImageView的父属性的“background”属性中,在我的情况下是RelativeLayout,就像这样:(这成功地工作了)

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:id="@+id/custom_toast_layout_id"
android:layout_height="match_parent"
android:background="@drawable/toast_bg">

在XML可绘制文件:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape>
<gradient android:angle="90"
android:endColor="#9b0493"
android:startColor="#38068f"
android:type="linear" />
</shape>
</item>
</selector>

在你的布局文件:android:background="@drawable/gradient_background"

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


</LinearLayout>

enter image description here

您可以使用自定义视图来做到这一点。有了这个解决方案,它就完成了项目中所有颜色的渐变形状:

class GradientView(context: Context, attrs: AttributeSet) : View(context, attrs) {


// Properties
private val paint: Paint = Paint()
private val rect = Rect()


//region Attributes
var start: Int = Color.WHITE
var end: Int = Color.WHITE
//endregion


override fun onSizeChanged(w: Int, h: Int, oldw: Int, oldh: Int) {
super.onSizeChanged(w, h, oldw, oldh)
// Update Size
val usableWidth = width - (paddingLeft + paddingRight)
val usableHeight = height - (paddingTop + paddingBottom)
rect.right = usableWidth
rect.bottom = usableHeight
// Update Color
paint.shader = LinearGradient(0f, 0f, width.toFloat(), 0f,
start, end, Shader.TileMode.CLAMP)
// ReDraw
invalidate()
}


override fun onDraw(canvas: Canvas) {
super.onDraw(canvas)
canvas.drawRect(rect, paint)
}


}

我还用这个自定义视图创建了一个开源项目GradientView:

https://github.com/lopspower/GradientView

implementation 'com.mikhaellopez:gradientview:1.1.0'

使用Kotlin,只需两行就可以完成

更改数组中的颜色值

                  val gradientDrawable = GradientDrawable(
GradientDrawable.Orientation.TOP_BOTTOM,
intArrayOf(Color.parseColor("#008000"),
Color.parseColor("#ADFF2F"))
);
gradientDrawable.cornerRadius = 0f;


//Set Gradient
linearLayout.setBackground(gradientDrawable);

结果

enter image description here

<?xml version="1.0" encoding="utf-8"?>

<gradient
android:angle="90"
android:startColor="@color/colorPrimary"
android:endColor="@color/colorPrimary"
android:centerColor="@color/white"
android:type="linear"/>


<corners android:bottomRightRadius="10dp"
android:bottomLeftRadius="10dp"
android:topRightRadius="10dp"
android:topLeftRadius="10dp"/>

enter image description here