APK开发示例---网页上常见的Panel效果

　　今天琢磨了一下Activity布局中圆角、边框、背景等问题。制作了panel效果，这是网页设计中常用的效果，如下图所示：

方法如下：
一、Activity布局

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    android:paddingBottom="@dimen/activity_vertical_margin"
    tools:context="com.wallimn.iteye.ymq.AboutActivity">

    <LinearLayout
        android:orientation="vertical"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:background="@drawable/panel_wrap">

        <TextView
            android:layout_width="fill_parent"
            android:layout_height="50dp"
            android:text="关于本程序"
            android:id="@+id/textView2"
            android:layout_gravity="center_horizontal"
            android:gravity="center|center_vertical"
            android:textSize="20dp"
            android:background="@drawable/panel_title" />

        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="@string/about"
            android:id="@+id/textView"
            android:layout_gravity="center_horizontal"
            android:textSize="20dp" />

        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="确定"
            android:id="@+id/button5"
            android:layout_gravity="center_horizontal"
            android:onClick="exitActivity" />
    </LinearLayout>

</RelativeLayout>

二、panel的整体效果，文件名：panel_wrap.xml，位于drawable目录中。

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

    <corners android:radius="@dimen/panel_radius"/>
    <solid android:color="@color/panel_background"/>
    <stroke android:width="@dimen/panel_border_width" android:color="@color/panel_border"/>
</shape>

三、panel的标题栏效果，文件名：panel_title.xml，位于drawable目录中。

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

    <corners android:radius="@dimen/panel_radius"/>
    <solid android:color="@color/panel_title_background"/>
    <stroke android:width="@dimen/panel_border_width" android:color="@color/panel_border"/>
</shape>

四、colors.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <color name="panel_border">#3d98ff</color>
    <color name="panel_title_background">#cbffda</color>
    <color name="panel_background">#ffffff</color>
</resources>

五、dimens.xml

<resources>
    <!-- Default screen margins, per the Android Design guidelines. -->
    <dimen name="activity_horizontal_margin">16dp</dimen>
    <dimen name="activity_vertical_margin">16dp</dimen>
    <dimen name="panel_border_width">2dp</dimen>
    <dimen name="panel_radius">8dp</dimen>
</resources>