使用线性布局和相对布局做一个国际化的手机信息页面

这是我们要做的界面,它分为英文界面和中文界面,接下来我们先来做Android Static默认的英文界面

首先创建一个project,再将所用的图片粘贴进Android列表下的app-res-drawable 

接下来在app-res-layout中新建一个linearlayout_demo


接下来我们来编写linearlayout_demo.xml,根据题目要求在这里我选择在线性布局中添加四个相对布局,再在每个RelativeLayout中添加两个TestView,这是一个RelativeLayout,我们来写一个其余的都一样

<?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="match_parent"
    android:background="@android:color/darker_gray"     //使整个背景颜色为灰色
    android:orientation="vertical">     //设置4个relativelayout为垂直排列
<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginTop="20dp">     //设置上边距
    <View     //这个View在这里就相当于一个标志物,它可以使两个TextView平分一个relativelayout
        android:id= "@+id/strut1"
        android:layout_width= "0dp"
        android:layout_height= "0dp"
        android:layout_centerHorizontal="true" />
    <TextView
        style="@style/tv_style"     //tv_style为设置的TextView的样式
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:drawableTop="@drawable/clound"     //将这个图片插入到顶部
        android:text="@string/_cloud"     //调用string中的设置
        android:layout_alignParentLeft="true"     //相对于父本的左侧
        android:layout_marginLeft="20dp"    //设置左边距
        android:layout_alignRight="@id/strut1"     //相对于标志物的右边
    android:layout_marginRight="10dp"     //设置右边距
    />
<TextView
    style="@style/tv_style"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:drawableTop="@drawable/bluetooth"
    android:text="@string/_bluetooth"
    android:layout_alignParentRight="true"
    android:layout_marginRight="20dp"
    android:layout_alignLeft="@id/strut1"
    android:layout_marginLeft="10dp"
    />
</RelativeLayout>

类似的设置其它的RelativeLayout

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="20dp">
        <View
            android:id= "@+id/strut2"
            android:layout_width= "0dp"
            android:layout_height= "0dp"
            android:layout_centerHorizontal="true" />
        <TextView
            style="@style/tv_style"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:drawableTop="@drawable/gesture"
            android:text="@string/_gesture"
            android:layout_alignParentLeft="true"
            android:layout_marginLeft="20dp"
            android:layout_alignRight="@id/strut2"
            android:layout_marginRight="10dp"
            />
        <TextView
            style="@style/tv_style"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:drawableTop="@drawable/gps"
            android:text="@string/_gps"
            android:layout_alignParentRight="true"
            android:layout_marginRight="20dp"
            android:layout_alignLeft="@id/strut2"
            android:layout_marginLeft="10dp"
            />
    </RelativeLayout>
    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="20dp">
        <View
            android:id= "@+id/strut3"
            android:layout_width= "0dp"
            android:layout_height= "0dp"
            android:layout_centerHorizontal="true" />
        <TextView
            style="@style/tv_style"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:drawableTop="@drawable/info"
            android:text="@string/_system_info"
            android:layout_alignParentLeft="true"
            android:layout_marginLeft="20dp"
            android:layout_alignRight="@id/strut3"
            android:layout_marginRight="10dp"
            />
        <TextView
            style="@style/tv_style"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:drawableTop="@drawable/internet"
            android:text="@string/_internet"
            android:layout_alignParentRight="true"
            android:layout_marginRight="20dp"
            android:layout_alignLeft="@id/strut3"
            android:layout_marginLeft="10dp"
            />
    </RelativeLayout>
    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="20dp">
        <View
            android:id= "@+id/strut4"
            android:layout_width= "0dp"
            android:layout_height= "0dp"
            android:layout_centerHorizontal="true" />
        <TextView
            style="@style/tv_style"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:drawableTop="@drawable/language"
            android:text="@string/_language"
            android:layout_alignParentLeft="true"
            android:layout_marginLeft="20dp"
            android:layout_alignRight="@id/strut4"
            android:layout_marginRight="10dp"
            />
        <TextView
            style="@style/tv_style"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:drawableTop="@drawable/notifycation"
            android:text="@string/_set_notifycation"
            android:layout_alignParentRight="true"
            android:layout_marginRight="20dp"
            android:layout_alignLeft="@id/strut4"
            android:layout_marginLeft="10dp"
            />
    </RelativeLayout>
</LinearLayout>
在res-values-styles.xml设置TestView的样式

<resources>
    <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">  //自带的不用管它
        <!-- Customize your theme here. -->
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>
    </style>
    <style name="tv_style">    //这个需要我们自己设置
        <item name="android:layout_width">150dp</item>
        <item name="android:layout_height">50dp</item>
        <item name="android:gravity">center</item>
        <item name="android:paddingTop">10dp</item>
        <item name="android:paddingBottom">10dp</item>
        <item name="android:background">@android:color/white</item>
    </style>
</resources>
我们来修改一下标题,在res-values-strings.xml中

<resources>
    <string name="app_name">phoneInfo</string>
</resources>

接下来我们来设置中英文模式,在android项目列表下,res下新建两个个文件夹values-zh-rCN,values-en-rUS,但这时我们并不能看到,我们需要转换到project项目列表中,然后在复制一下values中的strings.xml分别放到新建的两个文件夹下,这是我们就会看到这样的列表


在英文模式下的strings.xml

<resources>
    <string name="app_name">phoneInfo</string>
    <string name="menu_settings">Settings</string>
    <string name="hello_world">Hello world!</string>
    <string name="_cloud">Cloud</string>
    <string name="_bluetooth">Bluetooth</string>
    <string name="_gesture">Gesture</string>
    <string name="_gps">Gps</string>
    <string name="_system_info">SystemInfo</string>
    <string name="_internet">Internet</string>
    <string name="_language">Language</string>
    <string name="_set_notifycation">Notifycation</string>
</resources>
在中文模式下的strings.xml

<resources>
    <string name="app_name">手机信息页面</string>
    <string name="menu_settings">设置</string>
    <string name="hello_world">你好,世界!</string>
    <string name="_cloud">云通信</string>
    <string name="_bluetooth">蓝牙</string>
    <string name="_gesture">自定义手势</string>
    <string name="_gps">定位</string>
    <string name="_system_info">系统信息</string>
    <string name="_internet">网络</string>
    <string name="_language">语言设置</string>
    <string name="_set_notifycation">通知栏设置</string>
</resources>
下面我们再来修改project下的app-src-main-java下的MainActivity,R.layout.所要运行的布局的名称

setContentView(R.layout.linearlayout_demo);
我们来看这时的运行效果图


你会发现下面的空很大,这时你可以运用权重来分配一下,在每一个Relativelayout中添加

<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_weight="1"
    android:layout_marginTop="20dp">

这是运行图为





评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值