利用线性布局和相对布局实现一个简单的页面

设计思路：

    1）将准备好的八个图标复制到res/drawable文件夹下

    2）创建一个垂直的线性布局，并在线性布局中创建4个相对布局 

    3）在相对布局中添加相应的TextView

    4）在values文件下的style.xml文件中存放抽取出来的样式

    5）创建values-zh-rCN、values-en-rUS文件夹，并在文件夹中创建strings.xml文件

一、布局文件

程序界面对应布局文件activity_mian.xml如下所示：

     

    xmlns:tools="http://schemas.android.com/tools"

   android:layout_width="match_parent"

   android:layout_height="match_parent"

   android:background="@android:color/darker_gray"

    android:orientation="vertical"

    tools:context=".MainActivity">

   

       android:layout_marginTop="10dp">

       

            style="@style/tv_style"

           android:layout_alignParentLeft="true"

           android:layout_marginLeft="10dp"

           android:drawableTop="@drawable/clound"

            android:text="@string/_cloud"/>

       

            style="@style/tv_style"

           android:layout_alignParentRight="true"

           android:layout_marginRight="10dp"

           android:drawableTop="@drawable/bluetooth"

            android:text="@string/_bluetooth"/>

   

   

       android:layout_marginTop="10dp">

       

            style="@style/tv_style"

           android:layout_alignParentLeft="true"

           android:layout_marginLeft="10dp"

           android:drawableTop="@drawable/gesture"

           android:text="@string/_gesture" />

       

            style="@style/tv_style"

           android:layout_alignParentRight="true"

            android:layout_marginRight="10dp"

           android:drawableTop="@drawable/gps"

           android:text="@string/_gps" />

   

   

       android:layout_marginTop="10dp">

       

            style="@style/tv_style"

           android:layout_alignParentLeft="true"

           android:layout_marginLeft="10dp"

           android:drawableTop="@drawable/info"

           android:text="@string/_system_info" />

       

            style="@style/tv_style"

           android:layout_alignParentRight="true"

           android:layout_marginRight="10dp"

           android:drawableTop="@drawable/internet"

           android:text="@string/_internet" />

   

   

       android:layout_marginTop="10dp">

       

            style="@style/tv_style"

           android:layout_alignParentLeft="true"

           android:layout_marginLeft="10dp"

            android:drawableTop="@drawable/language"

           android:text="@string/_language" />

       

            style="@style/tv_style"

           android:layout_alignParentRight="true"

           android:layout_marginRight="10dp"

            android:drawableTop="@drawable/notifycation"

           android:text="@string/_set_notifycation" />

   

二、样式抽取

 由于编写布局文件时，相同控件之间的外边距和宽高都是固定的。因此会产生大量重复的布局代码，为了代码简洁和重复使用可以将相同代码抽取为样式单独放在一个style.xml文件中。

style.xml文件如下所示：

   

   

   

   

        match_parent

        wrap_content

   

    

   

  

三、创建values-zh-rCN、values-en-rUS文件夹

1.values-zh-rCN文件夹下的strings.xml文件如下所示：

    手机信息页面

    设置

    你好，世界!

    云通信

    蓝牙

    自定义手势

    定位

    系统信息

    网络

    语言设置

    通知栏设置

2.values-en-rUS文件夹下的strings.xml文件如下所示：

    phoneInfo

    Settings

    Hello world!

    Cloud

    Bluetooth

    Gesture

    Gps

    SystemInfo

    Internet

    Language

    Notifycation

四、测试结果

通过上面的简单几步我们就完成了对页面的布局以及样式的抽取。下面就是我们的运行结果

有中英文两种语言下的界面