如何使版面右側可點擊？

Question

我有這樣的布局：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginTop="4dp"
    android:orientation="vertical"
    app:autoSizeMaxTextSize="20sp"
    app:autoSizeMinTextSize="8sp"
    app:autoSizeStepGranularity="1sp"
    app:autoSizeTextType="uniform">


    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="#F2F2F2">

        <ImageView
            android:id="@+id/service_icon"
            android:layout_width="40dp"
            android:layout_height="40dp"
            android:layout_centerHorizontal="true"
            android:layout_marginTop="20dp" />

        <TextView
            android:id="@+id/name_of_service"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_below="@id/service_icon"
            android:layout_centerHorizontal="true"
            android:layout_marginTop="10dp"
            android:layout_marginBottom="10dp"
            android:fontFamily="@font/opensans_semibold"
            android:textAlignment="center"
            android:textColor="#4D4D4D"
            android:textSize="14sp" />

        <ImageView
            android:id="@+id/expand_btn"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:layout_alignBottom="@id/name_of_service"
            android:layout_alignParentEnd="true"
            android:layout_marginEnd="30dp"
            android:src="@drawable/down_arrow" />
    </RelativeLayout>

    <LinearLayout
        android:id="@+id/layout_descr"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="4dp"
        android:background="@drawable/test_back"
        android:visibility="gone">

        <TextView
            android:id="@+id/description"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginStart="15dp"
            android:layout_marginTop="10dp"
            android:layout_marginEnd="10dp"
            android:layout_marginBottom="20dp"
            android:fontFamily="@font/opensans_semibold"
            android:textColor="#666666" />
    </LinearLayout>

</LinearLayout>

我想使放置imageview的整個右側不僅可以單擊imageview，還可以單擊。 我決定將imageview放入framelayout中：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginTop="4dp"
    android:orientation="vertical"
    app:autoSizeMaxTextSize="20sp"
    app:autoSizeMinTextSize="8sp"
    app:autoSizeStepGranularity="1sp"
    app:autoSizeTextType="uniform">


    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="#F2F2F2">

        <ImageView
            android:id="@+id/service_icon"
            android:layout_width="40dp"
            android:layout_height="40dp"
            android:layout_centerHorizontal="true"
            android:layout_marginTop="20dp" />

        <TextView
            android:id="@+id/name_of_service"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_below="@id/service_icon"
            android:layout_centerHorizontal="true"
            android:layout_marginTop="10dp"
            android:layout_marginBottom="10dp"
            android:fontFamily="@font/opensans_semibold"
            android:textAlignment="center"
            android:textColor="#4D4D4D"
            android:textSize="14sp" />

        <FrameLayout
            android:id="@+id/click_area"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:layout_alignBottom="@id/name_of_service"
            android:layout_alignParentEnd="true"
            android:clickable="true"
            android:focusable="true">

            <ImageView
                android:id="@+id/expand_btn"
                android:layout_width="wrap_content"
                android:layout_gravity="bottom"
                android:layout_height="wrap_content"
                android:src="@drawable/down_arrow" />
        </FrameLayout>


    </RelativeLayout>

    <LinearLayout
        android:id="@+id/layout_descr"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="4dp"
        android:background="@drawable/test_back"
        android:visibility="gone">

        <TextView
            android:id="@+id/description"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginStart="15dp"
            android:layout_marginTop="10dp"
            android:layout_marginEnd="10dp"
            android:layout_marginBottom="20dp"
            android:fontFamily="@font/opensans_semibold"
            android:textColor="#666666" />
    </LinearLayout>

</LinearLayout>

然后覆蓋click事件：

holder.frameLayout.setOnTouchListener(new View.OnTouchListener() {
            @Override
            public boolean onTouch(View view, MotionEvent event) {
                if(event.getAction() == MotionEvent.ACTION_UP){
                    Log.i("m","sjn");
                    return true;
                }
                return false;
            }
        });

但正如我所見，我只能單擊布局的底部。 這種布局就像我的RecyclerView項目的視圖一樣使用，當我單擊右側時，將顯示隱藏的線性布局，如下所示：

holder.showHideBtn.setOnClickListener(view -> {
            if (invisible) {
                holder.layout.setVisibility(View.VISIBLE);
                invisible = false;
                holder.showHideBtn.setImageResource(R.drawable.ic_up_arrow);
            } else {
                holder.layout.setVisibility(View.GONE);
                invisible = true;
                holder.showHideBtn.setImageResource(R.drawable.down_arrow);
            }

        });

也許有人可以幫助我解決我的問題？ 我嘗試使用約束布局，但未能解決問題。 然后我嘗試使用weight來完成這項任務，但並沒有幫助我:(

UPDATE

為framelayout和imageview添加點擊處理程序后：

Answer 1

嘗試為FrameLayout和ImageView都編寫onClick偵聽器，因為ImageView現在可以覆蓋FrameLayout而您只有這個很小的區域，而ImageView沒有覆蓋。 這應該有所幫助。

Answer 2

您需要將點擊偵聽器添加到不在imageview上的框架布局中。 在這種情況下，你frameLayout將作為您的imageView 。

    holder.frameLayout.setOnClickListener(view -> {

 if (invisible) {
                holder.layout.setVisibility(View.VISIBLE);
                invisible = false;
                holder.showHideBtn.setImageResource(R.drawable.ic_up_arrow);
            } else {
                holder.layout.setVisibility(View.GONE);
                invisible = true;
                holder.showHideBtn.setImageResource(R.drawable.down_arrow);
            }

        });

Answer 3

刪除您的Framelayout並像這樣設置ImageView

    <ImageView
        android:id="@+id/expand_btn"
        android:layout_width="wrap_content"
        android:layout_gravity="bottom"
        android:layout_alignBottom="@id/name_of_service"
        android:layout_alignParentEnd="true"
        android:scaleType="fitEnd"
        android:layout_height="match_parent"
        app:srcCompat="@drawable/ic_start" />

您的圖片將占據整個右側，並使用fitEnd將圖標放置在底部。

Answer 4

我設法通過constraint_layout解決了我的問題：

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginTop="4dp"
    android:orientation="vertical"
    app:autoSizeMaxTextSize="20sp"
    app:autoSizeMinTextSize="8sp"
    app:autoSizeStepGranularity="1sp"
    app:autoSizeTextType="uniform">

    <RelativeLayout
        android:id="@+id/relLay"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:background="#F2F2F2"
        app:layout_constraintHorizontal_weight="0.7"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toLeftOf="@+id/testClick"
        app:layout_constraintTop_toTopOf="parent">

        <ImageView
            android:id="@+id/service_icon"
            android:layout_width="40dp"
            android:layout_height="40dp"
            android:layout_centerHorizontal="true"
            android:layout_marginTop="20dp" />

        <TextView
            android:id="@+id/name_of_service"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_below="@id/service_icon"
            android:layout_centerHorizontal="true"
            android:layout_marginTop="10dp"
            android:layout_marginBottom="10dp"
            android:fontFamily="@font/opensans_semibold"
            android:textAlignment="center"
            android:textColor="#4D4D4D"
            android:textSize="14sp" />


    </RelativeLayout>


    <FrameLayout
        android:id="@+id/testClick"
        android:layout_width="wrap_content"
        android:layout_height="0dp"
        android:background="#F2F2F2"
        app:layout_constraintBottom_toBottomOf="@id/relLay"
        app:layout_constraintHorizontal_weight="0.3"
        app:layout_constraintLeft_toRightOf="@+id/relLay"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent">

        <ImageView
            android:id="@+id/expand_btn"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_gravity="bottom"
            android:layout_marginEnd="10dp"
            android:layout_marginBottom="10dp"
            android:src="@drawable/down_arrow" />
    </FrameLayout>


    <LinearLayout
        android:id="@+id/layout_descr"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="4dp"
        android:background="@drawable/test_back"
        android:visibility="gone"
        app:layout_constraintTop_toBottomOf="@id/relLay">

        <TextView
            android:id="@+id/description"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginStart="15dp"
            android:layout_marginTop="10dp"
            android:layout_marginEnd="10dp"
            android:layout_marginBottom="20dp"
            android:fontFamily="@font/opensans_semibold"
            android:textColor="#666666" />
    </LinearLayout>

也許會幫助別人。 祝好運 ：）