标题布局

这里写图片描述

1.布局对应的xml文件
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/common_title_bar"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@color/common_title_bkg_red_color"
    android:orientation="vertical" >

    <!-- 需要再用 -->

    <View
        android:id="@+id/titlebar_blank"
        android:layout_width="match_parent"
        android:layout_height="@dimen/activity_vertical_margin"
        android:visibility="gone" />

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:gravity="center_vertical"
        android:orientation="horizontal" >

        <!-- 左侧按钮 -->

        <ImageView
            android:id="@+id/titlebar_left"
            android:layout_width="@dimen/common_title_ico_width"
            android:layout_height="@dimen/common_title_ico_width"
            android:layout_alignParentLeft="true"
            android:layout_centerVertical="true"
            android:layout_marginLeft="4dp"
            android:contentDescription="@string/app_name"
            android:gravity="center"
            android:padding="14dp"
            android:src="@drawable/common_back_icon_selector" />

        <!-- 中间Title -->

        <TextView
            android:id="@+id/titlebar_title"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:layout_centerInParent="true"
            android:layout_marginLeft="4dp"
            android:ellipsize="end"
            android:gravity="left|center_vertical"
            android:maxLines="1"
            android:maxWidth="160dp"
            android:singleLine="true"
            android:text="@string/app_name"
            android:textAppearance="@style/TextAppearanceMainTitle" />

        <!-- 右边按钮 -->
        <!-- 需要再用 -->

        <LinearLayout
            android:id="@+id/titlebar_right_container"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentRight="true"
            android:layout_centerVertical="true"
            android:orientation="horizontal" >

            <!-- 右边第一个按钮 -->

            <FrameLayout
                android:layout_width="wrap_content"
                android:layout_height="wrap_content" >

                <TextView
                    android:id="@+id/titlebar_right_1"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:gravity="center"
                    android:paddingLeft="14dp"
                    android:paddingRight="14dp"
                    android:textSize="@dimen/global_special_text_size_sp_16"
                    android:visibility="gone" />

                <ImageView
                    android:id="@+id/titlebar_right_iv_1"
                    android:layout_width="@dimen/common_title_ico_width"
                    android:layout_height="@dimen/common_title_ico_width"
                    android:contentDescription="@string/app_name"
                    android:padding="14dp"
                    android:src="@drawable/ad_close"
                    android:visibility="gone" />
            </FrameLayout>

            <!-- 右边第二个按钮 -->

            <FrameLayout
                android:layout_width="wrap_content"
                android:layout_height="wrap_content" >

                <TextView
                    android:id="@+id/titlebar_right_2"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:gravity="center"
                    android:paddingLeft="14dp"
                    android:paddingRight="14dp"
                    android:textSize="@dimen/global_special_text_size_sp_16"
                    android:visibility="gone" />

                <ImageView
                    android:id="@+id/titlebar_right_iv_2"
                    android:layout_width="@dimen/common_title_ico_width"
                    android:layout_height="@dimen/common_title_ico_width"
                    android:contentDescription="@string/app_name"
                    android:padding="14dp"
                    android:src="@drawable/common_back_icon_selector"
                    android:visibility="gone" />
            </FrameLayout>
        </LinearLayout>

        <!-- title和tab之间的间隔线 -->

        <View
            android:layout_width="match_parent"
            android:layout_height="1px"
            android:layout_alignParentBottom="true"
            android:background="@color/common_title_separate_tab_line_color" />
    </RelativeLayout>

</LinearLayout>
2. 不要单独用上面这个xml,用include标签引进去。
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >

    <include layout="@layout/common_title_bar" />

    <TextView 
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/main_tab_convenient"
        android:textSize="18sp"
        />
</LinearLayout>
3.动态封装文字大小、文字颜色、控件宽度尺寸、控件整体样式等

这里写图片描述

  • colors.xml代码如下:(布局的颜色抽取到里面)
<?xml version="1.0" encoding="utf-8"?>
<resources>
    <color name="common_title_bkg_color">#FFFFFF</color>
    <color name="common_title_bkg_red_color">#f04b4b</color>
    <color name="common_title_bkg_red_more_color">#fa4b4b</color>
    <color name="common_title_separate_tab_line_color">#FFC9C9C9</colo
</resources>  
  • styles.xml代码如下:(布局文件中控件共同的样式抽取到里面)
 <!-- 页面主标题字体样式 -->
    <style name="TextAppearanceMainTitle">
        <item name="android:textColor">@color/global_text_color_white</item>
        <item name="android:textSize">@dimen/global_special_text_size_sp_18</item>
    </style>
  • dimens.xml代码如下:(布局文件的控件的宽和高抽取到里面)
<dimen name="global_special_text_size_sp_10">10sp</dimen>
    <dimen name="global_special_text_size_sp_14">14sp</dimen>
    <dimen name="global_special_text_size_sp_15">15sp</dimen>
    <dimen name="global_special_text_size_sp_16">16sp</dimen>
    <dimen name="global_special_text_size_sp_18">18sp</dimen>
    <dimen name="global_special_text_size_sp_20">20sp</dimen>
  • strings.xml代码如下:(布局文件的控件名称等抽取到里面)
<string name="app_name">标题名称</string>
    <string name="action_settings">Settings</string>
备注:以后写布局尽量抽取到values文件夹里面对应的文件里。
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值