现在的位置: 首页 > 综合 > 正文

android布局总结

2014年03月11日 ⁄ 综合 ⁄ 共 7707字 ⁄ 字号 评论关闭

Android 布局分析

先建项目然后写 string.xml文件

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

<resources>

 

  

    <string name="app_name">LayoutMyTestChen</string>

    <string name="name_text">请输入您的信息:</string>

    <string name="ok_text">插入</string>

    <string name="reset_text">重置</string>

       <string name="plumflower">*</string>

   

            <string name="name">姓名</string>

             <string name="gender">性别</string>

             <string name="age">年龄</string>

             <string name="phonenumber">电话</string>

   

        <string name="nameZs">张三</string>

        <string name="genderZs">男</string>

        <string name="ageZs">23</string>

        <string name="phonenumberZs">110</string>

       

         <string name="nameLs">李思</string>

        <string name="genderLs">女</string>

        <string name="ageLs">23</string>

        <string name="phonenumberLs">120</string>

</resources>

 

1.LinearLayout(线性布局)

“LinearLayout”翻译成中文是“线性布局”,所谓线性布局就是在该标签下的所有子

元素会根据其orientation属性的值来决定是按行或者是按列逐个显示。

 

linear_layout.xml代码如下:

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

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"

    android:layout_width="fill_parent"

    android:layout_height="fill_parent"

    android:orientation="vertical">

 

    <TextView

        android:layout_width="fill_parent"

        android:layout_height="wrap_content"

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

    <EditText

        android:layout_width="fill_parent"

        android:layout_height="wrap_content"

        />

   

    <RelativeLayout

        android:layout_width="fill_parent"

        android:layout_height="wrap_content"

        >

        <Button

         android:layout_width="wrap_content"

         android:layout_height="wrap_content"

         android:layout_alignParentRight="true"

         android:text="@string/reset_text"

         android:id="@+id/cancel_button"

        />

        <Button

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:text="@string/ok_text"

        android:layout_toLeftOf="@id/cancel_button"

        />

    </RelativeLayout>

</LinearLayout>

 

效果如图:

 

 

 

2. RelativeLayout(相对布局)

相对布局中的视图组件是按相互之间的相对位置来确定的,并不是线性布局中的必须

按行或按列单个显示。

 relative_layout.xml代码如下:

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

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"

    android:layout_width="match_parent"

    android:layout_height="match_parent"

     >

 

  

    <Button

        android:id="@+id/button1"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:text="@string/plumflower"

       />

   

     <Button

        android:id="@+id/button2"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:layout_toRightOf="@id/button1"

        android:layout_below="@id/button1"

        android:text="@string/plumflower"

        />

     <Button

        android:id="@+id/button3"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:layout_toRightOf="@id/button2"

        android:text="@string/plumflower"

        />

     <Button

        android:id="@+id/button4"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:layout_toLeftOf="@id/button2"

        android:layout_below="@id/button2"

        android:text="@string/plumflower"

        />

          <Button

        android:id="@+id/button5"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:layout_toRightOf="@id/button2"

        android:layout_below="@id/button2"

        android:text="@string/plumflower"

        />

   

 

</RelativeLayout>

效果如下:

 

3. TableLayout(表格布局)

表格布局的风格跟HTML中的表格比较接近,只是所采用的标签不同。

? <TableLayout> 是顶级元素,说明采用的是表格布局

? <TableRow>定义一个行

? <TextView>定义一个单元格的内容

 

table_layout.xml代码如下:

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

<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"

    android:layout_width="match_parent"

    android:layout_height="match_parent"

    android:stretchColumns="0,1,2,3">

 

    <TableRow >

 

        <TextView

            android:gravity="center"

            android:padding="3dip"

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

 

        <TextView

            android:gravity="center"

            android:padding="3dip"

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

 

        <TextView

            android:gravity="center"

            android:padding="3dip"

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

 

        <TextView

            android:gravity="center"

            android:padding="3dip"

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

    </TableRow>

 

    <TableRow >

 

        <TextView

            android:gravity="center"

            android:padding="3dip"

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

 

        <TextView

            android:gravity="center"

            android:padding="3dip"

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

 

        <TextView

            android:gravity="center"

            android:padding="3dip"

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

 

        <TextView

            android:gravity="center"

            android:padding="3dip"

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

    </TableRow>

 

    <TableRow >

 

        <TextView

            android:gravity="center"

            android:padding="3dip"

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

 

        <TextView

            android:gravity="center"

            android:padding="3dip"

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

 

        <TextView

            android:gravity="center"

            android:padding="3dip"

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

 

        <TextView

            android:gravity="center"

            android:padding="3dip"

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

    </TableRow>

 

  

 

</TableLayout>

 

效果如下:

4.FrameLayout(帧布局)

帧布局中的每一个组件都代表一个画面,默认以屏幕左上角作为(0,0)坐标,按组件

定义的先后顺序依次逐屏显示,后面出现的会覆盖前面的画面。用该布局可以实现动画效果。

 

 

FrameLayoutTestChenActivity代码如下:

 package cn.class3g.activity;

 

importandroid.app.Activity;

importandroid.graphics.drawable.Drawable;

import android.os.Bundle;

importandroid.os.Handler;

importandroid.os.Message;

importandroid.view.View;

importandroid.view.View.OnClickListener;

importandroid.widget.FrameLayout;

 

 

public classFrameLayoutTestChenActivity extends Activity {

 

    FrameLayout frame = null;

    private boolean flag = true;

 

    public void onCreate(BundlesavedInstanceState) {

        super.onCreate(savedInstanceState);

        this.setContentView(R.layout.main);

 

        findViews();

 

        final MyHandler myHandler = newMyHandler();

       

        myHandler.sleep(10);

 

        frame.setOnClickListener(newOnClickListener() {

 

            public void onClick(View v) {

                flag = !flag;

                myHandler.sleep(10);

            }

 

        });

 

    }

 

    private void findViews() {

        frame = (FrameLayout)this.findViewById(R.id.frame);

    }

 

    class MyHandler extends Handler {

 

        int i = 0;

 

        public void handleMessage(Message msg) {

            i++;

            show(i % 8);

            sleep(50);

 

        }

 

        public void sleep(long delayMillis) {

            if (flag) {

                this.sendMessageDelayed(this.obtainMessage(10),delayMillis);

            }

        }

 

    }

 

    void show(int id) {

        Drawable[] pic = new Drawable[10];

        pic[0] =this.getResources().getDrawable(R.drawable.p1);

        pic[1] =this.getResources().getDrawable(R.drawable.p2);

        pic[2] =this.getResources().getDrawable(R.drawable.p3);

        pic[3] = this.getResources().getDrawable(R.drawable.p4);

        pic[4] =this.getResources().getDrawable(R.drawable.p5);

        pic[5] =this.getResources().getDrawable(R.drawable.p6);

        pic[6] =this.getResources().getDrawable(R.drawable.p7);

        pic[7] =this.getResources().getDrawable(R.drawable.p8);

 

        frame.setForeground(pic[id]);

    }

 

}

 

main.xml代码如下:

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

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"

    android:layout_width="match_parent"

    android:layout_height="match_parent"

    android:layout_gravity="center"

    android:id="@+id/frame"

</FrameLayout>

 

效果图如下:

 

动作为:

抱歉!评论已关闭.