Android之UI圆角矩形，图形圆角美化

最新推荐文章于 2021-05-29 08:00:51 发布

ly_rose

最新推荐文章于 2021-05-29 08:00:51 发布

阅读量804

点赞数

分类专栏： Android 文章标签： UI圆角矩形图形圆角美化

本文链接：https://blog.csdn.net/ly_rose/article/details/50389187

版权

Android 专栏收录该内容

61 篇文章 0 订阅

订阅专栏

创建工程Android_StyleAndUIShape下的res文件夹下->new other->Android XML File->Next->Resource Type下选择Drawable->选择shape->File命名为button_shape

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

    <gradient
        android:angle="45"
        android:endColor="#80FF00FF"
        android:gradientRadius="100.0"
        android:startColor="#FFFF0000"
        android:type="radial" >
    </gradient>

    <padding
        android:bottom="7dp"
        android:left="7dp"
        android:right="7dp"
        android:top="7dp" />

    <corners
        android:topLeftRadius="12dp"
        android:topRightRadius="12dp" >
    </corners>

</shape>

<Button
        android:id="@+id/button1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="192dp"
        android:background="@drawable/button_shape"
        android:textSize="90sp"
        android:text="Button" />

效果图如下

在drawable中新建两个文件view_shape.xml

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

    <gradient
        android:endColor="#CCCCCC"
        android:startColor="#CCCCCC" >
    </gradient>

    <corners
        android:topLeftRadius="12dp"
        android:topRightRadius="12dp" >
    </corners>

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

    <stroke
        
        android:dashWidth="3dp"
        android:width="3dp"
        android:color="#FFDDCC" >
    </stroke>
    <!--
     填充图形的颜色
    <solid android:color="#000000"/>


    -->

</shape>

和 view_bottom.xml

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

    <gradient
        android:endColor="#CCFFDD"
        android:startColor="#CCFFDD" />

    <corners
        android:bottomLeftRadius="12dp"
        android:bottomRightRadius="12dp" >
    </corners>

    
    <size
        android:height="100dp"
        android:width="200dp" />
    <!-- 
     填充图形的颜色
    <solid android:color="#000000"/>
    -->
</shape>

在activity_main.xml中

 <LinearLayout
        android:id="@+id/linearLayout1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_alignParentRight="true"
        android:layout_below="@+id/button1"
        android:layout_marginTop="36dp"
        android:background="@drawable/view_shape"
        android:orientation="vertical" >
    </LinearLayout>

    <LinearLayout
        android:id="@+id/linearLayout2"
        android:layout_width="200dp"
        android:layout_height="100dp"
        android:layout_alignLeft="@+id/linearLayout1"
        android:layout_alignRight="@+id/linearLayout1"
        android:layout_centerVertical="true"
        android:background="#CCCCCC"
        android:orientation="vertical" >
    </LinearLayout>

     <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignLeft="@+id/linearLayout2"
        android:layout_alignRight="@+id/linearLayout2"
        android:layout_below="@+id/linearLayout2"
        android:background="@drawable/view_bottom"
        android:orientation="vertical" >

    </LinearLayout>

效果图