【Android UI】案例02 圆角边框、圆角背景的实现(shape)

来源：互联网发布：上班不化妆知乎编辑：程序博客网时间：2024/05/01 03:55

本文主要分享圆角边框与圆角背景的实现方式。该方式的实现，需要了解shape的使用，该部分的详细介绍，请阅读博客http://blog.csdn.net/mahoking/article/details/23672271。文中有较详细的介绍。

【转载使用，请注明出处：http://blog.csdn.net/mahoking】
如下是演示的shape_layout.xml模板。

<?xml version="1.0" encoding="utf-8"?><shape xmlns:android="http://schemas.android.com/apk/res/android" >    <!-- 填充色 -->    <solid android:color="#CCFF99"/><!-- 圆角 --><corners android:radius="10dp"/></shape>

为了显示的好看与协调，本案创建了多个shape_*.xml文件，各个shape_*.xml文件只是solid填充色的配置不同，读者可以根据自己的设计与喜好自行搭配。在本文的而最后，会展示相应Demo截图。

<?xml version="1.0" encoding="utf-8"?><shape xmlns:android="http://schemas.android.com/apk/res/android" >    <!-- 填充色 -->    <solid android:color="#FF9999"/><!-- 圆角 --><!-- android:radius 设置角的弧度，值越大角越圆--><corners android:radius="10dp"/></shape>

创建Activity(RoundCornerActivity)，对应的布局文件为activity_01_round_corner.xml。
RoundCornerActivity

/** *@describe  圆角边框、圆角背景的实现演示 *@date 2014-8-24 22:35:49 */public class RoundCornerActivity extends Activity{@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_01_round_corner);}}

activity_01_round_corner.xml

<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:orientation="vertical" >    <TextView        android:layout_width="match_parent"        android:layout_height="20dp"        android:layout_marginLeft="15dp"        android:layout_marginRight="15dp"        android:layout_marginTop="5dp"        android:background="@drawable/shape_01_round_corner_textview"        android:gravity="center"        android:text="圆角背景与边框演示" />    <LinearLayout        android:layout_width="match_parent"        android:layout_height="60dp"        android:layout_marginLeft="15dp"        android:layout_marginRight="15dp"        android:layout_marginTop="10dp"        android:background="@drawable/shape_01_round_corner_layout" >    </LinearLayout>    <TextView        android:layout_width="match_parent"        android:layout_height="20dp"        android:layout_marginLeft="15dp"        android:layout_marginRight="15dp"        android:layout_marginTop="5dp"        android:background="@drawable/shape_01_round_corner_textview"        android:gravity="center"        android:text="以下是特效演示" />    <LinearLayout        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:layout_marginTop="10dp"        android:orientation="horizontal" >        <LinearLayout            android:layout_width="match_parent"            android:layout_height="wrap_content"            android:layout_marginLeft="5dp"            android:layout_marginRight="5dp"            android:layout_weight="1"            android:orientation="vertical" >            <TextView                android:layout_width="match_parent"                android:layout_height="120dp"                android:background="@drawable/shape_01_round_corner_textview_ma"                android:gravity="center"                android:text="马"                android:textSize="60dp" />        </LinearLayout>        <LinearLayout            android:layout_width="match_parent"            android:layout_height="wrap_content"            android:layout_marginLeft="5dp"            android:layout_marginRight="5dp"            android:layout_weight="1"            android:orientation="vertical" >            <TextView                android:layout_width="match_parent"                android:layout_height="55dp"                android:background="@drawable/shape_01_round_corner_textview_yi"                android:gravity="center"                android:text="意"                android:textSize="30dp" />            <TextView                android:layout_width="match_parent"                android:layout_height="55dp"                android:layout_marginTop="10dp"                android:background="@drawable/shape_01_round_corner_textview_ran"                android:gravity="center"                android:text="然"                android:textSize="30dp" />        </LinearLayout>    </LinearLayout></LinearLayout>

切忌不要忘记在AndroidManifest.xml中注册该Activity。

<application        android:allowBackup="true"        android:icon="@drawable/uisharing_ico"        android:label="@string/app_name"        android:theme="@style/AppTheme" >        <activity            android:name="com.mahaochen.app.uisharing.example01.RoundCornerActivity"            android:screenOrientation="portrait"             android:label="@string/app_name">            <intent-filter>                <action android:name="android.intent.action.MAIN" />                <category android:name="android.intent.category.LAUNCHER" />            </intent-filter>        </activity>    </application>

运行该项目，效果如下：

2 1