天天看點

Android Gallery+ImageSwitch控件

Android  Gallery+ImageSwitch控件

布局可能使用相對布局要好些。

package com.gallerydemo;

import com.gallerydemoimageswitchdemo.R;

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

/***********************************
 * ImageSwitcher的使用步驟 
 * 1.設定 ImageSwitcher的背景ViewFactory的設定方法。
 * 2.設定ImageSwitcher的切換風格
 * Gallery的使用
 * 1.關聯控件
 * 2.設定資料擴充卡
 * 3.設定觸發事件
 * 推薦閱讀:Android入門第十三篇之Gallery + ImageSwitcher 

 **********************************/

public class MainActivity extends Activity {

  private ImageSwitcher imageSwitcher;
  private Gallery gallery;

  private int Images[] = new int[] { R.drawable.image1, R.drawable.image2,
      R.drawable.image3, R.drawable.image4, R.drawable.image5, };

  @Override
  protected void onCreate(Bundle savedInstanceState) {
    // TODO Auto-generated method stub
    super.onCreate(savedInstanceState);
    setContentView(R.layout.main);

    imageSwitcher = (ImageSwitcher) findViewById(R.id.imageSwitcher);
    gallery = (Gallery) findViewById(R.id.gallery);

    // 設定圖檔切換動畫  有的文章上來實作new ViewFactory()這個接口也挺好的。
    imageSwitcher.setFactory(new ViewFactory() {

      @Override
      public View makeView() {
        // TODO Auto-generated method stub
        ImageView imageView = new ImageView(MainActivity.this);

        imageView.setBackgroundColor(0xff0000);
        imageView.setScaleType(ImageView.ScaleType.FIT_XY);
        imageView.setLayoutParams(new ImageSwitcher.LayoutParams( // 這裡要小心
            LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT));
        return imageView;
      }
    });

    // 設定圖檔切換的動畫效果
    imageSwitcher.setAnimation(AnimationUtils.loadAnimation(this,
        android.R.anim.fade_in));
    imageSwitcher.setAnimation(AnimationUtils.loadAnimation(this,
        android.R.anim.fade_out));

    // 為Gallery添加資料擴充卡。這樣他就有資料源了。
    BaseAdapter adapter = new BaseAdapter() {

      @Override
      // Get a View that displays the data at the specified position in
      // the data set
      public View getView(int position, View convertView, ViewGroup parent) {
        // TODO Auto-generated method stub

        ImageView imageView = new ImageView(MainActivity.this);

        imageView.setImageResource(Images[position % Images.length]);
        // 設定顯示樣式。
        imageView.setScaleType(ImageView.ScaleType.FIT_CENTER);// 居中
        imageView.setLayoutParams(new Gallery.LayoutParams(310,280));
        imageView.setBackgroundColor(0x550000);

        return imageView; // 這裡要把新生成的image傳回
      }

      @Override
      public long getItemId(int position) {
        // TODO Auto-generated method stub
        return position;
      }

      @Override
      public Object getItem(int position) {
        // TODO Auto-generated method stub
        return position;
      }

      @Override
      public int getCount() {
        // TODO Auto-generated method stub
        return Images.length;
      }
    };

    // 綁定資料源,同時添加事件,注意添加事件的類型。
    gallery.setAdapter(adapter);
    gallery.setOnItemSelectedListener(new OnItemSelectedListener() {

      @Override//當Gallery選中項改變時觸發的事件。
      public void onItemSelected(AdapterView<?> parent, View v, int position,
          long id) {
        // TODO Auto-generated method stub
        imageSwitcher.setImageResource(Images[position%Images.length]);
      }

      @Override
      public void onNothingSelected(AdapterView<?> arg0) {
        // TODO Auto-generated method stub

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

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

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

</LinearLayout>