2011-05-02

在 Android 裡使用 Gallery

在看過 AdapterView 裡的 ListView, GridView Spinner 後,只剩下 Gallery 最後一位成員。

Gallery 的特色就是水平方向 scroll 清單,選定的子元件置中對齊,目前看來 Gallery 都是用 ImageView 作為子元件。


XML layout 設定如下:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    >
    <Gallery
        android:id="@+id/gallery"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        />
    <ImageView
        android:id="@+id/img"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        />
</LinearLayout>
另外使用一個 ImageView 用來顯示被選取的 Gallery 照片。

還有一個位於 res/values/attrs.xml 的 XML 設定檔:
<resources>
    <declare-styleable name="A_Gallery">
        <attr name="android:galleryItemBackground" />
    </declare-styleable>
</resources>
Activity 程式如下:
public class A_Gallery extends Activity {

    private Integer[] icons = new Integer[] {
            R.drawable.wanwan_01, R.drawable.wanwan_02, R.drawable.wanwan_03,
            R.drawable.wanwan_04, R.drawable.wanwan_05, R.drawable.wanwan_06,
            R.drawable.wanwan_07, R.drawable.wanwan_08, R.drawable.wanwan_09,
            R.drawable.wanwan_10, R.drawable.wanwan_11, R.drawable.wanwan_12,
            R.drawable.wanwan_13, R.drawable.wanwan_14, R.drawable.wanwan_15,
            R.drawable.wanwan_16, R.drawable.wanwan_17, R.drawable.wanwan_18
    };
    private int galleryItemBackground;

    private A_Gallery() {
        super();
        // Gallery 預設使用 Theme_galleryItemBackground 作為
        // 每個 View 子元件(也就是每個 ImageView)的背景
        // 如果不要用 Theme_galleryItemBackgroun,得一併修改 Gallery 的一些屬性
        // TODO 奇怪的使用方法,留著以後再研究
        TypedArray a = obtainStyledAttributes(R.styleable.A_Gallery);
        this.galleryItemBackground = a.getResourceId(
                R.styleable.A_Gallery_android_galleryItemBackground, 0);
        // 一定要 recycle!
        a.recycle();
    }

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);

        Gallery gallery = (Gallery) this.findViewById(R.id.gallery);
        // 當點擊 Gallery 裡的每張照片時,將該照片顯示到 Gallery 下方的 ImageView 裡
        final ImageView iv = (ImageView) this.findViewById(R.id.img);
        gallery.setOnItemClickListener(new OnItemClickListener() {

            @Override
            public void onItemClick(AdapterView<?> parent, View view,
                    int position, long id) {
                iv.setImageResource(icons[position]);
                // 一樣使用 Gallery 子元件的背景
                iv.setBackgroundResource(galleryItemBackground);
            }
        });
        // 自訂 ImageAdapter
        gallery.setAdapter(new BaseAdapter() {

            @Override
            public View getView(int position, View convertView, ViewGroup parent) {
                ImageView iv = new ImageView(A_Gallery.this);
                iv.setImageResource(icons[position]);
                // 用於 Gallery 的 View 子元件需透過 LayoutParams 設定配置
                iv.setLayoutParams(new Gallery.LayoutParams(100, 100));
                // 維持比例
                iv.setScaleType(ImageView.ScaleType.FIT_XY);
                // Gallery 專用的背景
                iv.setBackgroundResource(galleryItemBackground);
                return iv;
            }

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

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

            @Override
            public long getItemId(int position) {
                return position;
            }
        });
    }
}
GridView 範例一樣,要將用於 Gallery 的照片放至於 res/drawable 下。

5 則留言:

  1. 請問如何使用gallery或gridview讀取sdcard中,指定目錄的圖片

    回覆刪除
  2. 參考一下「在 Android 裡讀取 SD 卡裡的檔案」(http://cw1057.blogspot.tw/2011/11/android-sd.html)囉!

    回覆刪除
  3. 那如果我放一個按鈕跟一張圖 按按鈕的時候 圖才會顯示 (圖一開始是隱藏的)我該怎麼設定??

    回覆刪除
  4. ImageView.setVisibility(View.VISIBLE/View.GONE/View.INVISIBLE)
    View.VISIBLE - 顯現
    View.INVISIBLE - 隱藏,佔有空間
    View.GONE - 隱藏,不佔空間
    Button.setOnClickListener(...)

    回覆刪除
  5. 你好 我使用您提供的code 在android模擬器上跑
    出現以下錯誤訊息
    "Unfortunately, Gallery has stopped."
    程式碼部分已經compile過了 可是模擬器無法顯示

    這樣有可能是甚麼問題呢?

    回覆刪除