首页 > 代码库 > Android 使用HorizontalScrollView 实现Gallery效果

Android 使用HorizontalScrollView 实现Gallery效果

  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>

 

Android 使用HorizontalScrollView 实现Gallery效果