使用ImageSwitcher+Graller實現簡單的幻燈式圖片瀏覽器

jopen 8年前發布 | 8K 次閱讀 Android開發 移動開發

實現效果如圖:


布局文件中只需要一個拖切換器和畫廊視圖顯示列表圖片.

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >

    <ImageSwitcher
        android:id="@+id/image_switcher"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:paddingTop="30px" />

    <Gallery
        android:id="@+id/gallery"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:paddingTop="30px"
        android:spacing="5px" />

</LinearLayout>


ImageSwitcher:

ImageSwitcher imageSwitcher = (ImageSwitcher)findViewById(R.id.image_switcher);

設置ViewFactory接口:

// 設置ViewFactory接口
        imageSwitcher.setFactory(new ViewFactory() {
            @Override
            public View makeView() {
                ImageView iv = new ImageView(MainActivity.this);
                iv.setScaleType(ImageView.ScaleType.FIT_CENTER);
                iv.setLayoutParams(new ImageSwitcher.LayoutParams(LayoutParams.WRAP_CONTENT,LayoutParams.WRAP_CONTENT));
                return iv;
            }
        });

設置圖片切換器的動畫效果

imageSwitcher.setInAnimation(AnimationUtils.loadAnimation(this, android.R.anim.fade_in)); // 設置淡入效果
imageSwitcher.setOutAnimation(AnimationUtils.loadAnimation(this, android.R.anim.fade_out)); // 設置淡出效果


Grallery-畫廊視圖

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

設置Grallery關聯的適配器:

gallery.setAdapter(new BaseAdapter() {
            @Override
            public View getView(int position, View convertView, ViewGroup parent) {
                ImageView imageView;
                if(convertView == null){
                    imageView = new ImageView(MainActivity.this);
                    imageView.setScaleType(ImageView.ScaleType.FIT_XY);
                    imageView.setLayoutParams(new Gallery.LayoutParams(180,135));
                    TypedArray typedArray = obtainStyledAttributes(R.styleable.Gallery);
                    imageView.setBackgroundResource(typedArray.getResourceId(R.styleable.Gallery_android_galleryItemBackground, 0));
                    imageView.setPadding(5, 0, 5, 0);
                }else {
                    imageView = (ImageView)convertView;
                }
                imageView.setImageResource(imageld[position]); // imageld 是一個int[]{} 里面包含了所顯示的圖片ID => private int imageld[] = new int[] { R.drawable.img01, R.drawable.img02.....}
                return imageView;
            }

            @Override
            public long getItemId(int position) {
                return position;
            }

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

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

設置監聽事件:

gallery.setOnItemSelectedListener(new OnItemSelectedListener() {
            @Override
            public void onItemSelected(AdapterView<?> arg0, View arg1, int postion, long arg3) {
                imageSwitcher.setImageResource(imageld[postion]); // 根據圖片索引獲取圖片ID,并設置給ImageSwitcher
            }

            @Override
            public void onNothingSelected(AdapterView<?> arg0) {
            }
        });

 來自: http://my.oschina.net/yuekunge/blog/547045

 本文由用戶 jopen 自行上傳分享,僅供網友學習交流。所有權歸原作者,若您的權利被侵害,請聯系管理員。
 轉載本站原創文章,請注明出處,并保留原始鏈接、圖片水印。
 本站是一個以用戶分享為主的開源技術平臺,歡迎各類分享!