zoukankan      html  css  js  c++  java
  • 安卓的主要几大布局

    今天我们的主要内容就是安卓的主要几个基础的布局方式。(主要布局如下:)

    1.线性布局(LinerLayout)

    2.相对布局(RelativeLayout)

    3.表格布局(TableLayout)

    4.网格布局(GridLayout)

    5.绝对布局(AbsoluteLayout)

    6.帧布局(FrameLayout)

    一:线性布局(LinerLayout)。

    1.xml文件配置:

    <?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:orientation="vertical"
        android:padding="5dp" >
    
        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="#0000FF"
            android:gravity="center_horizontal|center_vertical"
            android:text="线性布局"
            android:textSize="20sp"/>
    
    <LinearLayout
        android:layout_width="200dp"
        android:layout_height="150dp"
        android:layout_gravity="center_horizontal|center_vertical"
        android:background="#0000FF"
        android:orientation="horizontal" >
    
        <TextView
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="2"
            android:background="#00FF00"
            android:text="内容一" />
    
        <TextView
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:background="#F7F709"
            android:text="内容二" />
    
    </LinearLayout>
    <LinearLayout
        android:layout_width="200dp"
        android:layout_height="150dp"
        android:layout_gravity="right"
        android:background="#0000FF"
        android:orientation="horizontal" >
    
        <TextView
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:background="#00FF00"
            android:text="内容一" />
    
        <TextView
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="2"
            android:background="#F7F709"
            android:text="内容二" />
    </LinearLayout>
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal" >
     <Button
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="按一" 
            android:onClick="click"
            />
      <Button
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="按二" 
            android:onClick="click"/>
       <Button
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="按三" 
            android:onClick="click"/>
        <Button
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="按四" 
            android:onClick="click"/>
    
    </LinearLayout>
    </LinearLayout>

    展示:

    2.xml文件配置:

    <?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:orientation="vertical" >
    
        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="20dp"
            android:gravity="center_horizontal|center_vertical"
            android:text="线性布局登录页面"
            android:textSize="20sp" />
    
        <LinearLayout
            android:layout_width="200dp"
            android:layout_height="40dp"
            android:layout_gravity="center_horizontal|center_vertical"
            android:layout_marginTop="20dp"
            android:orientation="horizontal" >
    
            <TextView
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:text="账号:"
                android:textSize="15sp" />
    
            <EditText
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="4" />
        </LinearLayout>
    
        <LinearLayout
            android:layout_width="200dp"
            android:layout_height="40dp"
            android:layout_gravity="center_horizontal|center_vertical"
            android:orientation="horizontal" >
    
            <TextView
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:text="密码:"
                android:textSize="15sp" />
    
            <EditText
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="4" />
        </LinearLayout>
    
        <LinearLayout
            android:layout_width="200dp"
            android:layout_height="30dp"
            android:layout_gravity="center_horizontal|center_vertical"
            android:layout_marginTop="15dp"
            android:orientation="horizontal" >
    
            <CheckBox
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:text="记住账号" />
    
            <CheckBox
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:text="记住密码" />
        </LinearLayout>
    
        <LinearLayout
            android:layout_width="200dp"
            android:layout_height="30dp"
            android:layout_gravity="center_horizontal|center_vertical"
            android:layout_marginTop="15dp"
            android:orientation="horizontal" >
    
            <Button
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:onClick="click"
                android:text="登录"
                android:textSize="10sp" />
    
            <TextView
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:textSize="15sp" />
    
            <Button
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:onClick="click"
                android:text="注册"
                android:textSize="10sp" />
        </LinearLayout>
    
    </LinearLayout>

    展示:

    二:相对布局(RelativeLayout)

    1.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">
    
        <TextView
            android:id="@+id/textView"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="20dp"
            android:gravity="center"
            android:text="相对布局登录页面"
            android:textSize="20sp" />
    
        <TextView
            android:id="@+id/textView1"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_below="@id/textView"
            android:layout_marginLeft="80px"
            android:layout_marginTop="30dp"
            android:text="账号:"
            android:textSize="15sp" />
    
        <EditText
            android:id="@+id/firstEditText"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_alignBottom="@id/textView1"
            android:layout_marginLeft="130px"
            android:layout_marginRight="50px" />
    
        <TextView
            android:id="@+id/textView2"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_below="@id/firstEditText"
            android:layout_marginLeft="80px"
            android:layout_marginTop="20dp"
            android:text="密码:"
            android:textSize="15sp" />
    
        <EditText
            android:id="@+id/firstEditText2"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_alignBottom="@id/textView2"
            android:layout_marginLeft="130px"
            android:layout_marginRight="50px" />
    
        <CheckBox
            android:id="@+id/checkbox1"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_below="@id/firstEditText2"
            android:layout_marginLeft="100px"
            android:layout_marginTop="20dp"
            android:text="记住账号" />
    
        <CheckBox
            android:id="@+id/checkbox2"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_alignBottom="@id/checkbox1"
            android:layout_marginLeft="280px"
            android:layout_marginRight="50px"
            android:text="记住密码" />
    
        <Button
            android:id="@+id/cancelButton1"
            android:layout_width="match_parent"
            android:layout_height="40dp"
            android:layout_below="@id/checkbox2"
            android:layout_marginLeft="100px"
            android:layout_marginRight="290px"
            android:layout_marginTop="25dp"
            android:text="登录"
            android:textSize="14sp" />
    
        <Button
            android:id="@+id/confremButton2"
            android:layout_width="match_parent"
            android:layout_height="40dp"
            android:layout_alignBottom="@id/cancelButton1"
            android:layout_marginLeft="290px"
            android:layout_marginRight="100px"
            android:text="注册"
            android:textSize="14sp" />
    
    </RelativeLayout>

    展示:

    三:表格布局(TableLayout)

    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:padding="5dp"
        android:stretchColumns="2" >
    
        <TableRow>
    
            <TextView
                android:layout_width="50dp"
                android:layout_height="wrap_content"
                android:gravity="center"
                android:text="序号"
                android:textSize="20sp" />
    
            <TextView
                android:layout_width="60dp"
                android:layout_height="wrap_content"
                android:gravity="center"
                android:text="书名"
                android:textSize="20sp" />
    
            <TextView
                android:gravity="center"
                android:text="内容"
                android:textSize="20sp" />
    
            <TextView
                android:layout_width="60dp"
                android:layout_height="wrap_content"
                android:gravity="center"
                android:text="作者"
                android:textSize="20sp" />
        </TableRow>
    
        <View
            android:layout_height="1.5dp"
            android:background="#00FF00" />
    
        <TableRow>
    
            <TextView
                android:gravity="center"
                android:text="1" />
    
            <TextView
                android:gravity="center"
                android:text="西游记" />
    
            <TextView
                android:gravity="center"
                android:text="取经" />
    
            <TextView
                android:gravity="center"
                android:text="郑晨" />
        </TableRow>
    
        <View
            android:layout_height="1.5dp"
            android:background="#00FF00" />
    
        <TableRow>
    
            <TextView
                android:gravity="center"
                android:text="2" />
    
            <TextView
                android:layout_column="2"
                android:gravity="center"
                android:text="孙悟空大闹天空" />
        </TableRow>
    
        <View
            android:layout_height="1.5dp"
            android:background="#00FF00" />
    
        <TableRow>
    
            <TextView
                android:gravity="center"
                android:text="3" />
    
            <TextView
                android:layout_column="1"
                android:gravity="center"
                android:text="盘龙" />
    
            <TextView
                android:layout_column="3"
                android:gravity="center"
                android:text="郑晨" />
        </TableRow>
    
        <View
            android:layout_height="1.5dp"
            android:background="#00FF00" />
    
    </TableLayout>

    展示:

    四:网格布局(GridLayout)

    1.xml文件如下:

    <?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:orientation="vertical"
        android:padding="5dp" >
    <!-- 网格布局 -->
        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="30dp"
            android:gravity="center"
            android:text="计算机"
            android:textSize="30sp" />
    
        <GridLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:layout_marginTop="20dp"
            android:columnCount="4"
            android:rowCount="6" >
    
            <EditText
                 android:id="@+id/textView6"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_columnSpan="4"
                android:layout_gravity="fill_horizontal"
                android:editable="false"
                android:focusable="false"
                android:gravity="right"
                android:text="0"
                android:textSize="20sp" />
    
            <Button android:text="AC" 
                android:onClick="acClick"/>
    
            <Button android:text="+/-" />
    
            <Button android:text="%" />
    
            <Button android:text="+" />
    
            <Button android:text="7" />
    
            <Button android:text="8" />
    
            <Button android:text="9" />
    
            <Button android:text="x" 
                android:onClick="anClick" />
    
            <Button android:text="4" />
    
            <Button android:text="5" />
    
            <Button android:text="6" 
                android:onClick="bnClick" />
    
            <Button android:text="-" />
    
            <Button android:text="1"
                android:onClick="onClick" />
    
            <Button android:text="2" />
    
            <Button android:text="3" />
    
            <Button android:text="+" />
    
            <Button
                android:layout_columnSpan="2"
                android:layout_gravity="fill_horizontal"
                android:text="0" />
    
            <Button android:text="." />
    
            <Button android:text="=" />
        </GridLayout>
    
    </LinearLayout>

    2.Activity如下(这是我只写了几个按键可以按,作为例子):

    //网格布局
    public class GridLayout extends Activity {
        private EditText editText;
        private boolean lastClickIsNumber = false;
    
        @Override
        protected void onCreate(Bundle savedInstanceState) {
    
            super.onCreate(savedInstanceState);
            setContentView(R.layout.grid_layout);
            editText = (EditText) findViewById(R.id.textView6);
    
        }
    
        public void acClick(View v) {
    
        }
    
        public void onClick(View v) {
            if (!lastClickIsNumber) {
                editText.setText("1");
    
            } else {
                String oldContent = editText.getText().toString().trim();
                oldContent += "1";
                editText.setText(oldContent);
    
            }
            lastClickIsNumber = true;
        }
    
        public void anClick(View v) {
            if (!lastClickIsNumber) {
                editText.setText("x");
    
            } else {
                String oldContent = editText.getText().toString().trim();
                oldContent += "x";
                editText.setText(oldContent);
    
            }
            lastClickIsNumber = true;
        }
    
        public void bnClick(View v) {
            if (!lastClickIsNumber) {
                editText.setText("6");
    
            } else {
                String oldContent = editText.getText().toString().trim();
                oldContent += "6";
                editText.setText(oldContent);
    
            }
            lastClickIsNumber = true;
        }
    
    }

    展示:

    五.绝对布局(AbsoluteLayout)

    xml文件如下:

    <?xml version="1.0" encoding="utf-8"?>
    <AbsoluteLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="match_parent" 
        android:padding="5dp">
    <TextView 
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:layout_x="100dp"
        android:layout_y="50dp"
        android:text="你好吗?"/>
    
    <TextView 
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:layout_x="50dp"
        android:layout_y="100dp"
        android:text="我很好!"/>
    
    <TextView 
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:layout_x="200dp"
        android:layout_y="100dp"
        android:text="真的吗?"/>
    
    <TextView 
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:layout_x="100dp"
        android:layout_y="200dp"
        android:text="真的!"/>
    </AbsoluteLayout>

    展示:

    到此结束,接下来我会介绍安卓的基本控件。

  • 相关阅读:
    ASP.NET MVC 3 Internationalization
    Windows 8学习笔记(十)Notification
    Windows 8学习笔记(十二)集合控件
    Windows 8学习笔记(七)Input输入设备
    【配置与安装】解决类似umount target is busy挂载盘卸载不掉问题
    【coredump】coredump 使用
    【C++调试】"./xxx: /lib64/libstdc++.so.6: version `CXXABI_1.3.9' not found (required by ./xxx)" 执行报错
    【配置与安装】CentOS7 多磁盘合成卷组并创建LVM,挂载到同一目录
    Unix 知识
    3D创作概念入门
  • 原文地址:https://www.cnblogs.com/wuziyue/p/5371925.html
Copyright © 2011-2022 走看看