New UI-<ViewStub>标签延时加载布局

New UI-<ViewStub>标签延时加载布局

 ——转载请注明出处:coder-pig,欢迎转载,请勿用于商业用途!

小猪Android开发交流群已建立,欢迎大家加入,无论是新手,菜鸟,大神都可以,小猪一个人的

力量毕竟是有限的,写出来的东西肯定会有很多纰漏不足,欢迎大家指出,集思广益,让小猪的博文

更加的详尽,帮到更多的人,O(∩_∩)O谢谢!

小猪Android开发交流群:小猪Android开发交流群群号:421858269

新Android UI实例大全目录:http://blog.csdn.net/coder_pig/article/details/42145907

本节引言:

学习完上一节的include布局复用以后,相信大家都体会到了布局优化的好处,

不过当我们include的布局是一些复杂控件的话,而这些控件我们在实际使用

过程中又用得不多的话,往往会降低页面的加载速度;虽然,我们也可以为其设置

visibility = "gone"的属性,但是在inflate布局的时候,这些控件依旧会被inflate,

也就是说依旧会创建对象,会被实例化,设置属性等,依旧会耗费内存资源,

那么在本节中,我们就来介绍一个轻量级的view:
ViewStub

让你的布局在你需要的时候再加载(延时加载)

好了,开始本节内容~

本节正文:

什么是ViewStub?

ViewStub是一个轻量级的View,在布局中不占用任何控件,也不参加

布局的计算与绘制(又叫渲染),可以理解为控件树上的一个占位符,

仅仅是占着那个位置,没有东西,当我们需要的时候,他才会被渲染(加载)

到主界面上,这种行为也叫做延迟加载,也有人称为"惰性的include"

在什么地方使用?

当我们的app中某个布局,我们并不需要把所有的内容都展示出来,可以隐藏一些View视图,

等需要展示的时候再加载,这个时候就可以用到ViewStub了,有点类似于visibility = "gone",

但是不会随布局进行加载,使用例子如下:(点击listview的item后才加载下方的布局)

怎么用?

1)布局中加入<ViewStub标签>

<ViewStub
        android:id="@+id/stub_add"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:inflatedId="@+id/ly_add"
        android:layout="@layout/ly_test" />

三个关键属性:

①id:设置ViewStub的引用id

②inflatedId:设置加载后的布局对应的id

③layout:要加载的那个布局

ps:第二个属性是可选的,当我们的ViewStub加载后,我们就可以直接通过findViewById(R.id.~)

找到加载的那个布局的对应的对象,~是inflatedId的id!因为ViewStub只能用一次!!!!

2)在加载布局文件的Activity中:

方法一:通过findViewById找到ViewStub对象后,调用该对象的inflate()方法:

ViewStub stub = (ViewStub) findViewById(R.id.stub_add);  

stub.inflate();

方法二:通过改变ViewStub对象的visibility属性

ViewStub stub = (ViewStub) findViewById(R.id.stub_add);  

stub.setVisibility(View.VISIBLE);

上面写完后,我们如果获得加载布局的对应对象的话,则要通过findViewById(R.id.inflatedId里的id);

找到对应的布局对象了:

View ly_add = (View)findViewById(R.id.ly_add);

处了上面这种写法还,还有一种写法:

因为ViewStub加载完他引用的布局后,他会从控件树中移除,

所以如果你想对引入后的布局进行相关操作的话,那么还是拿一个View来

放着这个布局吧!所以也可以用下面这种写法:

ViewStub stub = (ViewStub) findViewById(R.id.stub_add);  

View view =  stub.inflate(); 

或者:

ViewStub stub = (ViewStub) findViewById(R.id.stub_add);  

View view = stub.setVisibility(View.VISIBLE);

好了,至于用哪种,你自己喜欢了!

使用ViewStub要注意的地方:

1)ViewStub只能inflate一次,之后ViewStub对象会被置空所以在编写代码

的时候,就不要使用生命周期很长的变量来引用ViewStub控件了,按照上面的教的写法即可!

2)ViewStub加载的只能是布局文件的id,而非某个View

代码示例:

从"惰性include"这个别名,我们就可以知道ViewStub和include其实是类似的

不过前者并不随着布局的渲染和渲染,而是,在我们Inflate或设置Visibility为VISIBLE时

才渲染,而且只用一次,针对的是一次性的东西,在ListView那里用得较多,

当然见仁见智,这里就演示下简单的用法吧:

效果图:

报错结束了,恩,别着急,先贴下代码:

actvitiy_main.xml:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/LinearLayout1"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context="com.jay.example.test.MainActivity" >

    <Button
        android:id="@+id/btnLoad"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="加载ViewStub" />

    <Button
        android:id="@+id/btnHide"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="隐藏加载的布局" />

    <Button
        android:id="@+id/btnShow"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="显示加载的布局" />

    <ViewStub
        android:id="@+id/stub_add"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_gravity="center"
        android:inflatedId="@+id/ly_add"
        android:layout="@layout/ly_test" />

</LinearLayout>

引入的布局:ly_test.xml:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/LinearLayout1"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context="com.jay.example.test.MainActivity"
    android:gravity="center">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@drawable/back"
        android:text="用于测试的ViewStub引入的布局"
        android:textColor="#FFFFFF"
        android:gravity="center_vertical"
        android:textSize="18sp"/>
</LinearLayout>

MainActivity.java中的代码:

package com.jay.example.test;

import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.ViewStub;
import android.widget.Button;

public class MainActivity extends Activity {

	private Button btnLoad;
	private Button btnHide;
	private Button btnShow;
	private MyClick myClick;
	private ViewStub viewStub;
	private View view;

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);
		findViews();
		setUpViews();
	}

	private void findViews() {
		btnLoad = (Button) findViewById(R.id.btnLoad);
		btnHide = (Button) findViewById(R.id.btnHide);
		btnShow = (Button) findViewById(R.id.btnShow);
	}

	private void setUpViews() {
		myClick = new MyClick();
		btnLoad.setOnClickListener(myClick);
		btnHide.setOnClickListener(myClick);
		btnShow.setOnClickListener(myClick);
	}

	private class MyClick implements OnClickListener {
		@Override
		public void onClick(View v) {
			switch (v.getId()) {
			case R.id.btnLoad:
				viewStub = (ViewStub) findViewById(R.id.stub_add);
				view = viewStub.inflate();
				break;
			case R.id.btnHide:
				view.setVisibility(View.INVISIBLE);
				break;
			case R.id.btnShow:
				view.setVisibility(View.VISIBLE);
				break;
			}
		}
	}

}

代码分析:

代码很简单,要说的问题就是为什么两次加载ViewStub会报错,而且还报了

NullPointerException,这是因为ViewStub只能够inflate一次,用完就没咯

所以后面实现的隐藏和显示的实现就是控制——引入的布局对象!!!

最后说两句:

关于这个ViewStub的使用很简单但也很重要,可能你现在不觉得,但慢慢界面上控件多了,

就知道了,厚积薄发!加油~

本节参考文献:

http://www.cnblogs.com/plokmju/p/android_viewstub.html

http://blog.csdn.net/mayingcai1987/article/details/6238609

http://blog.csdn.net/hitlion2008/article/details/6737537

https://developer.android.com/reference/android/view/ViewStub.html

时间: 2024-11-05 07:11:01

New UI-<ViewStub>标签延时加载布局的相关文章

从setContentView方法分析Android加载布局流程

PS一句:当初你所逃避的问题终会在未来的某一天重新出现在你面前,因此,当你第一次遇到它时,请不要逃避. 相信很多初学者对XML布局怎么加载到Activity上并且显示在手机屏幕上很好奇吧?今天我们就从经常使用的方法 setContentView来从源码分析一下XML布局是怎么加载到当前Activity上的. Activity#setContentView 我们知道,Activity是在onCreate方法中使用setContentView方法来加载布局的,那么它内部的源码是怎么实现的呢? Set

jquery实现的图片延时加载插件

jquery实现的图片延时加载插件: 在很多网站尤其是图片站,都采用了图片延时加载效果,这样可以有效的减轻服务器的压力,有点自然不言而喻了,下面就和大家分享一个图片延时加载的插件,希望能够给大家带来一定的帮助. 代码如下: <script type="text/javascript"> (function( $ ){ $.fn.imglazyload=function( options ) { var o=$.extend({ attr:'lazy-src', contai

Android四大组件之Activity(活动)及其布局的创建与加载布局

Android四大组件之Activity(活动)及其布局的创建与加载布局 什么是Activity ? 活动(Activity)是包含用户界面的组件,主要用于和用户进行交互的,一个应用程序中可以包含零个或多个活动. 手动创建Activity的过程详解 到现在为止,你还没有手动创建过活动呢,在第一个安卓工程中,HelloWorldActivity是ADT帮我们创建的,手动创建活动可以加深我们的理解,因此现在是时候应该自己动手了. 首先,你需要再新建一个 Android 项目,项目名可以叫做 Acti

MyBatis入门(五)---延时加载、缓存

一.创建数据库 1.1.建立数据库 /* SQLyog Enterprise v12.09 (64 bit) MySQL - 5.7.9-log : Database - mybatis ********************************************************************* */ /*!40101 SET NAMES utf8 */; /*!40101 SET SQL_MODE=''*/; /*!40014 SET @[email protec

延时加载 懒加载

1. strong 用于一般对象 weak 用于UI对象 assign 用于结构型 %02d 整数保存2位,不够的前面补0 重复代码封装抽取,把重复的东西抽取出来写到函数中,把不同的东西作为参数 /** */ 文档注释 2. 数据的延时加载(懒加载)(将属性放在get方法中初始化的方式),用到时再加载,添加get方法 -(NSArray *)array { if(_array == nil)//从未被初始化 { //初始化数据} return _array } 如果第一次加载的方式是_array

js 的延时加载

最近,由于项目中引用到的脚本比较多,页面首次加载速度有些慢,于是进行了一些优化 用到的是延时加载技术,大概思路就是减少页面的<script>标签,并依靠lazyload.js延时加载相应的脚本文件. 首先,要先引用lazyload.js ,这是一个老外写的脚本,我放到了公司的图片服务器上,大家可以直接访问  http://img.fang.com/rent/image/rent/js/lazyload.js 实践之前,先来看一下它的使用文档 // Load a single JavaScrip

图片延时 加载原理 及应用

关于 图片延时加载的基本理论: 当我们浏览一个页面时,我们有时候并不会看完一个网页的所有内容,那么我们在客户不浏览完所有内容的情况下,加载完所有的图片就会浪费流量,而且也会影响到网页的加载时间.为了解决这个问题,我们就设计了一种图片延时加载的机制,即当用户将页面快滑到图片的时候,我们开始加载图片,这样既省了流量,而且也不影响用户的体验 下面 我就多篇延时加载举一个例子 首先,我们创建所需的HTML标签及样式 <style type="text/css"> body, div

New UI-纯Java代码加载布局

New UI-纯Java代码加载布局  --转载请注明出处:coder-pig,欢迎转载,请勿用于商业用途! 小猪Android开发交流群已建立,欢迎大家加入,无论是新手,菜鸟,大神都可以,小猪一个人的 力量毕竟是有限的,写出来的东西肯定会有很多纰漏不足,欢迎大家指出,集思广益,让小猪的博文 更加的详尽,帮到更多的人,O(∩_∩)O谢谢! 小猪Android开发交流群:小猪Android开发交流群群号:421858269 新Android UI实例大全目录:http://blog.csdn.ne

jquery插件图片延时加载实例详解(转)

jquery插件图片延时加载实例详解 效果预览:http://keleyi.com/keleyi/phtml/image/index.htm 使用方法:1.导入JS插件 <script src="http://keleyi.com/keleyi/pmedia/jquery-1.9.1.min.js" type="text/javascript"></script> <script src="http://keleyi.com/