AndroidGUI21:ImageSwitcher常用技巧

ImageSwitcher ViewGroup 的派生類, ViewGroup View 的派生類。

 

ImageSwitcher 很簡單見,但在使用它的時候,有一個地方必須要注意,否則就會出現 NullPointerException 。具體情況,請見下面的例子。

 

在這個例子中,我們將大致要重複做一遍 AndroidGUI19 Gallery 常用技巧中的提到的事情。也就是說,這次我們還要用到 Gallery ,不過這次不再用 ImageView 來顯示大圖了,而是改用 ImageSwitcher 來代替它。

 

1.     創建一個 Android Project ,修改 main.xml 使之如下:

<? xml version = "1.0" encoding = "utf-8" ?>

< RelativeLayout xmlns:android = "http://schemas.android.com/apk/res/android"

    android:orientation = "vertical"

    android:layout_width = "fill_parent"

    android:layout_height = "fill_parent"

    >

   

    < ImageSwitcher

    android:id = "@+id/imageswitcher"

    android:layout_width = "match_parent"

    android:layout_height = "wrap_content"

    android:layout_alignParentTop = "true"

    />

 

         < Gallery

                   android:id = "@+id/gallery"

                   android:layout_width = "fill_parent"

                   android:layout_height = "wrap_content"

                   android:gravity = "center_vertical"

                   android:spacing = "10px"

                   android:layout_marginTop = "10px"

                   android:layout_alignParentBottom = "true"

         />

         <!--

                   android:layout_alignParentBottom="true"

                   就是讓 Gallery 位於屏幕底端, LinearLayout 不存在這個屬性

         -->

        

</ RelativeLayout >

 

2.     把項目需要用到的圖片文件拖入 res/drawable-mdpi 文件夾下,如下圖所示


 

3.     實現一個自定義的 Adapter: ImageAdapter ,代碼如下:

package com.pat.gui;

 

import android.content.Context;

import android.graphics.Color;

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 Context ctx;

        

         private int images[] =

         {

                   R.drawable.lrt01,

                   R.drawable.lrt02,

                   R.drawable.lrt03,

                   R.drawable.lrt04,

                   R.drawable.lrt05,

                   R.drawable.lrt06,

                   R.drawable.lrt07,

                   R.drawable.lrt08,

                   R.drawable.lrt09

         };

        

         public ImageAdapter(Context ctx)

         {

                   this.ctx = ctx;

         }

        

         //@Override

         public int getCount()

         {

                   return images.length;

         }

 

         //@Override

         public Object getItem(int position)

         {

                   return images[position];

         }

 

         //@Override

         public long getItemId(int position)

         {

                   return images[position];

         }

 

         //@Override

         public View getView(int position, View convertView, ViewGroup parent)

         {

                   ImageView view;

                   view = (ImageView)convertView;

                   if(view == null)

                   {

                            view = new ImageView(ctx);

                   }

                  

                   view.setImageResource(images[position]);

                   view.setScaleType(ImageView.ScaleType.CENTER_INSIDE);

                   view.setLayoutParams(new Gallery.LayoutParams(60, 60));

                   view.setBackgroundColor(Color.LTGRAY);

                  

                   return view;

         }

 

}

 

4.     實現 Activity 所對應的代碼,使之如下 ( 注意其中的粗體字部分 )

package com.pat.gui;

 

import android.app.Activity;

import android.os.Bundle;

import android.util.DisplayMetrics;

import android.view.View;

import android.view.Window;

import android.view.WindowManager;

import android.widget.AdapterView;

import android.widget.Gallery;

import android.widget.ImageSwitcher;

import android.widget.ImageView;

import android.widget.AdapterView.OnItemSelectedListener;

import android.widget.FrameLayout.LayoutParams;

import android.widget.ViewSwitcher.ViewFactory;

 

public class ControlImageSwitcher extends Activity

implements

OnItemSelectedListener, ViewFactory

{

         private Gallery gallery;

         private ImageSwitcher imageswitcher;

         private ImageAdapter adapter;

         private DisplayMetrics dm;

        

    //@Override

    public void onCreate(Bundle savedInstanceState)

    {

        super.onCreate(savedInstanceState);

        requestWindowFeature(Window.FEATURE_NO_TITLE);// 隱藏標題

        int flag = WindowManager.LayoutParams.FLAG_FULLSCREEN;  // 全屏

        this.getWindow().setFlags(flag, flag);

       

        setContentView(R.layout.main);

       

        // 得到屏幕尺寸

        dm = new DisplayMetrics();

        getWindowManager().getDefaultDisplay().getMetrics(dm);

       

        gallery = (Gallery)this.findViewById(R.id.gallery);

        imageswitcher = (ImageSwitcher)this.findViewById(R.id.imageswitcher);

       

        // 下面這句必須要,不然會使 setImageSource 這個方法指向空指針

        imageswitcher.setFactory(this);

       

        adapter = new ImageAdapter(this);

       

        gallery.setAdapter(adapter);

 

        gallery.setOnItemSelectedListener(this);

    }

 

         //@Override

         public void onItemSelected(AdapterView<?> parent, View view, int position, long id)

         {

                   int imageID = (int) adapter.getItemId(position);

                   imageswitcher.setImageResource(imageID);

         }

 

         //@Override

         public void onNothingSelected(AdapterView<?> parent)

         {

                   imageswitcher.setImageResource((int) adapter.getItemId(0));

         }

 

         //@Override

         // 接口 ViewFactory 中規定必須實現的方法,返回的 View 就是 ImageSwitcher 用於顯示圖片的 vie w

         public View makeView()

         {

                   ImageView iv = new ImageView(this);

                   // 設置背景顏色

                   iv.setBackgroundColor(0xFF646464);

                   iv.setScaleType(ImageView.ScaleType.FIT_CENTER);

                   iv.setLayoutParams(new ImageSwitcher.LayoutParams(LayoutParams.FILL_PARENT, dm.heightPixels - 70));

                   // 上面語句中 -70 的目的是應爲, ImageSwitcher 下面要顯示 Gallery ,我們在 ImageAdapter 中設定了

                   // view.setLayoutParams(new Gallery.LayoutParams(60, 60));

                   // 即高度是 60pixels ,在加在 main.xml Gallery 有下面這樣的屬性:

                   // android:layout_marginTop="10px"

                   // 因此加起來一共剛好是 70px

                  

                   return iv;

         }

}

 

運行結果:


讓下面的 Gallery 中的圖片滾動,上面的 ImageSwitcher 會顯示 Gallery 在屏幕上處於中間 ( 水平方向 ) 位置的那副圖片:


發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章