android图形界面UI详解

最新推荐文章于 2024-06-23 02:39:44 发布

freemindhack

最新推荐文章于 2024-06-23 02:39:44 发布

阅读量5.6k

点赞数 1

分类专栏： Android

本文链接：https://blog.csdn.net/freemindhack/article/details/36727627

版权

本文详细介绍了Android图形用户界面GUI的基础，包括View和ViewGroup的构成，以及ViewTree的遍历绘制原理。通过示例展示了XML布局在屏幕上如何呈现，强调了Parent先于Children绘制和Z轴的绘制顺序。此外，还提到了使用HierarchyViewer工具深入分析布局，并解释了DecorView在窗口系统中的角色。最后，通过自定义标题的实现过程，讲解了如何改变Activity的标题样式和高度。

摘要由CSDN通过智能技术生成

图形用户界面(GUI)是Android应用程序开发不可或缺的一部分。其不仅能为用户提供输入，还能够根据(用户)执行的动作，提供相应的反馈。因此，作为开发人员，能够理解UI(用户界面)是如何创建以及跟新的，就显得尤为重要。

ViewTree

View 和 ViewGroup 是Android UI的基本组件，而ViewGroup作为容器，可以包含一组View，并且ViewGroup其本身就是View的扩展。看源码：

public abstract class ViewGroup extends View implements ViewParent, ViewManager{}

而各种不同的Widgets 像TextView, Button 等等也是View的扩展，只不过是放在各种Layout里，比如LinearLayout， RelativeLayout。而Layout却是ViewGroup的子类。所以说一个ViewTree只不过是各种Views和ViewGroups放在一个Layout里组成的树形结构。

有例子才有真相。通过Eclipse的Outline窗口，我们可以看下下面这个树状布局。

XML Code：

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/RelativeLayout1"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent" >
 
    <View
        android:id="@+id/WhiteView"
        android:layout_width="200dp"
        android:layout_height="300dp"
        android:layout_marginLeft="20dp"
        android:background="#ffffff" />
 
    <TextView
        android:id="@+id/RedText"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:text="@string/hello"
        android:textColor="#ff0000" />
 
    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_above="@+id/GrayView"
        android:layout_alignLeft="@+id/GrayView"
        android:layout_marginBottom="25dp"
        android:background="#0000ff"
        android:orientation="vertical" >
 
        <TextView
            android:id="@+id/GreenText"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="TextView"
            android:textColor="#00ff00"
            android:textStyle="bold" />
 
        <Button
            android:id="@+id/Button1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Button in LinearLayout" />
    </LinearLayout>
     
    <View
        android:id="@+id/RedView"
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:layout_alignParentRight="true"
        android:layout_above="@+id/GrayView"
        android:layout_marginRight="10dp"
        android:layout_marginBottom="-10dp"
        android:background="#ff0000" />
     
    <View
        android:id="@+id/GrayView"
        android:layout_width="200dp"
        android:layout_height="300dp"
        android:layout_alignParentBottom="true"
        android:layout_alignParentRight="true"
        android:layout_marginRight="20dp"
        android:background="#cccccc" />
 
</RelativeLayout>