2006,ZTE Corporation.All rights reserved.,Confidential,Confidential,*,Confidential,9 Android,基本组件之常用,widget,组件介绍,(,图片视图，图片按钮，切换图片，网格视图,),程浩,9 Android基本组件之常用widget组件介绍(图片视,学习目标,掌握,Android,中常用的,widget,组件,应用,widget,组件制作自己的,UI,应用,图片视图（,ImageView,）介绍与应用,图片按钮（,ImageButton,）介绍与应用,切换图片（,ImageDwitcher&Gallery,）介绍与应用,网格视图（,GridView,）介绍与应用,学习目标 掌握Android中常用的widget组件,图片视图（,ImageView,）介绍与应用,ImageView,组件，主要作用是展示图片。,这里同样先在,main.xml,文件中添加一个按钮，用以打开演示,ImageView,组件的界面，实现代码如下：,设定完按钮后，编写响应代码：,图片视图（ImageView）介绍与应用 Imag,Button image_view_button=(Button)findViewById(R.id.,image_view_button,);,image_view_button.setOnClickListener(,image_view_button_listener,);,private,Button.OnClickListener,image_view_button_listener,=,new,Button.OnClickListener(),public,void,onClick(View v),Intent intent=,new,Intent();,intent.setClass(MainActivity.,this,ImageViewActivity.,class,);,startActivity(intent);,;,图片视图（,ImageView,）介绍与应用,Button image_view_button=(Bu,在单击按钮后，会启动一个新的,ImageViewActivity,所以这里我们应该创建一个新的,ImageViewActivity,.java,文件。实现代码如下：,public,void,onCreate(Bundle savedInstanceState),super,.onCreate(savedInstanceState);,setTitle(,是办正事，还是找乐子,);,setContentView(R.layout.,image_view,);,在上面代码我们可以看到，调用了一个,image_view.xml,的文件，所以，我们要设计一下显示的多选框的样式，对应设计代码如下：,图片视图（,ImageView,）介绍与应用,在单击按钮后，会启动一个新的ImageViewA,图片视图（,ImageView,）,图片视图（,ImageView,）介绍与应用,图片视图（ImageView）介绍与应用,图片按钮（,ImageButton,）介绍与应用,ImageButton,是可以提供一个图片按钮。,这里现在,main.xml,中添加一个按钮，单击按钮会启动这个,ImageButtonActivity,，添加,Button,的代码如下：,定义一个,id,为“,image_button_button,”的按钮，并设定其宽度和高度都是和内容自适应，并设定其显示文字为“,哥显示的是图片按钮,”。,其对应的响应代码如下：,图片按钮（ImageButton）介绍与应用 Image,Button image_button_button=(Button)findViewById(R.id.,image_button_button,);,image_button_button.setOnClickListener(,image_button_button_listener,);,private,Button.OnClickListener,image_button_button_listener,=,new,Button.OnClickListener(),public,void,onClick(View v),Intent intent=,new,Intent();,intent.setClass(MainActivity.,this,ImageButtonActivity.,class,);,startActivity(intent);,;,这里创建了一个新的,Activity,，,名字叫,ImageButtonActivity,。,同时创建,image_button.xml,的界面,UI,文件，代码见,image_button.xml,下面我们来看下,ImageButtonActivity.java,中的代码：,图片按钮（,ImageButton,）介绍与应用,Button image_button_button=(,public,void,onCreate(Bundle savedInstanceState),super,.onCreate(savedInstanceState);,setTitle(,哥显示的是图片按钮,);,setContentView(R.layout.,image_button,);,接着在,AndroidManifest.xml,中添加如下代码：,下面是项目效果图：,图片按钮（,ImageButton,）介绍与应用,public void onCreate(Bundle sa,图片按钮（,ImageButton,）,图片按钮（,ImageButton,）介绍与应用,图片按钮（ImageButton）介绍与应用,切换图片（,ImageSwitcher&Gallery,）介绍与应用,这里介绍的是,ImageSwitcher,和,Gallery,这两组件，下面的例子用来介绍这两个组件。这个例子相对比较复杂，其最终需要实现的是在屏幕的上方展示一个大图，下方是一组可以滚动的图片，其中用到了一些比较复杂的东西。和前面一样，现在,main.xml,中创建一个入口按钮，实现代码如下：,程序运行后,单击跳转到,ImageShowActivity,，该,Acvitity,用来演示,ImageSwitcher&Gallery,。首先指定其需要绑定的模板文件是,image_show.xml,，在其中添加,ImageSwitcher&Gallery,。实现代码如下：,切换图片（ImageSwitcher&Gallery）介绍与,切换图片（,ImageSwitcher&Gallery,）介绍与应用,ImageSwitcher 切换图片（ImageSwitc,然后看下,ImageShowActivity.java,的代码，首先看下它的,onCreate,方法，实现代码如下：,public,void,onCreate(Bundle savedInstanceState),super,.onCreate(savedInstanceState);,requestWindowFeature(Window.,FEATURE_NO_TITLE,);,setContentView(R.layout.,image_show,);,setTitle(,“,多方位展示我的宝贝,);,mSwitcher,=(ImageSwitcher)findViewById(R.id.,switcher,);,mSwitcher,.setFactory(,this,);,mSwitcher,.setInAnimation(AnimationUtils.,loadAnimation,(,this,android.R.anim.,fade_in,);,mSwitcher,.setOutAnimation(AnimationUtils.,loadAnimation,(,this,android.R.anim.,fade_out,);,Gallery g=(Gallery)findViewById(R.id.,gallery,);,g.setAdapter(,new,ImageAdapter(,this,);,g.setOnItemSelectedListener(,this,);,切换图片（,ImageSwitcher&Gallery,）介绍与应用,然后看下ImageShowActivity.java的代,getView,实现代码如下：,public,View getView(,int,position,View convertView,ViewGroup parent),ImageView i=,new,ImageView(,mContext,);,i.setImageResource(,mThumbIds,position);,i.setAdjustViewBounds(,true,);,i.setLayoutParams(,new,Gallery.LayoutParams(,LayoutParams.,WRAP_CONTENT,LayoutParams.,WRAP_CONTENT,);,i.setBackgroundResource(R.drawable.,picture_frame,);,return,i;,切换图片（,ImageSwitcher&Gallery,）介绍与应用,getView实现代码如下：切换图片（ImageSwitch,public,View makeView(),ImageView i=,new,ImageView(,this,);,i.setBackgroundColor(0 xFF000000);,i.setScaleType(ImageView.ScaleType.,FIT_CENTER,);,i.setLayoutParams(,new,ImageSwitcher.LayoutParams(LayoutParams.,FILL_PARENT,LayoutParams.,FILL_PARENT,);,return,i;,这个方法为,ImageSwitcher,返回了一个,View,。,ImageSwitcher,调用过程是这样的，首先要有一个,Factory,为它提供一个,View,，然后,ImageSwitcher,就可以初始化各种资源。,切换图片（,ImageSwitcher&Gallery,）介绍与应用,public View makeView()切换图片（,使用,ImageSwitcher,的注意点,注意！,在使用一个,ImageSwitcher,之前，一定要调用,setFactory,方法，否则，,setImageResource,这个方法会出现空指针异常。,ImageSwitcher,的切换效果就是由这两句实现：,g.setAdapter(,new,ImageAdapter(,this,);,g.setOnItemSelectedListener(,this,);,这里的,setInAnimation,是资源被读入到这个,ImageSwitcher,中时实现的动画效果，,setOutAnimation,是资源文件从这个,ImageSwitcher,里消失的时候要实现的动画效果，这里所有的动画都是从,Android.R,系统文件里读取的。,接着在,AndroidManifest.xml,中添加如下代码：,使用ImageSwitcher的注意点注意！,切换图片演示 切换图片演示,切换图片（,ImageSwitcher&Gallery,）演示效果,切换图片（ImageSwitcher&Gallery）演示效,GridView,是格子视图，可以将很多图片以一定的大小显示出来，在做类似相册、图片浏览