我的Android进阶之旅------>Android之Gallery和GridView两种方式与ImageSwitcher实现带预览的和幻灯片方式的两种图片浏览器

一、简介

a.GridView（网络视图）的功能和用法

b.ImageSwitcher（图形切换器）的功能和用法

c.Gallery（画廊视图）的功能和用法

二、通过一个实例来学习Gallery、GridView和ImageSwitcher

step1:新建一个项目MyGridViewAndGallery

三:我们先写用GridView和ImageSwitcher实现

step1:设计所需的UI界面

a. /layout/gridview.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:gravity="center"
    >
   <GridView
	    android:id="@+id/grid01"
	    android:layout_width="fill_parent"
	    android:layout_height="wrap_content"
	    android:horizontalSpacing="2pt"
	    android:verticalSpacing="2pt"
	    android:numColumns="4"
	    android:gravity="center"
    />
    <ImageSwitcher
	    android:id="@+id/switcher"
	    android:layout_width="match_parent"
	    android:layout_height="match_parent"
	    android:layout_gravity="center_horizontal"
    />
</LinearLayout>

b. 每个单元格的UI界面 /layout/cell.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">

  <ImageView
  		android:id="@+id/image1"
 		android:layout_width="50dp"
	    android:layout_height="50dp"
	    android:layout_gravity="center_horizontal"/>
</LinearLayout>

step2:MyGridViewActivity.java

package cn.roco.gridview;

import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;

import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.view.ViewGroup.LayoutParams;
import android.view.animation.AnimationUtils;
import android.widget.AdapterView;
import android.widget.AdapterView.OnItemClickListener;
import android.widget.AdapterView.OnItemSelectedListener;
import android.widget.GridView;
import android.widget.ImageSwitcher;
import android.widget.ImageView;
import android.widget.SimpleAdapter;
import android.widget.ViewSwitcher.ViewFactory;

public class MyGridViewActivity extends Activity {

	int[] imageIDs = new int[] { R.drawable.beautiful_001,
			R.drawable.beautiful_002, R.drawable.beautiful_003,
			R.drawable.beautiful_004, R.drawable.beautiful_005,
			R.drawable.beautiful_006, R.drawable.beautiful_007,
			R.drawable.beautiful_008, R.drawable.beautiful_009,
			R.drawable.beautiful_010, R.drawable.beautiful_011,
			R.drawable.beautiful_012, R.drawable.beautiful_013 };

	/** Called when the activity is first created. */
	@Override
	public void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.gridview);

		List<Map<String, Object>> listItems = new ArrayList<Map<String, Object>>();
		for (int i = 0; i < imageIDs.length; i++) {
			Map<String, Object> listItem = new HashMap<String, Object>();
			listItem.put("image", imageIDs[i]);
			listItems.add(listItem);
		}
		//获取显示拖的ImageSwitcher
		final ImageSwitcher switcher = (ImageSwitcher) findViewById(R.id.switcher);
		// 设置图片切换的动画效果
		switcher.setInAnimation(AnimationUtils.loadAnimation(this,
				android.R.anim.fade_in));
		switcher.setOutAnimation(AnimationUtils.loadAnimation(this,
				android.R.anim.fade_out));

		// 为ImageSwitch设置图片切换的图片
		switcher.setFactory(new ViewFactory() {
			@Override
			public View makeView() {
				ImageView imageView = new ImageView(MyGridViewActivity.this);
				imageView.setBackgroundColor(0xff0000);
				imageView.setScaleType(ImageView.ScaleType.FIT_CENTER);
				imageView.setLayoutParams(new ImageSwitcher.LayoutParams(
						LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT));
				return imageView;
			}
		});
		//创建一个SimpleAdapter
		//使用    /layout/cell.xml作为界面布局
		SimpleAdapter simpleAdapter = new SimpleAdapter(this, listItems,
				R.layout.cell, new String[] { "image" },
				new int[] { R.id.image1 });
		GridView gridView = (GridView) findViewById(R.id.grid01);
		//为 GridView设置 simpleAdapter
		gridView.setAdapter(simpleAdapter);

		// 处理被选中事件
		gridView.setOnItemSelectedListener(new OnItemSelectedListener() {
			@Override
			public void onItemSelected(AdapterView<?> parent, View view,
					int position, long id) {
				// 显示当前被选中的图片
				switcher.setImageResource(imageIDs[position % imageIDs.length]);
			}

			@Override
			public void onNothingSelected(AdapterView<?> parent) {
			}
		});
		// 处理被点击事件
		gridView.setOnItemClickListener(new OnItemClickListener() {
			@Override
			public void onItemClick(AdapterView<?> parent, View view,
					int position, long id) {
				// 显示被单击的图片
				switcher.setImageResource(imageIDs[position % imageIDs.length]);
			}
		});
	}
}

四:用Gallery和ImageSwitch实现幻灯片方式的图片浏览器

step1:设计UI界面 /layout/gallery.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:gravity="center"
    >
    <ImageSwitcher
	    android:id="@+id/gallerySwitcher"
	    android:layout_width="320dp"
	    android:layout_height="320dp"
    />

    <Gallery android:id="@+id/gallery"
    	android:layout_width="fill_parent"
    	android:layout_height="wrap_content"
    	android:layout_marginTop="25dp"
    	android:unselectedAlpha="0.6"
    	android:spacing="3dp"
    />
</LinearLayout>

step2:MyGralleryActivity.java

package cn.roco.gridview;

import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.view.ViewGroup;
import android.view.ViewGroup.LayoutParams;
import android.view.animation.AnimationUtils;
import android.widget.AdapterView;
import android.widget.AdapterView.OnItemSelectedListener;
import android.widget.BaseAdapter;
import android.widget.Gallery;
import android.widget.ImageSwitcher;
import android.widget.ImageView;
import android.widget.ViewSwitcher.ViewFactory;

public class MyGralleryActivity extends Activity {

	int[] imageIDs = new int[] { R.drawable.beautiful_001,
			R.drawable.beautiful_002, R.drawable.beautiful_003,
			R.drawable.beautiful_004, R.drawable.beautiful_005,
			R.drawable.beautiful_006, R.drawable.beautiful_007,
			R.drawable.beautiful_008, R.drawable.beautiful_009,
			R.drawable.beautiful_010, R.drawable.beautiful_011,
			R.drawable.beautiful_012, R.drawable.beautiful_013 };

	/** Called when the activity is first created. */
	@Override
	public void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.gallery);
		final Gallery gallery = (Gallery) findViewById(R.id.gallery);
		final ImageSwitcher switcher = (ImageSwitcher) findViewById(R.id.gallerySwitcher);
		// 为ImageSwitch设置图片切换的图片
		switcher.setFactory(new ViewFactory() {
			@Override
			public View makeView() {
				ImageView imageView = new ImageView(MyGralleryActivity.this);
				imageView.setBackgroundColor(0xff0000);
				imageView.setScaleType(ImageView.ScaleType.FIT_CENTER);
				imageView.setLayoutParams(new ImageSwitcher.LayoutParams(LayoutParams.WRAP_CONTENT,
						LayoutParams.WRAP_CONTENT));
				return imageView;
			}
		});
		// 设置图片切换的动画效果
		switcher.setInAnimation(AnimationUtils.loadAnimation(this,
				android.R.anim.fade_in));
		switcher.setOutAnimation(AnimationUtils.loadAnimation(this,
				android.R.anim.fade_out));
		//创建一个 BaseAdapter对象，该对象负责提供 Gallery所显示的每张图片
		BaseAdapter adapter = new BaseAdapter() {
			@Override
			public View getView(int position, View convertView, ViewGroup parent) {
				ImageView imageView = new ImageView(MyGralleryActivity.this);
				imageView
						.setImageResource(imageIDs[position % imageIDs.length]);
				imageView.setScaleType(ImageView.ScaleType.FIT_XY);
				imageView.setLayoutParams(new Gallery.LayoutParams(75,100));
				return imageView;
			}

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

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

			@Override
			public int getCount() {
				return imageIDs.length;
			}
		};

		gallery.setAdapter(adapter);

		// 处理被选中事件
		gallery.setOnItemSelectedListener(new OnItemSelectedListener() {
			@Override
			public void onItemSelected(AdapterView<?> parent, View view,
					int position, long id) {
				// 显示当前被选中的图片
				switcher.setImageResource(imageIDs[position % imageIDs.length]);
			}

			@Override
			public void onNothingSelected(AdapterView<?> parent) {
			}
		});
	}
}

五、用TabHost将两种方式的图片浏览器展现出来

MyIntentTab.java

package cn.roco.gridview;

import android.app.TabActivity;
import android.content.Intent;
import android.os.Bundle;
import android.view.Window;
import android.view.WindowManager;
import android.widget.TabHost;

public class MyIntentTab extends TabActivity {
	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);

		getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN,
				WindowManager.LayoutParams.FLAG_FULLSCREEN); //请求全屏
		getWindow().requestFeature(Window.FEATURE_NO_TITLE); //请求没有标题栏

		TabHost tabhost = getTabHost();
		//使用Intent添加到第一个Tab页面
		tabhost.addTab(tabhost.newTabSpec("Grallery").setIndicator("Grallery")
				.setContent(new Intent(this, MyGralleryActivity.class)));
		//使用Intent添加到第二个Tab页面
		tabhost.addTab(tabhost.newTabSpec("GridView").setIndicator("GridView")
				.setContent(new Intent(this, MyGridViewActivity.class)));
	}
}

六、AndroidManifest.xml

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
      package="cn.roco.gridview"
      android:versionCode="1"
      android:versionName="1.0">
    <uses-sdk android:minSdkVersion="8" />

    <application android:icon="@drawable/icon" android:label="@string/app_name">
        <activity android:name=".MyIntentTab"
                  android:label="@string/app_name">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />
                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
	<activity android:name=".MyGralleryActivity"/>
	<activity android:name=".MyGridViewActivity"/>
    </application>
</manifest>

七、部署应用到模拟器上，查看运行效果

a.幻灯片方式的图片浏览器

b.带图片预览的图片浏览器

==================================下面看一个gif动画===========================================

本文源代码可以在以下地址进行免费下载

==================================================================================================

作者：欧阳鹏欢迎转载，与人分享是进步的源泉！

转载请保留原文地址：http://blog.csdn.net/ouyang_peng

==================================================================================================

时间： 2024-10-29 12:53:19

我的Android进阶之旅------>Android之Gallery和GridView两种方式与ImageSwitcher实现带预览的和幻灯片方式的两种图片浏览器的相关文章

我的Android进阶之旅------&gt;android之向Gallery中添加倒影3D效果

在上一篇Android之Gallery和GridView两种方式与ImageSwitcher实现带预览的和幻灯片方式的两种图片浏览器后,偶然看到了一些介绍Gallery 3D效果的事例,学习了一下,现在将事例写出来,供大家分享. 大家可看http://blog.csdn.net/leehong2005/article/details/8070538和http://android.tgbus.com/Android/tutorial/201108/362438.shtm

我的Android进阶之旅------&gt;Android颜色值(RGB)所支持的四种常见形式

Android中颜色值是通过红(Red).绿(Green).蓝(Blue)三原色,以及一个透明度(Alpha)值来表示的,颜色值总是以井号(#)开头,接下来就是Alpha-Red-Green-Blue的形式.其中Alpha值可以省略,如果省略了Alpha的值,那么该颜色默认是完全不透明的. Android的颜色值支持常见的四种形式如下所示: #RGB:分别指定红.绿.蓝三原色的值(只支持0~f这16级颜色)来代表颜色. #ARGB:分别指定红.绿.蓝三原色的值(只支持0~f这16级颜色)及透明度

我的Android进阶之旅------&gt;Android利用温度传感器实现带动画效果的电子温度计

要想实现带动画效果的电子温度计,需要以下几个知识点: 1.温度传感器相关知识. 2.ScaleAnimation动画相关知识,来进行水印刻度的缩放效果. 3.android:layout_weight属性的合理运用,关于android:layout_weight属性的讲解,可以参考:<我的Android进阶之旅------>关于android:layout_weight属性的一个面试题> 地址为:http://blog.csdn.net/ouyang_peng/article/

我的Android进阶之旅------&gt;Android疯狂连连看游戏的实现之状态数据模型(三)

对于游戏玩家而言,游戏界面上看到的"元素"千变万化:但是对于游戏开发者而言,游戏界面上的元素在底层都是一些数据,不同数据所绘制的图片有所差异而已.因此建立游戏的状态数据模型是实现游戏逻辑的重要步骤. 1.定义数据模型连连看的界面是一个NxM的"网格",每个网格上显示一张图片.而这个网格只需要一个二维数组来定义即可,而每个网格上所显示的图片,对于底层数据模型来说,不同的图片对于着不同的数值即可. 对于上图所示的数据模型,只要让数值为0的网格上不绘制图片,其他数值的网

我的Android进阶之旅------&gt;Android疯狂连连看游戏的实现之开发游戏界面(二)

连连看的游戏界面十分简单,大致可以分为两个区域: 游戏主界面区控制按钮和数据显示区 1.开发界面布局本程序使用一个RelativeLayout作为整体的界面布局元素,界面布局上面是一个自定义组件,下面是一个水平排列的LinearLayout. 下面是本程序的布局文件:/res/layout/main.xml <?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android=

我的Android进阶之旅------&gt;Android疯狂连连看游戏的实现之加载界面图片和实现游戏Activity(四)

正如在<我的Android进阶之旅------>Android疯狂连连看游戏的实现之状态数据模型(三)>一文中看到的,在AbstractBoard的代码中,当程序需要创建N个Piece对象时,程序会直接调用ImageUtil的getPlayImages()方法去获取图片,该方法会随机从res/drawable目录中取得N张图片. 下面是res/drawable目录视图: 为了让getPlayImages()方法能随机从res/drawable目录中取得N张图片,具体实现分为以下几步: 通

我的Android进阶之旅------&gt; Android为TextView组件中显示的文本添加背景色

通过上一篇文章我的Android进阶之旅------> Android在TextView中显示图片方法 (地址:http://blog.csdn.net/ouyang_peng/article/details/46916963) 我们学会了在TextView中显示图片的方法,现在我们来学习如何为TextView组件中显示的文本添加背景色.要求完成的样子如图所示: 首先来学习使用BackgroundColorSpan对象设置文字背景色,代码如下: TextView textView=(

我的Android进阶之旅------&gt;Android权限参考大全

访问登记属性 android.permission.ACCESS_CHECKIN_PROPERTIES ,读取或写入登记check-in数据库属性表的权限获取错略位置 android.permission.ACCESS_COARSE_LOCATION,通过WiFi或移动基站的方式获取用户错略的经纬度信息,定位精度大概误差在30~1500米获取精确位置 android.permission.ACCESS_FINE_LOCATION,通过GPS芯片接收卫星的定位信息,定位精度达10米以内访问定

我的Android进阶之旅------&gt;Android颜色值（#AARRGGBB）透明度百分比和十六进制对应关系以及计算方法

我的Android进阶之旅-->Android颜色值(RGB)所支持的四种常见形式透明度百分比和十六进制对应关系表格透明度十六进制 100% FF 99% FC 98% FA 97% F7 96% F5 95% F2 94% F0 93% ED 92% EB 91% E8 90% E6 89% E3 88% E0 87% DE 86% DB 85% D9 84% D6 83% D4 82% D1 81% CF 80% CC 79% C9 78% C7 77% C4 76% C2 75% B

我的Android进阶之旅------&gt;Android之Gallery和GridView两种方式与ImageSwitcher实现带预览的和幻灯片方式的两种图片浏览器

我的Android进阶之旅------&gt;Android之Gallery和GridView两种方式与ImageSwitcher实现带预览的和幻灯片方式的两种图片浏览器的相关文章

我的Android进阶之旅------>Android之Gallery和GridView两种方式与ImageSwitcher实现带预览的和幻灯片方式的两种图片浏览器

我的Android进阶之旅------>Android之Gallery和GridView两种方式与ImageSwitcher实现带预览的和幻灯片方式的两种图片浏览器的相关文章