Gallery实现ViewPager的页面切换效果、以及实现图片画廊效果

最新推荐文章于 2018-05-21 11:06:08 发布

易辰_

最新推荐文章于 2018-05-21 11:06:08 发布

阅读量1.4k

点赞数

分类专栏： Android基础文章标签： ImageSwitcher makeView setScaleType Gallery AnimationUtils

本文链接：https://blog.csdn.net/u013210620/article/details/47373711

版权

Android基础专栏收录该内容

136 篇文章 1 订阅

订阅专栏

activity_main.xml

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.example.gallery.MainActivity" >

    <Gallery
        android:id="@+id/gallery"
        android:layout_width="match_parent"
        android:layout_height="fill_parent" />

</RelativeLayout>

MainActivity

package com.example.gallery;

import android.app.Activity;
import android.os.Bundle;
import android.util.DisplayMetrics;
import android.widget.Gallery;

public class MainActivity extends Activity {
	private Gallery gallery;
	private ImageAdapter adapter;
	
	// 准备数据源
	private int[] res = { R.drawable.item1, R.drawable.item2, R.drawable.item3,
			R.drawable.item4, R.drawable.item5, R.drawable.item6,
			R.drawable.item7, R.drawable.item8, R.drawable.item9,
			R.drawable.item10, R.drawable.item11, R.drawable.item12 };

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);
		gallery = (Gallery) findViewById(R.id.gallery);
		
		
		 DisplayMetrics metric = new DisplayMetrics();
	     this.getWindowManager().getDefaultDisplay().getMetrics(metric);
	     int width = metric.widthPixels;     // 屏幕宽度（像素）
	     int height = metric.heightPixels;   // 屏幕高度（像素）
		
		
		
		adapter = new ImageAdapter(res, this,width,height);
		gallery.setAdapter(adapter);

	}

}

ImageAdapter

package com.example.gallery;

import android.content.Context;
import android.util.DisplayMetrics;
import android.util.Log;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.Gallery;
import android.widget.ImageView;

public class ImageAdapter extends BaseAdapter{

	private int[]res;
	private Context context;
	
	private int width;
	private int height;
	
     
	public ImageAdapter(int []res,Context context, int width, int height)
	{
		this.res=res;
		this.context=context;
		this.width = width;
		this.height = height;
		
	
	}
	
	//返回数据源的数量
	@Override
	public int getCount() {
		return res.length;
	}

	
	@Override
	public Object getItem(int position) {
		return res[position];
	}

	@Override
	public long getItemId(int position) {
		return position;
	}

	
	@Override
	public View getView(int position, View convertView, ViewGroup parent) {
		Log.i("Main", "position="+position+"res的角标="+position%res.length);
		ImageView image=new ImageView(context);
		image.setScaleType(ImageView.ScaleType. FIT_XY);
		//w h
		 image.setLayoutParams(new Gallery.LayoutParams(width, height));
		image.setBackgroundResource(res[position]);
		return image;
	}



}

**********************************************如果需要右滑无限循环，需要做如下变更*****************************************

	// 返回数据源的数量--position无限增加
	@Override
	public int getCount() {
		return Integer.MAX_VALUE;
	}

	@Override
	public View getView(int position, View convertView, ViewGroup parent) {
		// position和角标对应
		Log.i("Main", "position=" + position + "res的角标=" + position
				% res.length);
		ImageView image = new ImageView(context);
		image.setScaleType(ImageView.ScaleType.FIT_XY);
		// w h
		image.setLayoutParams(new Gallery.LayoutParams(width, height));
		image.setBackgroundResource(res[position % res.length]);

		// 08-09 10:35:35.410: I/Main(7551): position=24res的角标=0
		// 08-09 10:35:35.510: I/Main(7551): position=25res的角标=1
		// 08-09 10:35:35.580: I/Main(7551): position=26res的角标=2
		// 08-09 10:35:35.660: I/Main(7551): position=27res的角标=3
		// 08-09 10:35:35.780: I/Main(7551): position=28res的角标=4
		// 08-09 10:35:35.910: I/Main(7551): position=29res的角标=5
		// 08-09 10:35:36.080: I/Main(7551): position=30res的角标=6
		// 08-09 10:35:36.310: I/Main(7551): position=31res的角标=7
		// 08-09 10:35:36.370: I/Main(7551): position=32res的角标=8
		// 08-09 10:35:36.410: I/Main(7551): position=33res的角标=9
		// 08-09 10:35:36.450: I/Main(7551): position=34res的角标=10
		// 08-09 10:35:36.500: I/Main(7551): position=35res的角标=11
		// 08-09 10:35:36.550: I/Main(7551): position=36res的角标=0
		return image;
	}

**********************************************Gallery滑动，点击监听，大图片展览效果***********************************

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >

    <Gallery
        android:id="@+id/gallery"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />

    <ImageSwitcher
        android:id="@+id/imageswitcher"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" >
    </ImageSwitcher>

</LinearLayout>

MainActivity

package com.example.gallery;

import android.app.Activity;
import android.os.Bundle;
import android.util.DisplayMetrics;
import android.view.View;
import android.view.animation.AnimationUtils;
import android.widget.AdapterView;
import android.widget.AdapterView.OnItemSelectedListener;
import android.widget.Gallery;
import android.widget.ImageSwitcher;
import android.widget.ImageView;
import android.widget.ImageView.ScaleType;
import android.widget.ViewSwitcher.ViewFactory;

public class MainActivity extends Activity implements OnItemSelectedListener,
		ViewFactory {
	private Gallery gallery;
	private ImageAdapter adapter;
	private ImageSwitcher imageSwitcher;
	// 准备数据源
	private int[] res = { R.drawable.item1, R.drawable.item2, R.drawable.item3,
			R.drawable.item4, R.drawable.item5, R.drawable.item6,
			R.drawable.item7, R.drawable.item8, R.drawable.item9,
			R.drawable.item10, R.drawable.item11, R.drawable.item12 };

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);
		gallery = (Gallery) findViewById(R.id.gallery);

		adapter = new ImageAdapter(res, this);
		gallery.setAdapter(adapter);
		gallery.setOnItemSelectedListener(this);

		imageSwitcher = (ImageSwitcher) findViewById(R.id.imageswitcher);
		imageSwitcher.setFactory(this);
		// 动画效果
		imageSwitcher.setInAnimation(AnimationUtils.loadAnimation(this,
				android.R.anim.fade_in));
		imageSwitcher.setOutAnimation(AnimationUtils.loadAnimation(this,
				android.R.anim.fade_out));
	}

	/**
	 * 实现抽象方法
	 */
	@Override
	public void onItemSelected(AdapterView<?> parent, View view, int position,
			long id) {
		imageSwitcher.setBackgroundResource(res[position % res.length]);
	}
	@Override
	public void onNothingSelected(AdapterView<?> parent) {

	}

	/**
	 * 缩放模式
	 *  1、 SetScaleType(ImageView.ScaleType.CENTER);
	 * 按图片的原来size居中显示，当图片长/宽超过View的长/宽，则截取图片的居中部分显示
	 *  2、
	 * SetScaleType(ImageView.ScaleType.CENTER_CROP);
	 * 按比例扩大图片的size居中显示，使得图片长(宽)等于或大于View的长(宽) 
	 *  3、
	 * setScaleType(ImageView.ScaleType.CENTER_INSIDE);
	 * 将图片的内容完整居中显示，通过按比例缩小或原来的size使得图片长/宽等于或小于View的长/宽
	 * 
	 *  4. setScaleType(ImageView.ScaleType.FIT_CENTER); 把图片按比例扩大/缩小到View的宽度，居中显示
	 *  5.、 FIT_XY 不按比例缩放图片，目1、把图片塞满整个View2、或者拉伸到制定的高度、宽度
	 */
	//创建一个用于添加到视图转换器(ViewSwitcher)中的新视图
	@Override
	public View makeView() {
		ImageView imageView = new ImageView(this);
		// 按着比例去缩放图片，并且居中显示
		imageView.setScaleType(ScaleType.FIT_CENTER);

		return imageView;
	}

}

ImageAdapter

package com.example.gallery;

import android.content.Context;
import android.util.DisplayMetrics;
import android.util.Log;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.Gallery;
import android.widget.ImageView;

public class ImageAdapter extends BaseAdapter {

	private int[] res;
	private Context context;


	public ImageAdapter(int[] res, Context context) {
		this.res = res;
		this.context = context;

	}

	// 返回数据源的数量--position无限增加
	@Override
	public int getCount() {
		return Integer.MAX_VALUE;
	}

	@Override
	public Object getItem(int position) {
		return res[position];
	}

	@Override
	public long getItemId(int position) {
		return position;
	}

	@Override
	public View getView(int position, View convertView, ViewGroup parent) {
		// position和角标对应
		Log.i("Main", "position=" + position + "res的角标=" + position
				% res.length);
		ImageView image = new ImageView(context);
		// w h
		//让position对应对应的图片即可
		image.setBackgroundResource(res[position % res.length]);
		image.setLayoutParams(new Gallery.LayoutParams(200, 200));
		//xy拉伸到200,200即可
		image.setScaleType(ImageView.ScaleType.FIT_XY);

		// 08-09 10:35:35.410: I/Main(7551): position=24res的角标=0
		// 08-09 10:35:35.510: I/Main(7551): position=25res的角标=1
		// 08-09 10:35:35.580: I/Main(7551): position=26res的角标=2
		// 08-09 10:35:35.660: I/Main(7551): position=27res的角标=3
		// 08-09 10:35:35.780: I/Main(7551): position=28res的角标=4
		// 08-09 10:35:35.910: I/Main(7551): position=29res的角标=5
		// 08-09 10:35:36.080: I/Main(7551): position=30res的角标=6
		// 08-09 10:35:36.310: I/Main(7551): position=31res的角标=7
		// 08-09 10:35:36.370: I/Main(7551): position=32res的角标=8
		// 08-09 10:35:36.410: I/Main(7551): position=33res的角标=9
		// 08-09 10:35:36.450: I/Main(7551): position=34res的角标=10
		// 08-09 10:35:36.500: I/Main(7551): position=35res的角标=11
		// 08-09 10:35:36.550: I/Main(7551): position=36res的角标=0
		return image;
	}

}