how can I create rectangle shape by using two different colors with shadow? like above image.
如何使用两种不同颜色的阴影创建矩形形状?如上图。
5 个解决方案
#1
3
Please create a drawable file and put the below code in it.
<?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" />
<solid android:color="#F66D08" />
</shape>
</item>
<item android:top="50dp">
<shape android:shape="rectangle" >
<gradient android:endColor="#AD1B1D"
android:startColor="#E2360A"
android:angle="270" />
</shape>
</item>
</layer-list>
#2
5
layer-list can be used to solve this
层列表可以用来解决这个问题
<?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:width="40dp"
android:height="40dp" />
<solid android:color="#F86F05" />
</shape>
</item>
<item android:top="10dp">
<shape android:shape="rectangle">
<size
android:width="30dp"
android:height="30dp" />
<solid android:color="#B31F19" />
</shape>
</item>
</layer-list>
And the screenshot of the same.
同样的屏幕截图。
If you want gradient instead of solid color, change solid to gradient and set startColor, endColor and angle.
如果你想要的是渐变而不是纯色,那就改变固体到渐变,设置startColor, endColor和angle。
#3
1
Place these code in your activity_main :
将这些代码放到activity_main中:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:gravity="center"
android:background="#F66D08"
android:layout_width="match_parent"
android:layout_height="20dp">
</LinearLayout>
<LinearLayout
android:background="@drawable/introslidergradiant"
android:layout_width="match_parent"
android:layout_height="100dp"></LinearLayout>
</LinearLayout>
And create drawble res file with introslidergradiant.xml name :
并使用introslidergradiant创建drawble res文件。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="#A31720"
android:endColor="#E1350B"
android:type="linear" />
</shape>
</item>
</selector>
#4
0
<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/listview_background_shape">
<stroke android:width="2dp" android:color="#ff207d94" />
<padding android:left="2dp"
android:top="2dp"
android:right="2dp"
android:bottom="2dp" />
<corners android:radius="5dp" />
<solid android:color="#ffffffff" />
</shape>
You can create a new XML file inside the drawable folder, and add the above code, then save it as rectangle.xml.
您可以在drawable文件夹中创建一个新的XML文件,并添加上面的代码,然后将其保存为rectangley . XML。
To use it inside a layout you would set the android:background attribute to the new drawable shape. The shape we have defined does not have any dimensions, and therefore will take the dimensions of the View that is defined in the layout.
要在布局中使用它,可以将android:background属性设置为新的可绘制形状。我们定义的形状没有任何维度,因此将采用布局中定义的视图的维度。
So putting it all together:
所以把它们放在一起
<View
android:id="@+id/myRectangleView"
android:layout_width="200dp"
android:layout_height="50dp"
android:background="@drawable/rectangle"/>
Finally; you can set this rectangle to be the background of any View, although for ImageViews you would use android:src. This means you could use the rectangle as the background for ListViews, TextViews...etc.
最后;您可以将这个矩形设置为任何视图的背景,不过对于ImageViews,您可以使用android:src。这意味着您可以使用矩形作为listview、textview等的背景。
#5
0
You have to make a xml file in the drawable
您必须在drawable中创建一个xml文件
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle" >
<gradient
android:type="linear"
android:startColor="#FFFF820D"
android:endColor="#FFA32815"
android:angle="90"/>
</shape>
use the following code or you can generate your own gradient here just set the color and select the android option and it will generate the gradient for you .
使用下面的代码,或者你可以在这里生成自己的渐变,设置颜色,选择android选项,它会为你生成渐变。
#1
3
Please create a drawable file and put the below code in it.
<?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" />
<solid android:color="#F66D08" />
</shape>
</item>
<item android:top="50dp">
<shape android:shape="rectangle" >
<gradient android:endColor="#AD1B1D"
android:startColor="#E2360A"
android:angle="270" />
</shape>
</item>
</layer-list>
#2
5
layer-list can be used to solve this
层列表可以用来解决这个问题
<?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:width="40dp"
android:height="40dp" />
<solid android:color="#F86F05" />
</shape>
</item>
<item android:top="10dp">
<shape android:shape="rectangle">
<size
android:width="30dp"
android:height="30dp" />
<solid android:color="#B31F19" />
</shape>
</item>
</layer-list>
And the screenshot of the same.
同样的屏幕截图。
If you want gradient instead of solid color, change solid to gradient and set startColor, endColor and angle.
如果你想要的是渐变而不是纯色,那就改变固体到渐变,设置startColor, endColor和angle。
#3
1
Place these code in your activity_main :
将这些代码放到activity_main中:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:gravity="center"
android:background="#F66D08"
android:layout_width="match_parent"
android:layout_height="20dp">
</LinearLayout>
<LinearLayout
android:background="@drawable/introslidergradiant"
android:layout_width="match_parent"
android:layout_height="100dp"></LinearLayout>
</LinearLayout>
And create drawble res file with introslidergradiant.xml name :
并使用introslidergradiant创建drawble res文件。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="#A31720"
android:endColor="#E1350B"
android:type="linear" />
</shape>
</item>
</selector>
#4
0
<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/listview_background_shape">
<stroke android:width="2dp" android:color="#ff207d94" />
<padding android:left="2dp"
android:top="2dp"
android:right="2dp"
android:bottom="2dp" />
<corners android:radius="5dp" />
<solid android:color="#ffffffff" />
</shape>
You can create a new XML file inside the drawable folder, and add the above code, then save it as rectangle.xml.
您可以在drawable文件夹中创建一个新的XML文件,并添加上面的代码,然后将其保存为rectangley . XML。
To use it inside a layout you would set the android:background attribute to the new drawable shape. The shape we have defined does not have any dimensions, and therefore will take the dimensions of the View that is defined in the layout.
要在布局中使用它,可以将android:background属性设置为新的可绘制形状。我们定义的形状没有任何维度,因此将采用布局中定义的视图的维度。
So putting it all together:
所以把它们放在一起
<View
android:id="@+id/myRectangleView"
android:layout_width="200dp"
android:layout_height="50dp"
android:background="@drawable/rectangle"/>
Finally; you can set this rectangle to be the background of any View, although for ImageViews you would use android:src. This means you could use the rectangle as the background for ListViews, TextViews...etc.
最后;您可以将这个矩形设置为任何视图的背景,不过对于ImageViews,您可以使用android:src。这意味着您可以使用矩形作为listview、textview等的背景。
#5
0
You have to make a xml file in the drawable
您必须在drawable中创建一个xml文件
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle" >
<gradient
android:type="linear"
android:startColor="#FFFF820D"
android:endColor="#FFA32815"
android:angle="90"/>
</shape>
use the following code or you can generate your own gradient here just set the color and select the android option and it will generate the gradient for you .
使用下面的代码,或者你可以在这里生成自己的渐变,设置颜色,选择android选项,它会为你生成渐变。