安卓的主要几大布局
今天我们的主要内容就是安卓的主要几个基础的布局方式。(主要布局如下:)
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>
展示:
到此结束,接下来我会介绍安卓的基本控件。