如何在右上角添加带有十字按钮的动态图像视图

Question

我想在app中提供附件功能。请参阅附件截图。

如何在Android中以编程方式创建？

Answer 1

您应该创建一个frameLayout，其中包含2个包含实际图像的imageViews和包含该十字形的图像。

创建包含框架布局的custom_view.xml

 <?xml version="1.0" encoding="utf-8"?>
    <FrameLayout
    ....>
    <ImageView/>
    <ImageView/>

    </FrameLayout>

然后创建一个这样的自定义视图类：

public class MyCustomView extends ViewGroup {
    public MyCustomView(Context context, AttributeSet attrs) {
         super(context, attrs);
         LayoutInflater inflater = LayoutInflater.from(context);
         layoutInflater.inflate(R.layout.custom_view, this);
     }
 }

Answer 2

我可以看到你的问题的解决方案。首先创建视图的XML布局。然后创建将使用GET方法向其充气的类。然后通过代码创建此Views并添加到容器。

layout_custom.xml：

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout android:id="@+id/root"
             xmlns:android="http://schemas.android.com/apk/res/android"
             android:layout_width="200dp"
             android:layout_height="150dp">

    <ImageView
        android:id="@+id/img_photo"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_margin="12dp"
        android:background="#000"/>

    <ImageButton
        android:id="@+id/btn_close"
        android:layout_width="35dp"
        android:layout_height="35dp"
        android:layout_gravity="end"
        android:background="#00000000"
        android:scaleType="fitXY"
        android:src="@drawable/temp_close"/>

</FrameLayout>

CustomView.class：

public class CustomView extends FrameLayout {

    private View mRoot;
    private ImageView mImgPhoto;
    private View mBtnClose;

    private Context mContext;

    public CustomView(final Context context) {
        this(context, null);
    }

    public CustomView(final Context context, final AttributeSet attrs) {
        this(context, attrs, 0);
    }

    public CustomView(final Context context, final AttributeSet attrs, final int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        init(context);
    }

    private void init(final Context context) {
        if (isInEditMode())
            return;

        final LayoutInflater inflater = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);

        View customView = null;

        if (inflater != null)
            customView = inflater.inflate(R.layout.layout_custom, this);

        if (customView == null)
            return;

        mRoot = customView.findViewById(R.id.root);
        mImgPhoto = (ImageView) customView.findViewById(R.id.img_photo);
        mBtnClose = customView.findViewById(R.id.btn_close);
    }

    public View getRoot() {
        return mRoot;
    }

    public ImageView getImgPhoto() {
        return mImgPhoto;
    }

    public View getBtnClose() {
        return mBtnClose;
    }
}

最终使用这名员工：

final CustomView customView1 = new CustomView(getBaseContext());
final CustomView customView2 = new CustomView(getBaseContext());
final LinearLayout container = (LinearLayout) findViewById(R.id.container);
container.addView(customView1);
container.addView(customView2);