这节课我们进入深入人心期待已久的美图看看阅览器制作，不过是手机android版的，上节课的图片切换大师我们已经见识，现在我们来认识拖拉图片高手
Gallery
对它的理解可以理解为Listview拖动，不过换成水平
这节课两重一要
两重，实现Gallery设置图片集要使用到setAdapter（）方法，呵呵，跟listview又一样，两种方法
1.继承BaseAdapter方法
2.SimpleAdapter 前面我们使用过，得心应手啊
我们先用1方法
布局文件代码：
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/LinearLayout1"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
tools:context=".MainActivity" >
<Gallery
android:id="@+id/gallery"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
很简单，拖动大师单身出马
接下来新建一个class：
import android.content.Context;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.Gallery;
import android.widget.ImageSwitcher;
import android.widget.ImageView;
import android.widget.LinearLayout.LayoutParams;
public class GalleryAdapter extends BaseAdapter{
private int[] image=new int[]{
R.drawable.a1,R.drawable.a2,R.drawable.a3,R.drawable.a4
,R.drawable.a5,R.drawable.a6,R.drawable.a7,R.drawable.a8,R.drawable.a9};
private Context mycontext;
public GalleryAdapter(Context c){
this.mycontext=c;
}
public int getCount() {
return this.image.length;
}
@Override
public Object getItem(int position) {
// TODO Auto-generated method stub
return this.image[position];
}
@Override
public long getItemId(int position) {
// TODO Auto-generated method stub
return this.image[position];
}
@Override
//其实就是定义实现了一个转换工厂的作用，ViewFactory类似
public View getView(int position, View arg1, ViewGroup arg2) {
ImageView imageview=new ImageView(this.mycontext);
imageview.setBackgroundColor(0xFFFFFFFF);//设置背景
imageview.setScaleType(ImageView.ScaleType.CENTER);//居中
imageview.setImageResource(this.image[position]);
//自适应图片
imageview.setLayoutParams(new Gallery.LayoutParams(LayoutParams.WRAP_CONTENT,LayoutParams.WRAP_CONTENT));
return imageview;
}
}
封装成一个适配器类。现在我们可以用在MainActivity里了
public class MainActivity extends Activity {
private Gallery gallery=null;
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
this.gallery=(Gallery)super.findViewById(R.id.gallery);
this.gallery.setAdapter(new GalleryAdapter(this));
this.gallery.setOnItemClickListener(new ItemListener());
}
private class ItemListener implements OnItemClickListener{
@Override
public void onItemClick(AdapterView<?> arg0, View v, int position,
long id) {
// TODO Auto-generated method stub
Toast.makeText(MainActivity.this, String.valueOf(position), Toast.LENGTH_SHORT).show();
}
}
其实我不太明白Gallery出来被划线，难道是已经过时了？虽然不太影响使用。
这里我们定义一个方法监听到我们选择了哪些图片，用信息提示出来
显示效果如下：
实现拖动效果
现在重头戏来了，我们用第二种方法实现美图看看，在以后工作中我建议用第二种方法，符合MVC设计模式，而且一要就是java反射机制，前面的添加图片都是我们一个个打入位置名字，现实生活中不可能那么麻烦，为了方便动态取出所有图片资源java.lang.reflect.Field;必不可少，建议大家多去看看java的反射机制，这个在面试中经常考到。
还记得我们学习listview的模板，对，我们先建立一个模板用于显示图片
Grid_Layout.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:background="#FFFFFF"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<ImageView
android:id="@+id/img"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:scaleType="center"
/>
</LinearLayout>
然后是布局文件：
这里切换大师在上，拖动大师在下
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/LinearLayout1"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:gravity="bottom" //设置置于底部
android:orientation="vertical"
tools:context=".MainActivity" >
<ImageSwitcher
android:id="@+id/imageSwitcher1"
android:layout_width="fill_parent"
android:layout_height="wrap_content" >
</ImageSwitcher>
<Gallery
android:id="@+id/gallery1"
android:padding="3px"
android:layout_width="fill_parent"
android:layout_height="wrap_content" />
</LinearLayout>
MainActivity文件：
private Gallery gallery=null;
private List<Map<String,Integer>> list=new ArrayList<Map<String,Integer>>();
private SimpleAdapter simpleadapter=null;
private ImageSwitcher imageswitch=null;
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
this.initAdapter();//初始化适配器
this.gallery=(Gallery)super.findViewById(R.id.gallery1);//取得对象
this.imageswitch=(ImageSwitcher)super.findViewById(R.id.imageSwitcher1);
this.imageswitch.setBackgroundColor(Color.BLACK);
this.imageswitch.setFactory(new ViewFactoryImpl());//设置工厂
//设置图片进入进出特效动画
this.imageswitch.setInAnimation(AnimationUtils.loadAnimation(this, android.R.anim.fade_in));
this.imageswitch.setOutAnimation(AnimationUtils.loadAnimation(this, android.R.anim.fade_out));
this.gallery.setAdapter(this.simpleadapter);//设置适配器
this.gallery.setOnItemClickListener(new ItemListener());
this.gallery.setBackgroundColor(Color.BLACK);
// this.imageswitch.setImageResource(image[foot++]);
// this.previous.setOnClickListener(new Previouslistener());
// this.next.setOnClickListener(new Nextlistener());
}
private class ItemListener implements OnItemClickListener{
@Override
public void onItemClick(AdapterView<?> arg0, View arg1, int position,
long id) {
// TODO Auto-generated method stub
Map<String,Integer> map=(Map<String,Integer>)MainActivity.this.simpleadapter.getItem(position);
MainActivity.this.imageswitch.setImageResource(map.get("img"));
}
}
private class ViewFactoryImpl implements ViewFactory{
@Override
public View makeView() {
ImageView imageview=new ImageView(MainActivity.this);
imageview.setBackgroundColor(0xFFFFFFFF);//设置背景
imageview.setScaleType(ImageView.ScaleType.CENTER);//居中
//自适应图片
imageview.setLayoutParams(new ImageSwitcher.LayoutParams(LayoutParams.FILL_PARENT,LayoutParams.FILL_PARENT));
return imageview;
// TODO Auto-generated method stub
}
}
private void initAdapter() {
// TODO Auto-generated method stub
Field[] field=R.drawable.class.getDeclaredFields();//取得全部属性，反射机制动态取图
for(int i=0;i<field.length;i++){
if(field[i].getName().startsWith("a")){
Map<String,Integer> map=new HashMap<String,Integer>();
try {
map.put("img", field[i].getInt(R.drawable.class));//图片资源放入map
} catch (IllegalAccessException e) {
// TODO Auto-generated catch block
e.printStackTrace();
} catch (IllegalArgumentException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
this.list.add(map); //保存map
}
}
//使用参见listview博客
this.simpleadapter=new SimpleAdapter(this,this.list,R.layout.grid_layout,new String[]{"img"},
new int[]{R.id.img});
}
效果如下：当然大家可以看到我注释掉的代码，可以实现添加按键切换图片，这个可以使用ImageButton实现，会更好看些，美图看看是鼠标进入范围显示按钮，这个有兴趣的可以自己拓展。
<!--EndFragment-->
<!--EndFragment-->
<!--EndFragment-->
下面是一排预览，点击图片显示在中央
<!--EndFragment-->
<!--EndFragment-->