一步一步学android控件（之十） —— Gallery

本文主要是介绍一步一步学android控件（之十） —— Gallery，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

今天学习的控件是Gallery。Gallery中每个Item是center-locked，水平的滚动列表。默认使用

Theme_galleryItemBackground 作为默认背景。如果采用另外的Theme作为背景，则需要调整相应的属性。

下面做一个简单的示例：使用Gallery作为容器，显示一系列的图片（准备几张图片放到Drawable目录下），当图片被选重时，用一个动画（从小到大、从模糊到清晰）显示该图片。下图为效果图：

接来下就是一步一步实现该功能：

1、上图界面布局文件 widget_gallery_layout.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" ><Galleryandroid:id="@+id/show_images_gallery"android:layout_width="match_parent"android:layout_height="120dp" /><ImageViewandroid:id="@+id/gallery_item_big_img"android:layout_width="match_parent"android:layout_height="match_parent"android:src="@drawable/love"android:contentDescription="@string/app_name"android:scaleType="fitCenter"android:adjustViewBounds="true"android:layout_marginTop="20dp" /></LinearLayout>

Gallery用于显示一系列图片，如上图中横着的几张图片；ImageView用于当前选中的图片，如上图中下面的大图。

2、创建activity——WidgetGalleryActivity.java

package com.xy.zt.selfdefinewieget;import android.app.Activity;
import android.content.Context;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.view.animation.Animation;
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.ImageView;public class WidgetGalleryActivity extends Activity {private Gallery mGallery;ImageAdapter mImageAdapter;private ImageView mImgBig , mTmpView;Animation mFadeIn;Animation mFadeOut;@Overridepublic void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.widget_gallery_layout);init();}void init() {mFadeIn = AnimationUtils.loadAnimation(this,R.anim.fade_in);mFadeOut = AnimationUtils.loadAnimation(this,R.anim.fade_out);mImgBig = (ImageView) findViewById(R.id.gallery_item_big_img);mGallery = (Gallery) findViewById(R.id.show_images_gallery);mImageAdapter = new ImageAdapter(this);mGallery.setAdapter(mImageAdapter);mGallery.setOnItemSelectedListener(new OnItemSelectedListener(){public void onItemSelected(AdapterView<?> list, View view,int position, long id) {mTmpView = (ImageView)view.findViewById(R.id.gallery_adapter_img);mImgBig.setImageDrawable(mTmpView.getDrawable());mImgBig.setAnimation(mFadeIn);mFadeIn.start();}public void onNothingSelected(AdapterView<?> arg0) {}});mGallery.setPadding(0, 0, 0, 0);}private static class ImageAdapter extends BaseAdapter {private LayoutInflater mInflater;private int[] imgs = { R.drawable.angry_bird,R.drawable.hello_image_view, R.drawable.image_aver,R.drawable.image_run, R.drawable.love, R.drawable.loveing_gire,R.drawable.qianjing };public ImageAdapter(Context context) {mInflater = LayoutInflater.from(context);}public int getCount() {return imgs.length;}public Object getItem(int pos) {return imgs[pos];}public long getItemId(int pos) {return (pos+imgs.length)%imgs.length;}public View getView(int pos, View convertView, ViewGroup parent) {ViewHolder holder ;if(convertView == null){holder = new ViewHolder();convertView = mInflater.inflate(R.layout.gallery_image_view_item, null);convertView.setTag(holder);}else{holder = (ViewHolder)convertView.getTag();}holder.mImg = (ImageView)convertView.findViewById(R.id.gallery_adapter_img);holder.mImg.setImageResource(imgs[(int)getItemId(pos)]);return convertView;}}private static class ViewHolder{public ImageView mImg;}
}

代码中使用了一个布局文件gallery_image_view_item、动画文件fade_in（随便取名，时机效果如上所述）、ImageAdapter（创建Gallery中的每个item的View）。2.1

2.1 gallery_image_view_item 定义如下：

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"android:layout_width="200dp"android:layout_height="120dp"android:background="@color/color_blue" ><ImageViewandroid:id="@+id/gallery_adapter_img"android:layout_width="200dp"android:layout_height="wrap_content"android:layout_alignParentLeft="true"android:layout_alignParentTop="true"android:adjustViewBounds="true"android:contentDescription="@string/app_name"android:padding="5dp"android:scaleType="matrix"android:src="@drawable/image_aver"/></RelativeLayout>

2.2 fade_in 内容如下:

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"android:duration="1000" ><alphaandroid:fromAlpha="0"android:toAlpha="1" /><scaleandroid:fromXScale="0.2"android:fromYScale="0.2"android:pivotX="50%"android:pivotY="50%"android:toXScale="1"android:toYScale="1" /></set>

代码中详细内容可参见 Android动画 Tweened Animation 之 AlphaAnimation 和  Android动画 Tweened Animation 之 ScaleAnimation 。

3、主要内容已完成，下面在ViewData和WidgetsAdapter中添加如下内容以完善工程架构：

在ViewData中加入如下内容：

public static final int GALLERY_ID = IMAGE_BTN_ID + 1;public static final String GALLERY_NAME = "Gallery";
private static final ViewData mGallery = new ViewData(GALLERY_NAME, GALLERY_ID);
View_Datas.add(mGallery);

在WidgetsAdapter的handleItemClicked中加入如下事件响应代码：

case ViewData.GALLERY_ID :intent.setClass(mContext, WidgetGalleryActivity.class);mContext.startActivity(intent);break;

此处内容不清楚的参见 一步一步学android控件（之一） —— 开始篇

注：Gallery was deprecated in API level 16 

今天的内容就完成了，下一个控件 Chronometer 。

这篇关于一步一步学android控件（之十） —— Gallery的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！

---