Android GridLayout图片

时间:2015-07-07 12:13:41

标签: android-layout

我正在尝试使用图像和文本实现网格布局:

每个项目都有文字,图像和动作。这应该是它的样子:

layout grid

1 个答案:

答案 0 :(得分:2)

将此用作网格项的布局。

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">

<ImageView
    android:id="@+id/picture"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:scaleType="centerCrop"/>

<TextView
    android:id="@+id/picturetext"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:paddingLeft="10dp"
    android:paddingRight="10dp"
    android:paddingTop="15dp"
    android:paddingBottom="15dp"
    android:layout_gravity="bottom"
    android:textColor="@android:color/white"
    android:background="#55000000"/>

这将为您提供如下结果。 enter image description here

现在,为了获得样本中所需的结果,您可以更改替换元素的宽度和高度,即模2个元素。对于偶数索引项,您可以使用方形尺寸尺寸,对于奇数索引项,您可以使用矩形项。

使用此代码为gridView设置适配器。

GridView gridView = (GridView) view.findViewById(R.id.imagegridview);
gridView.setAdapter(new ImageAdapter(getActivity()));

使用此类作为图像适配器。

public class ImageAdapter extends BaseAdapter {
    private Context localContext;
    private final LayoutInflater mInflater;

    ImageAdapter(Context ct){
        this.localContext = ct;
        mInflater = LayoutInflater.from(localContext);
    }

    @Override
    public int getCount() {
        return imageTweets.size();
    }

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

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

    @Override
    public View getView(int position, View convertView, ViewGroup parent) {
        View v;
        ImageView picture;
        TextView name;

        if (convertView == null) {
            v = mInflater.inflate(R.layout.new_grid_item, parent, false);
            v.setTag(R.id.picture, v.findViewById(R.id.picture));
            v.setTag(R.id.picturetext,    v.findViewById(R.id.picturetext));
        } else
            v = convertView;

        picture = (ImageView) v.getTag(R.id.picture);
        name    = (TextView) v.getTag(R.id.picturetext);


        picture.setImageUrl(imageTweets.get(position).entities.media.get(0).mediaUrl, mImageLoader);
        name.setText(imageTweets.get(position).user.screenName);

        return v;
    }
}

在我的情况下,我使用url加载图像,因此在代码上方。 在您的情况下,您可以直接从资源设置图像。看看它是否有效。