如何在图像上添加 Imageview 和 Textview？答案

【问题标题】：How to add Imageview and Textview on Image?如何在图像上添加 Imageview 和 Textview？
【发布时间】：2015-11-28 12:03:39
【问题描述】：

我正在使用ListFragment 和ArrayAdapter 来显示使用以下list_view.xml 的图像视图列表

<?xml version="1.0" encoding="utf-8"?>

<ImageView xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/img"
    android:layout_width="match_parent"
    android:layout_height="200dp"/>

在我的Adapter.getview 中，我使用picasso 来加载图像：

@Override
public View getView(int position, View convertView, ViewGroup parent) {
 LayoutInflater inflater = (LayoutInflater) context.getSystemService(Activity.LAYOUT_INFLATER_SERVICE);
    if (null == convertView) {
        convertView = inflater.inflate(R.layout.list_view, parent, false);
    }

    Picasso
            .with(context)
            .load("http://i.imgur.com/rFLNqWI.jpg")
            .fit()
            .into((ImageView) convertView);
    return convertView;
 }

这是Fragment 类中的onActivityCreated 方法，由ListFragment 扩展：

 TestAdapter adapt = new TestAdapter(getActivity().getApplicationContext(), R.layout.list_view, pictures);
 setListAdapter(adapt);

上面的代码给了我一个listview，在那里我可以看到从picasso 库加载的图像。如何在列表视图中picasso 加载的image 上添加text 和image？简而言之：

您可以在左下角看到一个文本“在此处输入文本”，在右上角看到一个图标（不完全在角落）

【问题讨论】：

标签： android listview android-listview android-listfragment picasso

【解决方案1】：

您可以实现 Picasso Transformation 获取位图，然后使用 Canvas 原语在位图顶部绘制/渲染文本并返回最终位图。

另一种方法是使用带有 3 个子视图的 RelativeLayout：ImageView 延伸到其父级（RelativeLayout），因此它成为整体背景；然后是 TextView 用于您的文本，最后是另一个 ImageView 用于您的图标。

【讨论】：

能否给我链接以查看Transformation 和bitmap。是否可以为另一个 imageview 和 textview 提供坐标？
@SnowClue - 这个答案有一个链接到转换stackoverflow.com/questions/27081534/…

【解决方案2】：

像这样创建 list_view.xml

<Relative layout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

<ImageView
    android:id="@+id/img"        
    android:layout_width="match_parent"
    android:layout_height="200dp"/>

<EditText
    android:layout_width="wrap_content"
    android:layout_alignParentLeft="true"
    android:text="Type your text"
    android:layout_alignParentBottom="true"
    android:layout_margin="20dp"
    android:layout_height="200dp"/>

</Relative>

【讨论】：

【解决方案3】：

您可以使用 ViewHolder 设置 TextView 和 image 两者，然后与 picasso 一起使用。

这是代码 sn-p。

@Override
    public View getView(int position, View convertView, ViewGroup parent) {
        View row = convertView;
        ViewHolder holder;

        if (row == null) {
            LayoutInflater inflater = ((Activity) mContext).getLayoutInflater();
            row = inflater.inflate(layoutResourceId, parent, false);
            holder = new ViewHolder();
            holder.titleTextView = (TextView) row.findViewById(R.id.grid_item_title);
            holder.imageView = (ImageView) row.findViewById(R.id.grid_item_image);
            row.setTag(holder);
        } else {
            holder = (ViewHolder) row.getTag();
        }

        GridItem item = mGridData.get(position);
        holder.titleTextView.setText(Html.fromHtml(item.getTitle()));

        Picasso.with(mContext).load(item.getImage()).into(holder.imageView);
        return row;
    }

【讨论】：