如何在xml中重新创建此背景?

时间:2018-04-09 01:09:54

标签: android android-layout android-xml android-drawable layer-list

我一直试图在xml中重新创建背景图像(作为drawable)。由于背景是一个简单的形状,如果它被创建为xml drawable会更好。

[background image]是一个非常大的渐变圆,在左边,上边和右边偏离。

我尝试了什么

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape
           android:shape="rectangle">
            <size
               android:height="20dp" />
            <gradient
               android:type="linear"
               android:startColor="@color/gradientLeft"
               android:centerColor="@color/gradientMiddle"
               android:endColor="@color/gradientRight"
               android:angle="0" />
        </shape>
    </item>
    <item>
        <shape
           android:shape="oval">
            <padding
               android:top="20dp" />
            <gradient
               android:type="linear"
               android:startColor="@color/gradientLeft"
               android:centerColor="@color/gradientMiddle"
               android:endColor="@color/gradientRight"
               android:angle="0" />
        </shape>
    </item>
</layer-list>

我试图创建图层列表。该图层列表包含2个形状,矩形和椭圆形。

矩形的梯度和高度为20dp(测试)。

椭圆也具有相同的渐变,顶部填充为20dp。

但是,这并不会创建圆形,但会使用渐变填充整个形状。有人能帮助我吗?

2 个答案:

答案 0 :(得分:7)

试试这个

                        <div>
                            <md-button ng-click="getCheckedItems()">TEST</md-button>
                        </div>
                        <div kendo-tree-view="tree"
                             k-data-source="treeData"
                             k-on-change="selectedItem = dataItem">

                            <span k-template>
                                <md-checkbox !important ng-click='click(dataItem)'>{{ dataItem.text}}</md-checkbox>
                            </span>
                        </div>

<强>输出

enter image description here

答案 1 :(得分:1)

试试这个

    <layer-list xmlns:android="http://schemas.android.com/apk/res/android"> <item>
          <shape android:shape="rectangle" >
        <solid android:color="#ffffff"/>
    </shape>
 </item> <item
        android:bottom="400dp"
        android:left="-200dp"
        android:right="-200dp"
        android:top="-100dp">
        <shape android:shape="oval">
            <size android:height="20dp" />
            <gradient
                android:type="linear"
                android:startColor="#FD4F33"
                android:centerColor="#EE3A53"
                android:endColor="#DF2772"
                android:angle="0" />
        </shape> </item> </layer-list>

背景将是这样的

enter image description here