在不使用 LinearLayout 的情况下将图像视图居中于父视图的一半

Question

目前我的布局设计方式是 LinearLayout 和 width="match_parent"。这个视图有两个 ImageView 作为它的子视图，它们使用 weight="1"

占据了 LinearLayouts 宽度的一半

问题是这样，onClicks 被注册在卡片的透明部分，因为 View 被拉伸了。

编辑：我应该提到，这些圆圈应该只代表图像文件，而不是 circle-shapes 填充纯色。

我当前的代码：

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal">

    <ImageView

        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="1" />

    <ImageView

        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="1" />

</LinearLayout>

红色部分表示触摸区域

我想要的是在保持比率的同时如下所示：

我知道我可以像这样简单地尝试将每个 ImageView 嵌套在 RelativeLayout 中：

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal">

    <RelativeLayout
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="1">

        <ImageView
            android:layout_centerInParent="true"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />
    </RelativeLayout>

    <RelativeLayout
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="1" />

    <RelativeLayout
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="1">

        <ImageView
            android:layout_centerInParent="true"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />
    </RelativeLayout>


</LinearLayout>

但是像这样嵌套是非常可怕的形式

Answer 1

你可以使用 RelativeLayout

<RelativeLayout
    android:layout_width="0dp"
    android:layout_height="match_parent"
    android:layout_weight="1">

    <ImageView
        android:layout_alignParentLeft="true"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />
    <ImageView
        android:layout_alignParentRight="true"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />
</RelativeLayout>

但如果屏幕的宽高比较小，有时会导致重叠。

Answer 2

您可以看到被触摸的像素的颜色并采取相应的行动：

 final Bitmap bitmap = ((BitmapDrawable)imageView.getDrawable()).getBitmap();
    imageView.setOnTouchListener(new OnTouchListener(){
        @Override
        public boolean onTouch(View v, MotionEvent event){
        int x = (int)event.getX();
        int y = (int)event.getY();
        int pixel = bitmap.getPixel(x,y);

        int redValue = Color.red(pixel);
        int blueValue = Color.blue(pixel);
        int greenValue = Color.green(pixel); 
        if(redValue != 255 && blueValue != 255 && greenValue != 255) {
            //Not the background, so handle the click
        }
        return false;
        }
   });

Answer 3

尝试创建新组件：res/drawable/my_circle.xml:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval">
<solid android:color="@color/your_color" />
</shape>

然后在您的 ImageView

中设置为来源

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal">

    <ImageView

        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:src="@drawable/my_circle" />

    <ImageView

        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:src="@drawable/my_circle" />

</LinearLayout>

Answer 4

使用百分比相对布局无需嵌套link here

在不使用 LinearLayout 的情况下将图像视图居中于父视图的一半

Center an imageview in half of parentview without using LinearLayout

android

imageview

android-layout

android-linearlayout

android-relativelayout