Android 使用HorizontalScrollView 实现Gallery效果

浏览数：53 / 时间：2015年06月11日

　　Gallery（画廊）是一个锁定中心条目并且拥有水平滚动列表的视图，一般用来浏览图片，并且可以响应事件显示信息；Gallery还可以和ImageSwitcher组件结合使用来实现一个通过缩略图来浏览图片的效果；

　　但Gallery被谷歌废弃了，Google推荐使用ViewPager和HorizontalScrollView来实现Gallery的效果；

看一个例子：用Gallery来实现：

代码：

ScrollView1.java

package com.xiaozhang.dialog;

import android.app.Activity;
import android.content.Context;
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 ScrollView1 extends Activity {

    private Gallery gallery;

    @Override
    public void onCreate(Bundle savedInstanceState) {

        super.onCreate(savedInstanceState);
        setContentView(R.layout.view);
        gallery = (Gallery) findViewById(R.id.gallery);
        // 设置图片适配器
        gallery.setAdapter(new ImageAdapter(this));
        // 设置监听器
        gallery.setOnItemClickListener(new OnItemClickListener() {
            @Override
            public void onItemClick(AdapterView<?> parent, View v,
                    int position, long id) {
                Toast.makeText(ScrollView1.this,
                        "点击了第" + (position + 1) + "张图片", Toast.LENGTH_LONG)
                        .show();
            }
        });
    }
}

class ImageAdapter extends BaseAdapter {
    // 声明Context
    private Context context;
    // 图片源数组
    private Integer[] imageInteger = { R.drawable.pic1, R.drawable.pic2,
            R.drawable.pic3, R.drawable.pic4, R.drawable.pic5, R.drawable.pic6,
            R.drawable.pic7 };

    // 声明 ImageAdapter
    public ImageAdapter(Context c) {
        context = c;
    }

    @Override
    // 获取图片的个数
    public int getCount() {
        return imageInteger.length;
    }

    @Override
    // 获取图片在库中的位置
    public Object getItem(int position) {
        return position;
    }

    @Override
    // 获取图片在库中的位置
    public long getItemId(int position) {
        return position;
    }

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

        ImageView imageView = new ImageView(context);
        // 给ImageView设置资源
        imageView.setImageResource(imageInteger[position]);
        // 设置比例类型
        imageView.setScaleType(ImageView.ScaleType.CENTER);

        imageView.setLayoutParams(new Gallery.LayoutParams(350, 350));
        return imageView;
    }
}

view.xml

<?xml version="1.0" encoding="utf-8"?>
<Gallery xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/gallery"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="?android:galleryItemBackground"
    android:spacing="10dp"
    />

用HorizontalScrollView来实现：

MainActivity.java

package com.xiaozhang.horizontal;

import android.app.Activity;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.Window;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.TextView;

public class MainActivity extends Activity {

    private LinearLayout mGallery;
    private int[] imgId;
    private LayoutInflater mInflater;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        requestWindowFeature(Window.FEATURE_NO_TITLE);
        setContentView(R.layout.activity_main);
        mInflater = LayoutInflater.from(this);

        imgId = new int[] { R.drawable.pic1, R.drawable.pic2, R.drawable.pic3,
                R.drawable.pic4, R.drawable.pic5, R.drawable.pic6,
                R.drawable.pic7, R.drawable.pic8, R.drawable.pic9 };
        initView();
    }

    private void initView() {
        mGallery = (LinearLayout) findViewById(R.id.gallery_id);

        for (int i = 0; i < imgId.length; i++) {

            View view = mInflater.inflate(R.layout.gallery, mGallery, false);
            ImageView img = (ImageView) view.findViewById(R.id.gallery_image);
            img.setImageResource(imgId[i]);
            TextView txt = (TextView) view.findViewById(R.id.gallery_text);
            txt.setText("some info ");
            mGallery.addView(view);
        }
    }
}

activity_main.xml

<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" >

    <HorizontalScrollView
        android:layout_width="wrap_content"
        android:layout_height="260dp"
        android:layout_gravity="center_vertical"
        android:background="#AA4444"
        android:scrollbars="none" >

        <LinearLayout
            android:id="@+id/gallery_id"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center_vertical"
            android:orientation="horizontal" >
        </LinearLayout>
    </HorizontalScrollView>

</LinearLayout>

gallery.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="240dp"
    android:layout_height="240dp"
    android:background="@android:color/white" >

    <ImageView
        android:id="@+id/gallery_image"
        android:layout_width="180dp"
        android:layout_height="180dp"
        android:layout_alignParentTop="true"
        android:layout_centerHorizontal="true"
        android:layout_margin="5dp"
        android:scaleType="centerCrop" />

    <TextView
        android:id="@+id/gallery_text"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@id/gallery_image"
        android:layout_centerHorizontal="true"
        android:layout_marginBottom="5dp"
        android:layout_marginTop="5dp"
        android:textColor="#ff0000"
        android:textSize="25sp" />

</RelativeLayout>