Android 布局

这里我们将描述的是Android应用程序设计用户界面。主要的内容是布局管理器等。

   

     8.1    布局管理器

        常用的布局管理器有以下几种:

       

布局管理器

描述

LinearLayout

线性布局,所有的组件都按照线性来排列,这个线性可以是水平排列,也可以是垂直排列

FrameLayout

框架布局,已左上角为基准,所有的对象都在前一个对象的基础上以该左上角点为基准覆盖。

TableLayout

表格布局,将组件分配到行或列中。每个表格布局由TableRow组成,每个TableRow都定义一个row

RleativeLayout

相对布局则是根据各个组件之间的关系或者组件跟父容器的关系来进行组件的定位。

AbsoluteLayout

绝对布局,指定组件的x/y坐标,显示在屏幕上。注意:可允许组件之间相互重叠。不过Android不推荐使用绝对布局,

因为在不同的机型上可能导致不同的布局结果,达不到开发者预期的目的。

表格8.1.1   布局管理器描述

 

 

      8.1.1 LinearLayout

            LinearLayout的重要视图属性如下:

属性名

应用于

描述

android:orientation

父视图

布局为行模式或列模式

horizontal|vertical

android:gravity

父视图

布局中子视图的重力属性

top|bottom|left|right|center_vertical|fill_vertical|

center_horizontal|fill_horizontal|center|fill

android:layout_weight

子视图

确定子视图在父控件中的比例

所有子控件weight值之和为1

表8.1.2 LinearLayout布局视图属性

   

   

            使用举例:

            LinearLayout.xml

<LinearLayoutxmlns: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"

    tools:context=".MainActivity">

   

    <Button

       android:id="@+id/test1"

       android:layout_width="wrap_content"

       android:layout_height="wrap_content"

       android:text="@string/test1"

       />

 

    <Button

       android:id="@+id/test2"

       android:layout_width="wrap_content"

       android:layout_height="wrap_content"

       android:text="@string/test2"

       />

   

</LinearLayout>

代码片段8.1.1.1 相对布局xml配置文件

 

图8.1.1.1   线性布局运行效果

 

 

      8.1.2 FrameLayout

        FrameLayout的重要视图属性如下:

属性

应用于

描述

android:foreground

父视图

覆盖原来的内容绘图

资源

android:foregroundGravity

父视图

前景的权值

top|bottom|left|right|center_vertical|fill_vertical|

center_horizontal|fill_horizontal|center|fill

android:measureAllChildren

父视图

限制子控件

true|false

android:layout_gravity

子视图

子控件在父容器中算占位置

top|bottom|left|right|center_vertical|fill_vertical|

center_horizontal|fill_horizontal|center|fill

表8.1.3 FrameLayout视图属性

            FrameLayout.xml:

<FrameLayoutxmlns: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"

    tools:context=".MainActivity">

   

    <Button

       android:id="@+id/test1"

       android:layout_width="match_parent"

       android:layout_height="100dp"

       android:text="@string/test1"

       />

 

    <Button

       android:id="@+id/test2"

       android:layout_width="wrap_content"

       android:layout_height="wrap_content"

       android:text="@string/test2"

       />

   

</FrameLayout>

代码片段8.1.2.1 FrameLayout的xml配置文件


图8.1.2.1   FrameLayout效果图

      8.1.3 TableLayout

            TableLayout的重要视图属性如下:

属性

应用于

描述

android:collapseColumns

TableLayout

使用逗号分割的废弃列序号

字符换或字符串资源

android:shrinkColums

TableLayout

使用逗号的收缩列序号表

同上

android:stretchColums

TableLayout

使用逗号分割的伸展列序号表

同上

android:layout_colum

TableRow子控件

该控件所在的列序号

整形或者整形资源

android:layout_span

TabelRow子控件

该视图所跨列的列数量

不小于1的整形或者整形资源

表8.1.4 TabelLayout的视图属性

 

            TableLayout.xml:

<TableLayoutxmlns: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"

    tools:context=".MainActivity">

   

    <TableRow

       android:id="@+id/tableRow1"

       android:layout_width="match_parent"

       >

        <Button

       android:id="@+id/test1"

       android:layout_width="match_parent"

       android:layout_height="wrap_content"

       android:text="@string/test1"

       />

        <Button

       android:id="@+id/test2"

       android:layout_width="match_parent"

       android:layout_height="wrap_content"

       android:text="@string/test2"

       />

        <Button

       android:id="@+id/test3"

       android:layout_width="wrap_content"

       android:layout_height="wrap_content"

       android:text="@string/test3"

       />

    </TableRow>

   

    <TableRow

       android:id="@+id/tableRow2"

       android:layout_width="match_parent"

       >

        <Button

       android:id="@+id/test4"

       android:layout_width="wrap_content"

       android:layout_height="wrap_content"

       android:text="@string/test4"

       android:layout_span="3"

       />

    </TableRow>

   

    <TableRow

       android:id="@+id/tableRow3"

       android:layout_width="match_parent"

       >

        <Button

       android:id="@+id/test5"

       android:layout_width="wrap_content"

       android:layout_height="wrap_content"

       android:text="@string/test5"

       android:layout_column="1"

       />

    </TableRow>

   

</TableLayout>

代码片段8.1.3.1 TabelLayout的xml配置

 

图8.1.3.1   TableLayout效果图

       

       

      8.1.4 RelativeLayout

            RelativeLayout的重要视图属性:

属性

应用于

描述

android:gravity

父视图

布局中子控件的位置

top|bottom|left|right|center_vertical|fill_vertical|

center_horizontal|fill_horizontal|center|fill

android:layout_centerInParent

子视图

在父视图中水平、垂直均居中

true|false

android:layout_centerHorizontal

子视图

在父视图中水平居中

true|false

android:layout_centerVertical

子视图

在父视图中垂直居中

true|false

android:layout_alignParentBottom/Top/Left/Right

子视图

与父视图下、上、左、右对齐

true|false

andorid:layout_alignBottom|Top|Left|Right

子视图

与指定视图下、上、左、右边对齐

视图ID

android:above|below|toLeftOf|otRightOf

子视图

将该视图的下边沿放置于知道哪个视图的

上方、下方、左侧、右侧

视图ID

表8.1.5 RelativeLayout视图属性

 

 

            RelativeLayout.xml:

<RelativeLayoutxmlns: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"

    tools:context=".MainActivity">

   

    <Button

       android:id="@+id/test1"

       android:layout_alignParentLeft="true"

       android:layout_marginTop="50dp"

       android:layout_width="wrap_content"

       android:layout_height="wrap_content"

        android:text="@string/test1"

       />

 

    <Button

       android:id="@+id/test2"

       android:layout_toRightOf="@id/test1"

       android:layout_marginLeft="10dp"

       android:layout_width="wrap_content"

       android:layout_height="wrap_content"

       android:text="@string/test2"

       />

   

</RelativeLayout>

代码片段8.1.4.1 RelativeLayout的xml配置

 

图8.1.4.1   RelativeLayout效果图

 

 

      8.1.5 AbsoluteLayout

            AbsoluteLayout的重要视图属性:

属性

应用于

描述

android:layout_x

子控件

设置子控件的x坐标

整数型或者整型资源

android:layout_y

子控件

设置子控件的y坐标

同上

表8.1.6 AbsoluteLayout视图属性

 

 

            AbsoluteLayout.xml:

<AbsoluteLayoutxmlns: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"

    tools:context=".MainActivity">

   

    <Button

       android:id="@+id/test1"

       android:layout_x="20dp"

       android:layout_y="20dp"

       android:layout_width="wrap_content"

       android:layout_height="wrap_content"

       android:text="@string/test1"

       />

 

    <Button

       android:id="@+id/test2"

       android:layout_x="100dp"

       android:layout_y="100dp"

       android:layout_width="wrap_content"

       android:layout_height="wrap_content"

       android:text="@string/test2"

       />

   

</AbsoluteLayout>

代码片段8.1.5.1 AbsoluteLayout的xml配置


图8.1.5.1   AbsoluteLayout效果图

     8.2         View容器类

这些容器类不止可以容纳其他简单的View类,而且能够允许以某种标准的方式同其交互。

这些内建的View容器包括以下几类:

1.  列表、网格和“画廊(gallery)”

2.  使用ViewFlipper、ImageSwitcher、TextSwitcher所表示的“开关选型”

3.  使用TabHost和TabControl表示的标签

4.  使用ScrollView和HorizontalScrollView进行滚动

5.  使用SlidingDrawer隐藏或显示内容

 

 

      8.2.1 Adapter

之所以提到Adapter,就是因为接下来的容器,有些是以数据来驱动的。

Adapter分为两种类型:

1.  ArrayAdapter

    使用方式:

    this.adapter =new ArrayAdapter<String>(this.context, R.layout.text_one,list);

代码片段8.2.1.1 ArrayAdapter的使用使用

 

注释:通过获取Array数组来填充容器的数据,this.context为Activtiy实例,R.layout.text_one为列表视图的item布局,list为出入的数组

   

2.  CursorAdapter

    使用方式:

this.names =this.context.managedQuery(Contacts.Phones.CONTENT_URI,

      null, null, null,null);

this.context.startManagingCursor(names);

new SimpleCursorAdapter(this.context, R.layout.text_two,namesnew String[] { Contacts.Phones.NAME, Contacts.Phones.NUMBER },

new int[] { R.id.text1, R.id.text2 });

代码片段8.2.1.2 CursorAdapter使用方式

 

    注释:通过数据库的返回Cursor来填充数据,上述是对联系人进行的查询,不过在使用这个的前提为必须声明可查询联系人权限

      8.2.2 ListView、GridView和GlleryView

    作用:

这些容器被设计以某种方式用来显示重复的View对象

           

            使用方式:

                只需要调用setAdapter方法,传入adapter就行。

       

       

      8.2.3 TabActivity

拥有标签的屏幕布局由一个TabActivity和一个TabHost构成,TabHost由TabSpec构成。

 

我们有两种方式编写Tab标签:

1.  继承TabActivity,并且使用getTabHost方法来获取TabHost对象

2.  使用自定义的TabHost在布局文件上定义ID,然后通过查找ID获取组件

 

这里我们主要讲解的是通过继承的方式来构建一个TabActivity

 

首先必需要进行的是Tab的xml文件编写:

 

<?xmlversion="1.0"encoding="utf-8"?>

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

    android:id="@android:id/tabhost"

    android:layout_width="fill_parent"

    android:layout_height="fill_parent">

 

    <LinearLayout

       android:layout_width="fill_parent"

       android:layout_height="fill_parent"

       android:orientation="vertical">

 

        <TabWidget

           android:id="@android:id/tabs"

           android:layout_width="fill_parent"

           android:layout_height="wrap_content"/>

 

        <FrameLayout

           android:id="@android:id/tabcontent"

           android:layout_width="fill_parent"

           android:layout_height="fill_parent">

 

 

            <TextView

                android:id="@+id/no_team_meetings"

                android:layout_width="fill_parent"

                android:layout_height="fill_parent"

                android:textSize="18sp"/>

 

            <TextView

                android:id="@+id/no_team_meeting_stats"

                android:layout_width="fill_parent"

                android:layout_height="fill_parent"

                android:textSize="18sp"/>

        </FrameLayout>

    </LinearLayout>

 

</TabHost>

注意:TabWidget和FrameLayout这两个必须要注意的是需要添加ID,且这两个添加的ID必须为系统ID,否则无法找到,会报NULL错误

 

 

那么如何获取TabHost,并且添加TabSpec呢?

 

如下:

 

tabHost.addTab(tabHost.newTabSpec("tab1").setIndicator("Grid")

            .setContent(new Intent(getApplicationContext(),GridViewActivity.class)));

tabHost.addTab(tabHost.newTabSpec("tab2").setIndicator("List").setContent(this));

代码片段8.2.3.1 tabHost添加标签页内容

 

注意:  tabHost添加需要注意的是它有三种方式:

        1.  利用Intent转发Activity

        2.  利用layout的布局xml文件

        3.  利用TabContentFactory接口创建一个TabContent

 

 

     8.3         小结

    本节介绍了一些容器类的内容。


  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值