您的位置:首页 > 产品设计 > UI/UE

18 UI美化自定义形状shape

2016-09-14 22:48 423 查看
自定义某个控件的形状 如 圆角 巨型 环形 :

在工程文件的新建 res/drawable/shape文件(以下键一个圆角)

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle"
>
<!--     android:shape="rectangle" 设置为矩形-->

<!-- 设置渐变的颜色
android:startColor="#FFFF00"开始颜色
android:endColor="#00FFFF"结局颜色
android:angle="45"渐变角度
-->

<gradient
android:startColor="#FFFF00"
android:endColor="#00FFFF"
android:angle="45"

/>
<!-- 填充大小 -->
<padding
android:left="10dp"
android:top="10dp"
android:right="10dp"
android:bottom="10dp"
/>
<!-- 设置圆角矩形
android:radius="20dp"(四边都设置)-->
<corners
android:topLeftRadius="20dp"
android:topRightRadius="20dp"
android:bottomLeftRadius="20dp"
android:bottomRightRadius="20dp"

/>
</shape>


调用

<Button
android:id="@+id/button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button"
android:layout_marginTop="20dp"
android:background="@drawable/my_shape_rectangle_02"/>


在工程文件的新建 res/drawable/shape文件 其他属性

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle"
>
<!-- 设置填充的颜色 -->
<solid android:color="#87CEEB"/>

<!-- 设置内边距 -->
<padding
android:left="5dp"
android:top="5dp"
android:right="5dp"
android:bottom="5dp"
/>
<!-- 设置矩形边 -->
<!--  android:dashGap 虚线 间距   dashWidth 虚线的宽度-->
<stroke
android:width="3dp"
android:color="#000000"
android:dashGap="10dp"
android:dashWidth="5dp"
/>

</shape>


在工程文件的新建 res/drawable/shape文件(以下键一个环形)

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="ring"
android:innerRadius="5dp"
android:thickness="0dp"
android:useLevel="false"
>

<!--
android:shape="ring"  设置环形
android:innerRadius="5dp" 设置内部半径
android:thickness="0dp"   设置厚度
android:useLevel="false"  设置为flase 反正不设置就不成环形

-->

<!-- 设置边 -->

<stroke
android:width="60dp"
android:color="#ff0000"
/>

<!-- 填充颜色 貌似怪怪的 -->
<solid android:color="#00ff00"/>

<size
android:width="100dp"
android:height="100dp"
/>

</shape>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: