android界面设计之布局

标签：android   ui   

一、线性布局

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context=".Test01Activity" >

    <!-- 线性布局 -->

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal" >

        <Button
            android:id="@+id/btn1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="1" />

        <Button
            android:id="@+id/btn2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="2" />

        <Button
            android:id="@+id/btn3"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="3" />

        <Button
            android:id="@+id/btn4"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="4" />
    </LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
         android:layout_height="wrap_content"
        android:orientation="horizontal" >

        <Button
            android:id="@+id/btn5"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="4" />

        <Button
            android:id="@+id/btn6"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="5" />

        <Button
            android:id="@+id/btn7"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="6" 
            android:layout_weight="1"
            />


    </LinearLayout>

</LinearLayout>

结果：

二、相对布局

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context=".MainActivity" >

     <!-- 相对布局 -->
    <Button
            android:id="@+id/bbtn1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="中央" 
            android:layout_centerHorizontal="true"
            android:layout_centerVertical="true"
            />
    <Button
            android:id="@+id/bbtn2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="左上角"
            android:layout_above="@id/bbtn1" 
            android:layout_toLeftOf="@id/bbtn1" 
            />
    <Button
            android:id="@+id/bbtn3"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="左下角"
            android:layout_below="@id/bbtn1"
            android:layout_toLeftOf="@id/bbtn1" 
            />
    <Button
            android:id="@+id/bbtn4"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="右下" 
            android:layout_below="@id/bbtn1"
            android:layout_toRightOf="@id/bbtn1" 

            />
    <Button
            android:id="@+id/bbtn5"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_toRightOf="@id/bbtn1" 
			android:layout_above="@id/bbtn1" 
            android:text="右上" 
            />
   

</RelativeLayout>

结果：

三、网格布局

<GridLayout xmlns:android="http://schemas.android.com/apk/res/android"  
    android:layout_width="wrap_content"  
    android:layout_height="wrap_content"  
    android:orientation="horizontal"  
    android:rowCount="5"  
    android:columnCount="4" > 
    
    <!-- 网络布局 -->
　　<Button
            android:id="@+id/bbtn1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="中央" 
            android:layout_centerHorizontal="true"
            android:layout_centerVertical="true"
            />
　　<Button
            android:id="@+id/bbtn1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="中央" 
            android:layout_centerHorizontal="true"
            android:layout_centerVertical="true"
            />
　　<Button
            android:id="@+id/bbtn1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="中央" 
            android:layout_centerHorizontal="true"
            android:layout_centerVertical="true"
            />
　　<Button
            android:id="@+id/bbtn1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="中央" 
            android:layout_centerHorizontal="true"
            android:layout_centerVertical="true"
            />
　　<Button
            android:id="@+id/bbtn1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="中央" 
            android:layout_centerHorizontal="true"
            android:layout_centerVertical="true"
            />
　　<Button
            android:id="@+id/bbtn1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="中央" 
            android:layout_centerHorizontal="true"
            android:layout_centerVertical="true"
            />
　　<Button
            android:id="@+id/bbtn1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="中央" 
            android:layout_centerHorizontal="true"
            android:layout_centerVertical="true"
            />
　　<Button
            android:id="@+id/bbtn1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="中央" 
            android:layout_centerHorizontal="true"
            android:layout_centerVertical="true"
            />
　　<Button
            android:id="@+id/bbtn1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="中央" 
            android:layout_centerHorizontal="true"
            android:layout_centerVertical="true"
            />
　　<Button
            android:id="@+id/bbtn1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="中央" 
            android:layout_centerHorizontal="true"
            android:layout_centerVertical="true"
            />
　　<Button
            android:id="@+id/bbtn1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="中央" 
            android:layout_centerHorizontal="true"
            android:layout_centerVertical="true"
            />
　　<Button
            android:id="@+id/bbtn1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="中央" 
            android:layout_centerHorizontal="true"
            android:layout_centerVertical="true"
            />
　　<Button
            android:id="@+id/bbtn1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="中央" 
            android:layout_centerHorizontal="true"
            android:layout_centerVertical="true"
            />
　　<Button
            android:id="@+id/bbtn1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="中央" 
            android:layout_centerHorizontal="true"
            android:layout_centerVertical="true"
            />
　　<Button
            android:id="@+id/bbtn1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="中央" 
            />
　　<Button
            android:id="@+id/bbtn1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_rowSpan="2"
            android:layout_gravity="fill"
            android:text="=" 
            />
　　<Button
            android:id="@+id/bbtn1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="+" 
            
            android:layout_columnSpan="2"
            android:layout_gravity="fill"
            />
　　<Button
            android:id="@+id/bbtn1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="中央" 
            />
  </GridLayout>  

结果：

四、表格布局

<?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"
    android:padding="3dip" >

    <!-- 第1个TableLayout，用于描述表中的列属性。第0列可伸展，第1列可收缩，第2列被隐藏 -->
   <TableLayout 
       android:layout_width="fill_parent"
       android:layout_height="wrap_content"
       android:stretchColumns="1"
       >
       <TableRow >
           <TextView   android:text="nihao"/>
           
       </TableRow>
        <TableRow >
           <TextView   android:text="你好ihdsakj "/>
            <Button   android:text="你好ihdsakj "/>
       </TableRow>
       <TableRow >
           <Button   android:text="你好ihdsakj "/>
           
       </TableRow>
          
   </TableLayout>
   

</LinearLayout>

结果

:

 

android界面设计之布局,布布扣,bubuko.com

android界面设计之布局

标签：android   ui   

原文地址：http://blog.csdn.net/wanghaiping1993/article/details/36909393