五大布局

原创

InProvence 2015-01-28 23:13:02 ©著作权

©著作权归作者所有：来自51CTO博客作者InProvence的原创作品，谢绝转载，否则将追究法律责任

五大布局即：线性布局(LinearLayout)、框架布局(FrameLayout)、表格布局(TableLayout)、绝对布局(AbsoluteLayout)和相对布局(RelativeLayout)。在了解五大布局之前，必须先了解一些常用的UI组件，例如：TextView组件，EditText组件，Button组件，RadioGroup和RadioButton组件，ImageView组件，Spinner组件，DatePicker和TimePicker组件......

模仿QQ界面，定义相对布局管理器：

<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:gravity="center_horizontal">

<TextView

android:layout_marginTop="10dip"

android:id="@+id/tv_account"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:textSize="18sp"

android:id="@+id/tv_account"/>

<EditText

android:layout_marginTop="10dip"

android:layout_toRightOf="@+id/tv_account"

android:id="@+id/et_account"

android:layout_width="250dip"

android:layout_height="wrap_content"

android:textSize="18sp"

android:id="@+id/et_account"/>

<TextView

android:layout_marginTop="20dip"

android:layout_below="@+id/tv_account"

android:id="@+id/tv_pwd"

android:layout_height="wrap_content"

android:layout_width="wrap_content"

android:textSize="18sp"

android:id="@+id/tv_password"/>

<EditText

android:layout_toRightOf="@+id/tv_pwd"

android:layout_below="@+id/et_account"

android:id="@+id/et_pwd"

android:layout_height="wrap_content"

android:layout_width="250dip"

android:textSize="18sp"

android:id="@+id/et_password"

android:password="true" />

<Button

android:layout_marginTop="30dip"

android:layout_below="@+id/tv_pwd"

android:id="@+id/btn_login"

android:layout_height="wrap_content"

android:layout_width="wrap_content"

android:id="@+id/btn_login"/>

<Button

android:layout_marginTop="30dip"

android:layout_below="@+id/tv_pwd"

android:layout_toRightOf="@+id/btn_login"

android:id="@+id/btn_register"

android:layout_height="wrap_content"

android:layout_width="wrap_content"

android:id="@+id/btn_register"/>

</RelativeLayout>

模仿QQ界面，定义线性布局管理器：

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

<LinearLayout

android:layout_width="fill_parent"

android:layout_height="wrap_content"

android:orientation="horizontal">

<TextView

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:id="@+id/tv_account" />

<EditText

android:layout_width="fill_parent"

android:layout_height="wrap_content"/>

</LinearLayout>

<LinearLayout

android:layout_width="fill_parent"

android:layout_height="wrap_content"

android:orientation="horizontal">

<TextView

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:id="@+id/tv_password" />

<EditText

android:layout_width="fill_parent"

android:layout_height="wrap_content"/>

</LinearLayout>

<LinearLayout

android:layout_width="fill_parent"

android:layout_height="wrap_content"

android:gravity="center"

android:orientation="horizontal">

<Button

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:id="@+id/btn_login" />

<Button

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:id="@+id/btn_register"/>

</LinearLayout>

模仿QQ界面，定义表格布局管理器：

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

xmlns:tools="http://schemas.android.com/tools"

android:layout_width="fill_parent"

android:layout_height="match_parent" >

<TableRow

android:layout_width="fill_parent"

android:layout_height="wrap_content" >

<TextView

android:layout_width="0dip"

android:layout_height="wrap_content"

android:layout_weight="2"

android:id="@+id/tv_account" />

<EditText

android:layout_width="0dip"

android:layout_height="wrap_content"

android:layout_weight="8"

android:id="@+id/et_account" />

</TableRow>

<TableRow

android:layout_width="fill_parent"

android:layout_height="wrap_content" >

<TextView

android:layout_width="0dip"

android:layout_height="wrap_content"

android:layout_weight="2"

android:id="@+id/tv_password" />

<EditText

android:layout_width="0dip"

android:layout_height="wrap_content"

android:layout_weight="8"

android:id="@+id/et_password" />

</TableRow>

<TableRow

android:layout_width="fill_parent"

android:layout_height="wrap_content" >

<Button

android:layout_width="0dip"

android:layout_height="wrap_content"

android:layout_weight="5"

android:id="@+id/btn_login"/>

<Button

android:layout_width="0dip"

android:layout_height="wrap_content"

android:layout_weight="5"

android:id="@+id/btn_register"/>

</TableRow>

</TableLayout>

框架布局(又称祯布局)

<FrameLayout 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"

<TextView

android:layout_width="fill_parent"

android:layout_height="100dip"

android:background="#ff0000"

android:text="@string/hello_world"/>

<TextView

android:layout_width="105dp"

android:layout_height="50dip"

android:background="#00ff00"

android:text="@string/hello_world"/>

</FrameLayout>

绝对布局

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

<TextView

android:layout_x="20dip"

android:layout_y="20dip"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:background="#ff0000"

android:text="@string/hello_world" />

</AbsoluteLayout>

下一篇：高级控件ListView及适配器

提问和评论都可以，用心的回复会被更多人看到评论

发布评论

相关文章

官方博客	全部文章	热门标签	班级博客
了解我们	网站地图	意见反馈

鸿蒙开发者社区	51CTO学堂
51CTO	软考资讯