Android渐变中的angle属性


73

我正在通过测试示例。对于某些使用渐变的图像背景,代码如下所示

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


  <shape xmlns:android="http://schemas.android.com/apk/res/android">
    <gradient
        android:startColor="#ff0000"
        android:centerColor="#00ff00"
        android:endColor="#0000ff"
        android:angle="180"/>
    <corners android:radius="5dp" />
   </shape>

在上面的xml中,我没有获取angle属性。但是当我angle稍微改变图案倾斜的值时。谁能解释一下它是如何工作的?

Answers:


165

梯度基本上表示任何数量的空间(在一个方向上)的变化。对于颜色,它表示颜色强度在角度表示的方向上的变化。这是一些表示此概念的图:
在此处输入图片说明

此处,该图显示了水平方向上的颜色变化(角度设置为0)。
XML代码:

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

在此处输入图片说明

此处,该图显示了垂直方向上的颜色变化(角度设置为90)。
XML代码:

<shape xmlns:android="http://schemas.android.com/apk/res/android">
<gradient
    android:startColor="#000000"
    android:angle="90"/>
 </shape>

您还可以使用其他颜色作为开始,中心和结束颜色。您所附的代码包含所有这些元素。


30
感谢卡尔的回答,但是我发现我只能给角度属性设置45的倍数,除了它会崩溃即
20、20、50

有很多表达梯度的方法。在这里,我们实际上是使用线性梯度(沿直线斜率m =(y-y1)/(x-x1)的斜率)。当它是45的倍数时,x和y的变化相同。可能是这个原因造成的。我不太了解
卡纳(

2
作为起始颜色为黑色(#000000)似乎是箭头相反的方向,不是吗?
lm2a 2015年

7
@karn真的很困惑您的回答。开始是从左到右逆时针方向。所以在图1中,我希望箭头像这样->->->->移动。也与with方式混淆android:startColor="#000000"。如果我们将起始角度设为90,是否表示从90-270角度开始,颜色将变为黑色?剩下的角度(0-90)呢?
Edijae Crusar 2015年

2
@gikarasojo kinene答案是正确的。除了从三角学的角度来看,描述角度的矢量从原点(坐标的起点)开始。沿逆时针方向测量角度。因此,当角度为90(pi / 2)时,ort向量看起来是向上字。因此,以上答案中的箭头指向错误。相反。第一张图片也是如此。
CodeToLife

13

指定形状的渐变颜色。属性:

android:angle整数。渐变角度,以度为单位。0从左到右,90从下到上。它必须是45的倍数。默认值为0。

似乎文档中的描述与卡恩的答案相矛盾?

您可以在文档中找到更多详细信息


3
您在must be a multiple of 45
Pierre

是的,是否可以不使用SWEEP_GRADIENT来绕过45度角规则?
德鲁先生

@ Mr.Drew您可以使用LinearGradient的前四个参数创建不同的角度,如链接中所述。之后使用linearGradient.setLocalMartix()缩放至所需大小。
朱利安·费斯

11

您可能想通过代码创建对角渐变。这要容易得多,您可以从那里打开很多选择。这个片段帮助了我

public void SetGradient(View view) {
        GradientDrawable gd = new GradientDrawable(
                GradientDrawable.Orientation.TL_BR,
                new int[]{0xFF141a24, 0xFF293f49, 0xFF72554c});
        view.setBackground(gd);
    }

GradientDrawable类的可用方向

/*public enum Orientation {
        *//** draw the gradient from the top to the bottom *//*
        TOP_BOTTOM,
        *//** draw the gradient from the top-right to the bottom-left *//*
        TR_BL,
        *//** draw the gradient from the right to the left *//*
        RIGHT_LEFT,
        *//** draw the gradient from the bottom-right to the top-left *//*
        BR_TL,
        *//** draw the gradient from the bottom to the top *//*
        BOTTOM_TOP,
        *//** draw the gradient from the bottom-left to the top-right *//*
        BL_TR,
        *//** draw the gradient from the left to the right *//*
        LEFT_RIGHT,
        *//** draw the gradient from the top-left to the bottom-right *//*
        TL_BR,
    }*/

然后从片段中的onCreate或onCreateView调用该方法并传递父视图(在我的情况下)。

 @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
                             Bundle savedInstanceState) {
        View view = inflater.inflate(R.layout.dialog_view_parent, container);           
        ...

        SetGradient(view);

        return view;
    }
By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.