Android之UI

xqls

浏览: 27635 次
性别:
来自: 成都

最近访客更多访客>>

wang303044

chunguang_yao

shuai615711422

sunyi

博主相关

博客

微博

相册

留言

关于我

文章分类

社区版块

存档分类

博客分类：

Android

UI Android 框架 XML

Android之UI界面的布局
andorid的界面，需要写在res/layout的xml里面，一般情况下一个xml对应一个界面。做android的界面有点像写 html(连注释代码的方式都一样)，要先给android定框架，然后再在框架里面放控件，android提供了几种框架,AbsoluteLayout,LinearLayout,RelativeLayout,TableLayout,FrameLayout

FrameLayout:里面只可以有一个控件，并且不能设计这个控件的位置，控件会放到左上角
LinearLayout：里面可以放多个控件，但是一行只能放一个控件
TableLayout：这个要和TableRow配合使用，很像html里面的table
AbsoluteLayout：里面可以放多个控件，并且可以自己定义控件的x,y的位置
RelativeLayout：里面可以放多个控件，不过控件的位置都是相对位置
LinearLayout - 线形布局。
    orientation - 容器内元素的排列方式。vertical: 子元素们垂直排列；horizontal: 子元素们水平排列
    gravity - 内容的排列形式。常用的有 top, bottom, left, right, center 等

FrameLayout - 层叠式布局。以左上角为起点，将 FrameLayout 内的元素一层覆盖一层地显示

TableLayout - 表格式布局。
        TableRow - 表格内的行，行内每一个元素算作一列
        collapseColumns - 设置 TableLayout 内的 TableRow 中需要隐藏的列的列索引，多个用“,”隔开
        stretchColumns - 设置 TableLayout 内的 TableRow 中需要拉伸（该列会拉伸到所有可用空间）的列的列索引，多个用“,”隔开
        shrinkColumns - 设置 TableLayout 内的 TableRow 中需要收缩（为了使其他列不会被挤到屏幕外，此列会自动收缩）的列的列索引，多个用“,”隔开

RelativeLayout - 相对定位布局。
        layout_centerInParent - 将当前元素放置到其容器内的水平方向和垂直方向的中央位置（类似的属性有：layout_centerHorizontal, layout_alignParentLeft 等）
        layout_marginLeft - 设置当前元素相对于其容器的左侧边缘的距离
        layout_below - 放置当前元素到指定的元素的下面
        layout_alignRight - 当前元素与指定的元素右对齐

layout_width - 宽。

fill_parent: 宽度跟着父元素走；

wrap_content: 宽度跟着本身的内容走；

直接指定一个 px 值来设置宽

layout_height - 高。

fill_parent: 高度跟着父元素走；

wrap_content: 高度跟着本身的内容走；

直接指定一个 px 值来设置高

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



<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:gravity="right"
    android:layout_width="fill_parent" android:layout_height="fill_parent">

    
    <FrameLayout android:layout_height="wrap_content"
        android:layout_width="fill_parent">
        <TextView android:layout_width="wrap_content"
            android:layout_height="wrap_content" android:text="FrameLayout">
        </TextView>
        <TextView android:layout_width="wrap_content"
            android:layout_height="wrap_content" android:text="Frame Layout">
        </TextView>
    </FrameLayout>

    <TextView android:layout_width="wrap_content"
        android:layout_height="wrap_content" android:text="@string/hello" />

    
    <TableLayout android:id="@+id/TableLayout01"
        android:layout_width="fill_parent" android:layout_height="wrap_content"
        android:collapseColumns="1">
        <TableRow android:id="@+id/TableRow01" android:layout_width="fill_parent"
            android:layout_height="wrap_content">
            <TextView android:layout_width="wrap_content"
                android:layout_weight="1" android:layout_height="wrap_content"
                android:text="行1列1" />
            <TextView android:layout_width="wrap_content"
                android:layout_weight="1" android:layout_height="wrap_content"
                android:text="行1列2" />
            <TextView android:layout_width="wrap_content"
                android:layout_weight="1" android:layout_height="wrap_content"
                android:text="行1列3" />
        </TableRow>
        <TableRow android:id="@+id/TableRow01" android:layout_width="wrap_content"
            android:layout_height="wrap_content">
            <TextView android:layout_width="wrap_content"
                android:layout_height="wrap_content" android:text="行2列1" />
        </TableRow>
    </TableLayout>

    
    <AbsoluteLayout android:layout_height="wrap_content"
        android:layout_width="fill_parent">
        <TextView android:layout_width="wrap_content"
            android:layout_height="wrap_content" android:text="AbsoluteLayout"
            android:layout_x="100px"
            android:layout_y="100px" />
    </AbsoluteLayout>

    
    <RelativeLayout android:id="@+id/RelativeLayout01"
        android:layout_width="fill_parent" android:layout_height="fill_parent">
        <TextView android:layout_width="wrap_content" android:id="@+id/abc"
            android:layout_height="wrap_content" android:text="centerInParent=true"
            android:layout_centerInParent="true" />
        <TextView android:layout_width="wrap_content"
            android:layout_height="wrap_content" android:text="marginLeft=20px"
            android:layout_marginLeft="20px" />
        <TextView android:layout_width="wrap_content"
            android:layout_height="wrap_content" android:text="xxx"
            android:layout_below="@id/abc" android:layout_alignRight="@id/abc" />
    </RelativeLayout>

</LinearLayout>

分享到：