Android UI 优化 [ 类别：Layout ] #1

最新推荐文章于 2025-12-05 09:24:48 发布

最新推荐文章于 2025-12-05 09:24:48 发布 · 70 阅读

文章标签：

#移动开发 #ui

本文对比了LinearLayout与RelativeLayout在资源消耗上的区别，特别是在大量Item显示时。通过具体案例展示了如何使用RelativeLayout进行优化，减少层级并提高效率。

有一句古话：不论黑猫白猫，能抓到耗子就是好猫。这个也许在某些方面是有道理的，但对于我们追求精益求精的思想是背道而驰的，往往就是因为满足于一个结果，而放弃探求更加优化的处理方法。

当关注应用程序或者游戏所达到的结果时，往往非常容易忽视一些优化的问题，例如内存优化，线程优化，Media优化和UI优化等等。不同的模块都存在更为巧妙的方式来对待一般性问题，所以每当我们实现一个行为后，稍微多花一些时间来考虑目前所作的工作是否存在更为高效的解决办法。

这一次我们对常用的UI Layout优化说起，这个例子转载于 android developing blog

在Android中最常用LinearLayout表示UI的框架，而且也是最直观和方便的方法。例如创建一个UI用于展现Item的基本内容。如图所示：

线框图：

直接可以通过LinearLayout快速的实现这个UI的排列：

^?[Copy to clipboard] View Code XML

<LinearLayout xmlns:
    android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="?android:attr/listPreferredItemHeight"

    android:padding="6dip">

    <ImageView
        android:id="@+id/icon"
        android:layout_width="wrap_content"
        android:layout_height="fill_parent"
        android:layout_marginRight="6dip"

        android:src="@drawable/icon" />

    <LinearLayout
        android:orientation="vertical"
        android:layout_width="0dip"
        android:layout_weight="1"
        android:layout_height="fill_parent">

        <TextView
            android:layout_width="fill_parent"
            android:layout_height="0dip"
            android:layout_weight="1"

            android:gravity="center_vertical"
            android:text="My Application" />

        <TextView  
            android:layout_width="fill_parent"
            android:layout_height="0dip"
            android:layout_weight="1" 

            android:singleLine="true"
            android:ellipsize="marquee"
            android:text="Simple application that shows how to use RelativeLayout" />

    </LinearLayout>

</LinearLayout>

尽管可以通过Linearlayout实现我们所预想的结果，但是在这里存在一个优化的问题，尤其是针对为大量Items。比较RelativeLayout和LinearLayout，在资源利用上前者会占用更少的资源而达到相同的效果，以下是用RelativeLayout实现的代码：

^?[Copy to clipboard] View Code XML

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="?android:attr/listPreferredItemHeight"

    android:padding="6dip">

    <ImageView
        android:id="@+id/icon"

        android:layout_width="wrap_content"
        android:layout_height="fill_parent"

        android:layout_alignParentTop="true"
        android:layout_alignParentBottom="true"
        android:layout_marginRight="6dip"

        android:src="@drawable/icon" />

    <TextView  
        android:id="@+id/secondLine"

        android:layout_width="fill_parent"
        android:layout_height="26dip" 

        android:layout_toRightOf="@id/icon"
        android:layout_alignParentBottom="true"
        android:layout_alignParentRight="true"

        android:singleLine="true"
        android:ellipsize="marquee"
        android:text="Simple application that shows how to use RelativeLayout" />

    <TextView
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"

        android:layout_toRightOf="@id/icon"
        android:layout_alignParentRight="true"
        android:layout_alignParentTop="true"
        android:layout_above="@id/secondLine"
        android:layout_alignWithParentIfMissing="true"

        android:gravity="center_vertical"
        android:text="My Application" />

</RelativeLayout>

针对RelativeLayout有一点需要注意，因为它内部是通过多个View之间的关系而确定的框架，那么当其中某一个View因为某些需要调用GONE来完全隐藏掉后，会影响与其相关联的Views。Android为我们提供了一个属性 alignWithParentIfMissing 用于解决类似问题，当某一个View无法找到与其相关联的Views后将依据alignWithParentIfMissing的设定判断是否与父级View对齐。

下边是两种不同layout在Hierarchy Viewer中的层级关系图：

ui_layout_03