《Android那些事》——仿百度糯米积分兑换界面

百度糯米：

高仿效果图：

颜色资源：

<color name="shop_exchange">#BE974C</color>
<color name="view_color">#d3d3d3</color>
<color name="black">#000000</color>
<color name="hint_color">#BAB8B5</color>
<color name="transparent">#00000000</color>

图标资源：

          

布局文件：

1.include_toolbar.xml

<?xml version="1.0" encoding="utf-8"?>

<android.support.design.widget.AppBarLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:theme="@style/AppTheme.AppBarOverlay">

        <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            android:background="@drawable/side_nav_bar"
            app:popupTheme="@style/AppTheme.PopupOverlay" />

    </android.support.design.widget.AppBarLayout>

2.activity_exchange.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <include
        android:id="@+id/include2"
        layout="@layout/include_toolbar" />

    <ScrollView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:fillViewport="true">


        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_marginTop="56dp"
            android:orientation="vertical">
            <!--商品图片包含商品名称-->
            <cn.bingoogolapple.bgabanner.BGABanner
                android:id="@+id/shop_images"
                android:layout_width="match_parent"
                android:layout_height="200dp"
                app:banner_pageChangeDuration="1000"
                app:banner_pointAutoPlayAble="false"
                app:banner_pointContainerBackground="@android:color/transparent"
                app:banner_pointDrawable="@drawable/bga_banner_selector_point_hollow"
                app:banner_pointTopBottomMargin="15dp"
                app:banner_tipTextSize="50px"
                app:banner_transitionEffect="alpha" />

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_margin="@dimen/ui_10_dip"
                android:orientation="vertical">
                <!--价格-->
                <LinearLayout
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_marginBottom="15dp"
                    android:layout_marginTop="15dp">

                    <ImageView
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_gravity="center"
                        android:layout_marginRight="@dimen/ui_5_dip"
                        android:src="@drawable/ic_shop_goldcoin16" />

                    <TextView
                        android:id="@+id/shop_value"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:drawablePadding="@dimen/ui_5_dip"
                        android:text="2000"
                        android:textColor="@color/shop_exchange"
                        android:textSize="70px" />

                    <TextView
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:text=" +¥"
                        android:textColor="@color/shop_exchange" />

                    <TextView
                        android:id="@+id/shop_money"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:text="130"
                        android:textColor="@color/shop_exchange"
                        android:textSize="50px" />
                </LinearLayout>

                <View
                    android:layout_width="match_parent"
                    android:layout_height="1dp"
                    android:background="@color/view_color" />

                <LinearLayout
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_marginBottom="20dp"
                    android:layout_marginTop="20dp"
                    android:orientation="vertical">
                    <!--商品简介-->
                    <TextView
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:layout_gravity="center"
                        android:layout_marginTop="@dimen/ui_10_dip"
                        android:drawableLeft="@drawable/ic_shop_intro24"
                        android:paddingBottom="@dimen/ui_10_dip"
                        android:text="  商品简介"
                        android:textColor="@color/black"
                        android:textSize="38px" />

                    <TextView
                        android:id="@+id/shop_intro"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:text="xxxxxxxxxxxxxxx\nxxxxxxxxxxxx\n"
                        android:textColor="@color/black" />
                </LinearLayout>

                <LinearLayout
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_marginBottom="20dp"
                    android:layout_marginTop="20dp"
                    android:orientation="vertical">
                    <!--兑换信息-->
                    <TextView
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:drawableLeft="@drawable/ic_shop_content24"
                        android:paddingBottom="@dimen/ui_10_dip"
                        android:text="  兑换信息"
                        android:textColor="@color/black"
                        android:textSize="38px" />

                    <TextView
                        android:id="@+id/shop_content"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:text="xxxxxxxxxxxxxxx\nxxxxxxxxxxxx\n"
                        android:textColor="@color/black" />
                </LinearLayout>

                <LinearLayout
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_marginBottom="20dp"
                    android:layout_marginTop="20dp"
                    android:orientation="vertical">

                    <TextView
                        android:id="@+id/shop_tip"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:text="温馨提示：\n\n校园e生活有权在法律允许的范围内对活动规则进行解释"
                        android:textColor="@color/hint_color" />
                </LinearLayout>

            </LinearLayout>
            
        </LinearLayout>

    </ScrollView>
    <!--兑换按钮-->
    <Button
        android:id="@+id/shop_exchange"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:background="@color/shop_exchange"
        android:text="兑换"
        android:textColor="@color/white"
        android:textSize="50px" />
</RelativeLayout>