Marshal's Blog

用Gallery实现带文字提示的显示效果

实现的效果类似这样：

和上周实现的实现横向的类似Gallery的效果不同，那是用scrollview和tablelayout实现的，事后发现当横向滚屏选择图片的时候，如果有纵向位移，也会造成下面列表的纵向滚动。

时间紧急，因此还是先用Gallery来实现类似效果吧。

Gallery的布局文件（table_title.xml）：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="fill_parent"
    android:layout_height="fill_parent">
    <TextView android:layout_width="fill_parent"
        android:layout_height="wrap_content" android:text="选择电影" />
    <Gallery android:id="@+id/gallery" android:layout_width="fill_parent"
        android:gravity="center_horizontal" android:spacing="10px"
        android:layout_height="wrap_content" android:layout_marginTop="20px" ></Gallery>
</LinearLayout>

Gallery内部的一个条目，也就是包括图片和下面的文字，布局（image_item.xml）：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="wrap_content"
    android:layout_height="wrap_content" android:background="#ffffffff">
    <ImageView android:layout_width="wrap_content"
        android:layout_height="wrap_content" android:src="@drawable/k"/>
    <TextView android:layout_width="match_parent"
        android:layout_height="wrap_content" android:text="清.康熙" android:gravity="center_horizontal"/>
</LinearLayout>

可以看到都是写死的图片和文字。

在Activity中要为Gallery设置Adapter，否则Gallery中是空的：

this.gallery = (Gallery) this.findViewById(R.id.gallery);
this.gallery.setAdapter(new ImageAdapter(this));

ImageAdapter是继承BaseAdapter的类：

class ImageAdapter extends BaseAdapter {

    public ImageAdapter(Context context) {
        super();
        this.context = context;
    }

    private Context context;

    @Override
    public int getCount() {
        return 7;
    }

    @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) {
        LinearLayout layout = (LinearLayout) View.inflate(context,
                R.layout.image_item, null);
        return layout;
    }

}

这里getCount() 方法是假的，返回多少，就会有多少个条目，当然是相同内容的。

源代码见：

http://easymorse.googlecode.com/svn/tags/video.demo-0.4.0/

   发送文章为PDF