ViewStub和include布局使用(官方文档)

转载 2016年08月29日 15:59:10

Loading Views On Demand

Sometimes your layout might require complex views that are rarely used. Whether they are item details, progress indicators, or undo messages, you can reduce memory usage and speed up rendering by loading the views only when they are needed.

Define a ViewStub


ViewStub is a lightweight view with no dimension and doesn’t draw anything or participate in the layout. As such, it's cheap to inflate and cheap to leave in a view hierarchy. Each ViewStub simply needs to include the android:layout attribute to specify the layout to inflate.

The following ViewStub is for a translucent progress bar overlay. It should be visible only when new items are being imported into the application.

<ViewStub
    android:id="@+id/stub_import"
    android:inflatedId="@+id/panel_import"
    android:layout="@layout/progress_overlay"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_gravity="bottom" />

Load the ViewStub Layout


When you want to load the layout specified by the ViewStub, either set it visible by calling setVisibility(View.VISIBLE) or call inflate().

((ViewStub) findViewById(R.id.stub_import)).setVisibility(View.VISIBLE);
// or
View importPanel = ((ViewStub) findViewById(R.id.stub_import)).inflate();

Note: The inflate() method returns the inflated View once complete. so you don't need to call findViewById() if you need to interact with the layout.

Once visible/inflated, the ViewStub element is no longer part of the view hierarchy. It is replaced by the inflated layout and the ID for the root view of that layout is the one specified by the android:inflatedId attribute of the ViewStub. (The ID android:id specified for the ViewStub is valid only until theViewStub layout is visible/inflated.)

Note: One drawback of ViewStub is that it doesn’t currently support the <merge> tag in the layouts to be inflated.

Re-using Layouts with <include/>

Reusing layouts is particularly powerful as it allows you create reusable complex layouts. For example, a yes/no button panel, or custom progress bar with description text. It also means that any elements of your application that are common across multiple layouts can be extracted, managed separately, then included in each layout. So while you can create individual UI components by writing a custom View, you can do it even more easily by re-using a layout file.Although Android offers a variety of widgets to provide small and re-usable interactive elements, you might also need to re-use larger components that require a special layout. To efficiently re-use complete layouts, you can use the <include/> and <merge/> tags to embed another layout inside the current layout.

Create a Re-usable Layout


If you already know the layout that you want to re-use, create a new XML file and define the layout. For example, here's a layout from the G-Kenya codelab that defines a title bar to be included in each activity (titlebar.xml):

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@color/titlebar_bg">

    <ImageView android:layout_width="wrap_content"
               android:layout_height="wrap_content"
               android:src="@drawable/gafricalogo" />
</FrameLayout>

The root View should be exactly how you'd like it to appear in each layout to which you add this layout.

Use the <include> Tag


Inside the layout to which you want to add the re-usable component, add the <include/> tag. For example, here's a layout from the G-Kenya codelab that includes the title bar from above:

Here's the layout file:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@color/app_bg"
    android:gravity="center_horizontal">

    <include layout="@layout/titlebar"/>

    <TextView android:layout_width="match_parent"
              android:layout_height="wrap_content"
              android:text="@string/hello"
              android:padding="10dp" />

    ...

</LinearLayout>

You can also override all the layout parameters (any android:layout_* attributes) of the included layout's root view by specifying them in the<include/> tag. For example:

<include android:id="@+id/news_title"
         android:layout_width="match_parent"
         android:layout_height="match_parent"
         layout="@layout/title"/>

However, if you want to override layout attributes using the <include> tag, you must override both android:layout_height and android:layout_widthin order for other layout attributes to take effect.

Use the <merge> Tag


The <merge /> tag helps eliminate redundant view groups in your view hierarchy when including one layout within another. For example, if your main layout is a vertical LinearLayout in which two consecutive views can be re-used in multiple layouts, then the re-usable layout in which you place the two views requires its own root view. However, using another LinearLayout as the root for the re-usable layout would result in a vertical LinearLayout inside a vertical LinearLayout. The nested LinearLayout serves no real purpose other than to slow down your UI performance.

To avoid including such a redundant view group, you can instead use the <merge> element as the root view for the re-usable layout. For example:

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

    <Button
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:text="@string/add"/>

    <Button
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:text="@string/delete"/>

</merge>

Now, when you include this layout in another layout (using the <include/> tag), the system ignores the <merge> element and places the two buttons directly in the layout, in place of the <include/> tag.


相关文章推荐

Android Studio官方文档之使用布局编辑器来设计UI界面

Android Studio官方文档之使用布局编辑器来设计UI界面 Android Studio中提供了一个高级的布局编辑器,它可以使你直接向布局中拖放现成的组件和提前预览你正在编辑的布局的样式。在这...

Android布局优化之Merge、Include、ViewStub使用与源码分析

在开发中UI布局是我们都会遇到的问题,随着UI越来越多,布局的重复性、复杂度也会随之增长。Android官方给了几个优化的方法,但是网络上的资料基本上都是对官方资料的翻译,这些资料都特别的简单,经常会...

Android抽象布局——include、merge 、ViewStub的使用

在布局优化中,Androi的官方提到了这三种布局、、,并介绍了这三种布局各有的优势,下面也是简单说一下他们的优势,以及怎么使用,记下来权当做笔记。 1、布局重用 标签能够重用布局文...
  • jzysf
  • jzysf
  • 2014年08月10日 10:23
  • 403

Android布局优化之ViewStub、include、merge使用与源码分析

http://blog.csdn.net/bboyfeiyu/article/details/45869393 在开发中UI布局是我们都会遇到的问题,随着UI越来越多,布局的重复性、复杂...
  • jdsjlzx
  • jdsjlzx
  • 2015年05月21日 10:47
  • 1480

Android布局优化之ViewStub、include、merge使用与源码分析

在开发中UI布局是我们都会遇到的问题,随着UI越来越多,布局的重复性、复杂度也会随之增长。 首先用得最多的应该是include,按照官方的意思,include就是为了解决重复定义相同布局的...

Android布局优化之Merge Include ViewStub使用与源码分析

原文地址:http://www.it165.net/pro/html/201409/22192.html 在开发中UI布局是我们都会遇到的问题,随着UI越来越多,布局的重复性、复杂度也会随之增长。A...

使用include、merge、ViewStub优化布局

在布局优化中,Androi的官方提到了这三种布局include、merge、ViewStub下面我们对这三种布局的使用和注意事项进行说明:include 标签include标签是xml布局重用的利器,...
  • Todo_
  • Todo_
  • 2016年03月25日 09:33
  • 686

布局优化-使用include和merge及viewstub

其实标签在UI的结构优化中起着非常重要的作用,通过它可以删减多余的层级,达到优化UI的目的。   根节点和LinearLayout上面那个子树为android的窗口布局,后面的TextView即为...

Android布局优化之include、merge、ViewStub的使用

转载自:Android布局优化之include、merge、ViewStub的使用 讲的比较详细,值得阅读 下面是原文: 本文针对include、merge、ViewStub三个标签如何...

android开发之布局优化之include、ViewStub、merge使用与源码分析

在开发中UI布局是我们都会遇到的问题,随着UI越来越多,布局的重复性、复杂度也会随之增长。Android官方给了几个优化的方法,但是网络上的资料基本上都是对官方资料的翻译,这些资料都特别的简单,经常会...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:ViewStub和include布局使用(官方文档)
举报原因:
原因补充:

(最多只允许输入30个字)