Android UI设计

在本章中，我们将介绍android屏幕的不同UI组件。本章还介绍了制作更好的UI设计的技巧，并解释了如何设计UI。

UI屏幕组件

Android应用程序的典型用户界面由操作栏和应用程序内容区域组成。

主要行动吧
查看控件
内容区域
拆分动作栏

这些组件也显示在下图中

Anroid UI教程

了解屏幕组件

android应用程序的基本单元是活动。UI在xml文件中定义。在编译期间，XML中的每个元素都被编译为具有由方法表示的属性的等效Android GUI类。

查看和ViewGroups

活动由视图组成。视图只是一个显示在屏幕上的小部件。它可以是按钮等一个或多个视图可以组合成一个GroupView。ViewGroup的示例包括布局。

布局类型

布局有很多种类型。其中一些列表如下

线性布局
绝对布局
表格布局
框架布局
相对布局

线性布局

线性布局进一步分为水平和垂直布局。这意味着它可以在单个列或单行中排列视图。这是包含文本视图的线性布局代码（垂直）。

<?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” >

   <TextView
      android:layout_width=”fill_parent”
      android:layout_height=”wrap_content”
      android:text=”@string/hello” />
</LinearLayout>

AbsoluteLayout

AbsoluteLayout使您可以指定其子项的确切位置。它可以像这样声明。

<AbsoluteLayout
   android:layout_width=”fill_parent”
   android:layout_height=”fill_parent”
   xmlns:android=”http://schemas.android.com/apk/res/android” >

   <Button
      android:layout_width=”188dp”
      android:layout_height=”wrap_content”
      android:text=”Button”
      android:layout_x=”126px”
      android:layout_y=”361px” />
</AbsoluteLayout>

TableLayout

TableLayout将视图分组为行和列。它可以像这样声明。

<TableLayout
   xmlns:android=”http://schemas.android.com/apk/res/android”
   android:layout_height=”fill_parent”
   android:layout_width=”fill_parent” >

   <TableRow>
      <TextView
         android:text=”User Name:”
         android:width =”120dp”
         />

      <EditText
         android:id=”@+id/txtUserName”
         android:width=”200dp” />
   </TableRow>

</TableLayout>

RelativeLayout

RelativeLayout使您可以指定子视图相对于彼此的位置。它可以像这样声明。

<RelativeLayout
   android:id=”@+id/RLayout”
   android:layout_width=”fill_parent”
   android:layout_height=”fill_parent”
   xmlns:android=”http://schemas.android.com/apk/res/android” >
</RelativeLayout>

FrameLayout

FrameLayout是屏幕上的占位符，可用于显示单个视图。它可以像这样声明。

<?xml version=”1.0” encoding=”utf-8”?>
<FrameLayout
   android:layout_width=”wrap_content”
   android:layout_height=”wrap_content”
   android:layout_alignLeft=”@+id/lblComments”
   android:layout_below=”@+id/lblComments”
   android:layout_centerHorizontal=”true” >

   <ImageView
      android:src = “@drawable/droid”
      android:layout_width=”wrap_content”
      android:layout_height=”wrap_content” />
</FrameLayout>

除了这些属性之外，还有其他属性在所有视图和ViewGroup中都很常见。它们列在下面 -

序号	查看和说明
1	layout_width 指定View或ViewGroup的宽度
2	layout_height 指定View或ViewGroup的高度
3	layout_marginTop 指定View或ViewGroup顶部的额外空间
4	layout_marginBottom 指定View或ViewGroup底部的额外空间
5	layout_marginLeft 指定View或ViewGroup左侧的额外空间
6	layout_marginRight 指定View或ViewGroup右侧的额外空间
7	layout_gravity 指定子视图的定位方式
8	layout_weight 指定布局中应将多少额外空间分配给View

测量单位

当您在Android UI上指定元素的大小时，您应该记住以下度量单位。

序号	单位和描述
1	DP 密度无关的像素。1 dp相当于160 dpi屏幕上的一个像素。
2	SP 与比例无关的像素。这类似于dp，建议用于指定字体大小
3	PT 点。根据物理屏幕尺寸，将点定义为1/72英寸。
4	PX 像素。对应于屏幕上的实际像素

屏幕密度

序号	密度和DPI
1	低密度（ldpi） 120 dpi
2	中密度（mdpi） 160 dpi
3	高密度（hdpi） 240 dpi
4	超高密度（xhdpi） 320 dpi

优化布局

以下是创建高效布局的一些准则。

避免不必要的嵌套
避免使用太多的视图
避免深度筑巢