Android——layout中使用include复用模块

来源：互联网发布：version for mac 破解编辑：程序博客网时间：2024/06/12 00:25

早在ITOO中我们觉得页面代码太多而各种抽页面，像公共的按钮、搜索框、表格等，在主页面中只需要写几句代码就可以了，其实语言都是一样的，在安卓的世界中也是可以抽出部分视图的，只不过在安卓的开发环境中，是通过xml中复用代码来实现的而已——include标签。

在最近做的一个互联网项目中，因为我的任务是要做有四个页面的左右滑屏效果，上面的标题和tab条都是一样的，不同的只是左右滑屏时下面的显示内容，所以就抽出两个界面文件，对主界面进行分割。

include标签：

<include layout="@layout/otherlayout"></div>

首先我们先来看分割出来的页面：

teacher_top:

<?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="50dp"    android:orientation="vertical" >        <LinearLayout style="@style/top_title_style" >        <!-- 尖括号的布局 -->        <LinearLayout            android:id="@+id/picture_view_back"            android:layout_width="70dp"            android:layout_height="fill_parent"            android:gravity="center_vertical|center"            android:orientation="vertical" >            <ImageButton                android:layout_width="14dp"                android:layout_height="18dp"                android:layout_gravity="center_vertical"                android:layout_marginLeft="0dp"                android:background="@drawable/back" />        </LinearLayout>        <!-- 讲师列表布局 -->        <TextView            style="@style/top_title_word_style"            android:text="导师详情" />        <LinearLayout            android:layout_width="70dp"            android:layout_height="28dp"            android:gravity="center_vertical|center"            android:orientation="vertical" >        </LinearLayout></LinearLayout></LinearLayout>

效果图：

滑屏tab标题栏

<?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="50dp"    android:background="@drawable/bottom_bar"    android:orientation="horizontal" >        <!-- 个人介绍 -->    <LinearLayout        android:id="@+id/id_tab_personinfo"        android:layout_width="0dp"        android:layout_height="fill_parent"        android:layout_weight="1"        android:gravity="center"        android:orientation="horizontal" >        <ImageButton            android:id="@+id/id_tab_personinfo_img"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:background="#00000000"            android:clickable="false"            android:src="@drawable/back" />        <TextView            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:text="个人介绍"            android:textColor="#ffffff" />    </LinearLayout>        <!-- 课程 -->    <LinearLayout        android:id="@+id/id_tab_course"        android:layout_width="0dp"        android:layout_height="fill_parent"        android:layout_weight="1"        android:gravity="center"        android:orientation="horizontal" >        <ImageButton            android:id="@+id/id_tab_course_img"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:background="#00000000"            android:clickable="false"            android:src="@drawable/back"  />        <TextView            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:text="课程"            android:textColor="#ffffff" />    </LinearLayout>        <!-- 工作经历  -->    <LinearLayout        android:id="@+id/id_tab_workexperience"        android:layout_width="0dp"        android:layout_height="fill_parent"        android:layout_weight="1"        android:gravity="center"        android:orientation="horizontal" >        <ImageButton            android:id="@+id/id_tab_workexperience_img"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:background="#00000000"            android:clickable="false"            android:src="@drawable/back" />        <TextView            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:text="工作经历"            android:textColor="#ffffff" />    </LinearLayout>        <!-- 评价 -->    <LinearLayout        android:id="@+id/id_tab_evaluate"        android:layout_width="0dp"        android:layout_height="fill_parent"        android:layout_weight="1"        android:gravity="center"        android:orientation="horizontal" >        <ImageButton            android:id="@+id/id_tab_evaluate_img"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:background="#00000000"            android:clickable="false"            android:src="@drawable/back" />        <TextView            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:text="评价"            android:textColor="#ffffff" />    </LinearLayout></LinearLayout>

效果图：

用include标签拼接好的主界面：

teacher_main

<?xml version="1.0" encoding="utf-8"?>   <LinearLayout 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:orientation="vertical" >    <include layout="@layout/teacher_top" />    <include layout="@layout/toptab_bar" />        <android.support.v4.view.ViewPager        android:id="@+id/id_viewpager"        android:layout_width="fill_parent"        android:layout_height="0dp"        android:layout_weight="1" >    </android.support.v4.view.ViewPager></LinearLayout>

效果图：

如果客户想要标题栏换个颜色或者改变一下字体，这样抽象的只需要改一处的代码而不是四个页面的代码都需要改。非常简单的一个标签，就达到了代码的复用性可读性和可维护性。所以在编程的世界里，尽情的抽象吧！

1 0