Android的UI结构研究

View是一个派生自 java object 的组件 ,Android 的 UI 是以 View 组件为基础元素的 . 所有的显示全部来自于 view(android.view.View)

View是一个基本类 . 为 android.widget 包服务 .widget 包里面包含了绝大多数的 UI 组件和排版规则 (layout), 其中包含有 TextView,EditText,Button,radioButton,Checkbox,progressbar...

等等等很多很多的组件, 这里暂不一一列举 . 在这里 view 其实相当于 component

ViewGroup是一个派生自 view 的对象 , 他是一个用来装载和管理下一层 view 组件的一个容器 , 可以装入 view 和 viewGroup, 其中很多 layout, 还有 gallery,spinner,datepicker 等都是派生自 viewGroup., 相当于有多个小组件组成的一个整体的组件 . 这里 viewgroup 相当于 container.

用图表示基本的UI 组件之间的关系的话 , 如下 :

 

此图并没有完全写上详细的UI 组件 . 只是简要的介绍部分组件之间的一些派生关系 .

 

高级界面分析:

关于viewgroup 其中几个常用的排版 :

FrameLayout 指定一个区域 , 只在左上角一层一层的累加

LinearLayout 纵向或者横向排列 ( 系统自动生成的默认排版 )
      主要参数android:orientation="vertical"// 竖向排列
              android:orientation="horizontal"//横向排列

AbsoluteLayout 可以直接指定坐标
      主要参数: 组件设置 :
              android:layout_x="0px"
              android:layout_y="0px"

TableLayout 表格
主要参数设置:
<TableLayout>

    <TableRow > 

        <TextView />

        <TextView />

        <TextView />

    </TableRow>

    <TableRow >  

        <TextView />

        <TextView />

        <TextView />

    </TableRow>

</TableLayout>

 

关于viewgroup 其中几个常用的组件 ( 其实也是排版 ):
Gallery

 一个以水平滚动方式显示有序图片列表的显示器

GridView 

 显示一个可滚动的有m 列 n 行的表格

ListView

 显示一个可滚动的单列列表

PopupList

 一个独立的带边框的元素弹出列表

ScrollView

 一个垂直的元素滚动列

Spinner

 在一个单行文本框中，同时只显示一个有序列表中的一个项。类似于一个可以水平或垂直滚动的单行listbox

SurfaceView

 提供直接访问一个可画图的界面。可以控制在界面顶部的子视图层。SurfaceView 是提供给需要直接画像素而不是使用窗体部件的应用使用的。

TabHost

 提供一个页签选择列表，监视点击并在一个页签被点击时保证应用切换屏幕。

ViewFlipper

 一个在单行文本框中同一时刻只显示一项的列表组件。它可以根据时间周期切换显示项，类似一个幻灯机。

ViewSwitcher 

 类似ViewFlipper

==========

以上的一些可能存在一些数据绑定的组件排版, 一般都派生自 AdapterView 类 , 其中 Adapter 是将数据绑定到 UI 界面上的桥接类 .Adapter 是一个接口类

以上是android 自带的 UI 组件 . 当然如果觉得不爽的话 , 可以自己写组件 . 一般来说只要把自己需要的组件派生自对应的 UI 组件 , 然后重写相关方法就 OK 了 .( 如果玩低级界面的话个人建议派生自 View)

 

下面针对要编写的界面进行一些说明:

下面这张图是一个简单的UI 结构 , 基本上 android 所有的 UI 都是基于树结构的 .

 

其中ViewGroup 可能是 LinearLayout  等 layout, 或者 Spinner 等复合 UI 组件 .

其中的View 可能是 TextView,EditText,Button,radioButton,Checkbox.... 等等

其中viewGroup 对自己的子节点负责 . 而所有的 view 只管自己画自己 .( 家长制原则 )
引用别人说的话, 加强理解 :
android世界是个等级严明的封建主义社会。每一个 viewgroup 都管理着他的子节点。然后通过调用子节点的 draw() 方法让这些子节点一个个对着镜子画自己。子节点也能怯生生的询问 viewgroup 自己画成什么样比较好看。（比如自己在大家庭中的地位啊（位置），身材尺寸啊什么的。但是父节点拥有最终解释权。没有父节点就没有 android 嘛。父节点说什么，子节点就必须是什么 .

============

自定义类的调用, 以及低级界面的分析 :

针对低级界面, 准确的来说是由界面单独显示独立的一个空 View 组件 , 然后重写相关的方法 , 比如 ondraw 和 ontouch,onkeydown 等方法来实现的 .

简单的示例实现方法:

1.创建一个新的 java 文件 ,

2.将此类派生自 view 方法 . 创建初始化方法和 ondraw,ontouchevent 方法 .

 

 

public class MyView extends View {
  public MyView(Context context){super(context, attrs, defStyle);
  protected void onDraw(Canvas canvas){super.onDraw(canvas);}
  public boolean onTouchEvent(MotionEvent event){return true;}
}

3.创建一个 paint 实例 , 然后开始写相关的低级界面绘画内容 .
4.在 Activity 里面 , 在 onCreate 注释掉原来的 setContentView 方法 , 加入 2 行代码 :
MyView mv= new MyView(this);
setContentView(mv);

5.打开调试模式 , 测试相关绘画结果 .

如果是用xml 调用的话 , 只要将 myView 的初始化方法准备齐全 . 然后在 xml 中输入 :
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent">

<com.ikags.lowleveldemo.MyView
android:id="@+id/myview01"
android:layout_width="fill_parent"
android:layout_height="fill_parent"/>

</LinearLayout >
然后Activity 继续原来的 setContentView(R.layout.main) 方法即可 . 这里需要注意的是你的 view 需要用全路径来展示 .

针对高级界面和低级界面组件混合显示:

混合显示高级界面和低级界面其实和全部高级界面的显示类似. 但是在编写相关的 view 类的代码的时候需要添加方法 .
  protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec){
setMeasuredDimension(320, 640); //输入 UI 组件大小
}

作用是设置本身UI 控件的大小 , 如果没有设置的话 , 在 UI 组件混用的情况下是无法显示出来的 .
然后按照正常的xml 编辑方法去做 .

write by airzhangfish in 2010.1.24