android Gallery與ImageView的結合使用

fmms 13年前發布 | 28K 次閱讀 Android Android開發 移動開發

Gallery是一個內部元素可以水平滾動，并且可以把當前選擇的子元素定位在它中心的布局組件。

本程序的運行效果如下所示：

android Gallery與ImageView的結合使用                   android Gallery與ImageView的結合使用
   
具體實現如下：
1、建立一個新項目
2、拷貝10個圖片文件到res/drawable目錄
3、res/layout/main.xml文件的內容如下： 
    <?xml version="1.0" encoding="utf-8"?>  

    <!-- FrameLayout用來顯示層疊效果 -->  
    <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"  
        android:layout_width="fill_parent"  
        android:layout_height="fill_parent"  
        android:orientation="vertical" >  

        <!-- ImageView用來顯示背景 -->  
        <ImageView  
            android:id="@+id/iv"  
            android:layout_width="fill_parent"  
            android:layout_height="fill_parent"  
            android:src="@drawable/a01"  
             />  

        <!-- Gallery來展示畫廊 -->  
        <Gallery xmlns:android="http://schemas.android.com/apk/res/android"  
            android:id="@+id/gallery"  
            android:layout_width="fill_parent"  
            android:layout_height="wrap_content"  
            android:spacing="5dp"  
            />  
    </FrameLayout>
其中我們使用FrameLayout來實現疊加效果，使用ImageView來顯示大圖，Gallery來展示畫廊，android:spacing="5dp" 屬性則是用來設置元素之間的間隔。4、在res/values/目錄中新建一個attrs.xml內容如下：其中我們使用FrameLayout來實現疊加效果，使用ImageView來顯示大圖，Gallery來展示畫廊，android:spacing="5dp" 屬性則是用來設置元素之間的間隔。4、在res/values/目錄中新建一個attrs.xml內容如下：其中我們使用FrameLayout來實現疊加效果，使用ImageView來顯示大圖，Gallery來展示畫廊，android:spacing="5dp" 屬性則是用來設置元素之間的間隔。
 
4、在res/values/目錄中新建一個attrs.xml內容如下：
 
    <?xml version="1.0" encoding="utf-8"?>  
    <resources>  
            <declare-styleable name="HelloGallery">  
                    <attr name="android:galleryItemBackground"/>  
            </declare-styleable>  
    </resources>
5、在MainHelloGallery.java中的內容如下：5、在MainHelloGallery.java中的內容如下：5、在Test_galleryActivity.java中的內容如下：
package m.m.m;

import android.app.Activity;

import android.content.Context;

import android.content.res.TypedArray;

import android.os.Bundle;

import android.view.View;

import android.view.ViewGroup;

import android.widget.AdapterView;

import android.widget.AdapterView.OnItemClickListener;

import android.widget.BaseAdapter;

import android.widget.Gallery;

import android.widget.ImageView;

import android.widget.Toast;

public class Test_galleryActivity extends Activity {

    /** Called when the activity is first created. */

    @Override
    public void onCreate(Bundle savedInstanceState) {

        super.onCreate(savedInstanceState);

        setContentView(R.layout.main);

        // 定義UI組件

        final ImageView iv = (ImageView) findViewById(R.id.iv);

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

        // 設置圖片匹配器

        g.setAdapter(new ImageAdapter(this));

        // 設置AdapterView點擊監聽器，Gallery是AdapterView的子類

        g.setOnItemClickListener(new OnItemClickListener() {

            @Override
            public void onItemClick(AdapterView<?> parent, View view,

            int position, long id) {

                // 顯示點擊的是第幾張圖片

                Toast.makeText(Test_galleryActivity.this, "" + position,

                Toast.LENGTH_LONG).show();

                // 設置背景部分的ImageView顯示當前Item的圖片

                iv.setImageResource(((ImageView) view).getId());

            }

        });

    }

    // 定義繼承BaseAdapter的匹配器

    public class ImageAdapter extends BaseAdapter {

        // Item的修飾背景

        int mGalleryItemBackground;

        // 上下文對象

        private Context mContext;

        // 圖片數組

        private Integer[] mImageIds = { R.drawable.a01,

        R.drawable.a02, R.drawable.a03,

        R.drawable.a04, R.drawable.a05,

        R.drawable.a06, R.drawable.a07,

        R.drawable.a08 };

        // 構造方法

        public ImageAdapter(Context c) {

            mContext = c;

            // 讀取styleable資源

            TypedArray a = obtainStyledAttributes(R.styleable.HelloGallery);

            mGalleryItemBackground = a.getResourceId(

            R.styleable.HelloGallery_android_galleryItemBackground, 0);

            a.recycle();

        }

        // 返回項目數量

        @Override
        public int getCount() {

            return mImageIds.length;

        }

        // 返回項目

        @Override
        public Object getItem(int position) {

            return position;

        }

        // 返回項目Id

        @Override
        public long getItemId(int position) {

            return position;

        }

        // 返回視圖

        @Override
        public View getView(int position, View convertView, ViewGroup parent) {

            ImageView iv = new ImageView(mContext);

            iv.setImageResource(mImageIds[position]);

            // 給生成的ImageView設置Id，不設置的話Id都是-1

            iv.setId(mImageIds[position]);

            iv.setLayoutParams(new Gallery.LayoutParams(120, 160));

            iv.setScaleType(ImageView.ScaleType.FIT_XY);

            iv.setBackgroundResource(mGalleryItemBackground);

            return iv;

        }

    }

}
至此，完成以上功能。
 
總結：
1、定義Gallery
2、在res/values下 自定義attrs.xml文件
 
 

我們點擊某一張圖片，會把該子元素的圖片顯示在放在后面一層的ImageView組件中。我們點擊某一張圖片，會把該子元素的圖片顯示在放在后面一層的 ImageView組件中。我們點擊某一張圖片，會把該子元素的圖片顯示在放在后面一層的ImageView組件中。我們點擊某一張圖片，會把該子元素的圖片顯示在放在后面一層的ImageView組件中。我們點擊某一張圖片，會把該子元素的圖片顯示在放在后面一層的ImageView組件中。我們點擊某一張圖片，會把該子元素的圖片顯示在放在后面一層的ImageView組件中。
 本文由用戶 fmms 自行上傳分享，僅供網友學習交流。所有權歸原作者，若您的權利被侵害，請聯系管理員。
 轉載本站原創文章，請注明出處，并保留原始鏈接、圖片水印。
 本站是一個以用戶分享為主的開源技術平臺，歡迎各類分享！