logo标签列表

在 ConstraintLayout 中，一个 ImageView 可以覆盖在另一个 ImageView 上方。

androidandroid-constraintlayout
6

这里输入图片描述

我正在使用ConstraintLayout实现这个结构。但是在最后一张图片中，加号图像视图被一半隐藏了。而且，在所有三张图片中，如果我设置了图像，则加号或叉号符号的一部分会被隐藏。我尝试设置高度或Z轴偏移量，但对我没有用。

请帮助我解决这个问题。

这是我的代码片段。

<!-- Constraint Layout -->


  <android.support.constraint.ConstraintLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:orientation="horizontal"
                android:paddingEnd="@dimen/_16dp"
                android:paddingStart="@dimen/_16dp"
                android:paddingTop="@dimen/_16dp"
                tools:ignore="ContentDescription">

                <!-- Profile Pic -->

                <ImageView
                    android:id="@+id/img_profilePic"
                    android:layout_width="@dimen/_80dp"
                    android:layout_height="@dimen/_80dp"
                    android:background="@color/bg_light_gray"
                    app:layout_constraintStart_toStartOf="parent" />

                <ImageView
                    android:id="@+id/img_profilePic_delete"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:background="@drawable/icon_cross"
                    app:layout_constraintBottom_toBottomOf="@+id/img_profilePic"
                    app:layout_constraintEnd_toEndOf="@+id/img_profilePic"
                    app:layout_constraintStart_toEndOf="@+id/img_profilePic"
                    app:layout_constraintTop_toBottomOf="@+id/img_profilePic" />

                <!-- Gallery Pic 1 -->

                <ImageView
                    android:id="@+id/img_galleryPic1"
                    android:layout_width="@dimen/_80dp"
                    android:layout_height="@dimen/_80dp"
                    android:background="@color/bg_light_gray"
                    app:layout_constraintEnd_toStartOf="@+id/img_galleryPic2"
                    app:layout_constraintStart_toEndOf="@+id/img_profilePic" />

                <ImageView
                    android:id="@+id/img_galleryPic1_add"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:background="@drawable/icon_add_circle"

                    app:layout_constraintBottom_toBottomOf="@+id/img_galleryPic1"
                    app:layout_constraintEnd_toEndOf="@+id/img_galleryPic1"
                    app:layout_constraintStart_toEndOf="@+id/img_galleryPic1"
                    app:layout_constraintTop_toBottomOf="@+id/img_galleryPic1" />

                <ImageView
                    android:id="@+id/img_galleryPic1_delete"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:background="@drawable/icon_cross"
                    android:visibility="gone"
                    app:layout_constraintBottom_toBottomOf="@+id/img_galleryPic1"
                    app:layout_constraintEnd_toEndOf="@+id/img_galleryPic1"
                    app:layout_constraintStart_toEndOf="@+id/img_galleryPic1"
                    app:layout_constraintTop_toBottomOf="@+id/img_galleryPic1" />

                <!-- Gallery Pic 2 -->

                <ImageView
                    android:id="@+id/img_galleryPic2"
                    android:layout_width="@dimen/_80dp"
                    android:layout_height="@dimen/_80dp"
                    android:background="@color/bg_light_gray"
                    app:layout_constraintEnd_toEndOf="parent" />


                <ImageView
                    android:id="@+id/img_galleryPic2_add"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:background="@drawable/icon_add_circle"
                    app:layout_constraintBottom_toBottomOf="@+id/img_galleryPic2"
                    app:layout_constraintEnd_toEndOf="@+id/img_galleryPic2"
                    app:layout_constraintHorizontal_bias="1.0"
                    app:layout_constraintStart_toEndOf="@+id/img_galleryPic2"
                    app:layout_constraintTop_toBottomOf="@+id/img_galleryPic2" />

                <ImageView
                    android:id="@+id/img_galleryPic2_delete"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:background="@drawable/icon_cross"
                    android:visibility="gone"
                    app:layout_constraintBottom_toBottomOf="@+id/img_galleryPic2"
                    app:layout_constraintEnd_toEndOf="@+id/img_galleryPic2"
                    app:layout_constraintStart_toEndOf="@+id/img_galleryPic2"
                    app:layout_constraintTop_toBottomOf="@+id/img_galleryPic2" />


            </android.support.constraint.ConstraintLayout>
2个回答
1
尝试这个 => 你需要为此提供适当的约束条件。
将第0个图库图像的结束约束条件赋给第1个图库图像的开始约束条件，将第2个图库图像的开始约束条件赋给第1个图库图像的结束约束条件。
你也可以使用链来实现这一点。
<android.support.constraint.ConstraintLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal"
            android:paddingEnd="@dimen/_16dp"
            android:paddingStart="@dimen/_16dp"
            android:paddingTop="@dimen/_16dp"
            tools:ignore="ContentDescription">

            <!-- Profile Pic -->

            <ImageView
                android:id="@+id/img_profilePic"
                android:layout_width="@dimen/_80dp"
                android:layout_height="@dimen/_80dp"
                android:background="@color/bg_light_gray"
                app:layout_constraintEnd_toStartOf="@+id/img_galleryPic1"
                app:layout_constraintStart_toStartOf="parent" />

            <ImageView
                android:id="@+id/img_profilePic_delete"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:background="@drawable/icon_cross"
                app:layout_constraintBottom_toBottomOf="@+id/img_profilePic"
                app:layout_constraintEnd_toEndOf="@+id/img_profilePic"
                app:layout_constraintStart_toEndOf="@+id/img_profilePic"
                app:layout_constraintTop_toBottomOf="@+id/img_profilePic" />

            <!-- Gallery Pic 1 -->

            <ImageView
                android:id="@+id/img_galleryPic1"
                android:layout_width="@dimen/_80dp"
                android:layout_height="@dimen/_80dp"
                android:background="@color/bg_light_gray"
                app:layout_constraintEnd_toStartOf="@+id/img_galleryPic2"
                app:layout_constraintStart_toEndOf="@+id/img_profilePic" />

            <ImageView
                android:id="@+id/img_galleryPic1_add"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:background="@drawable/icon_add_circle"

                app:layout_constraintBottom_toBottomOf="@+id/img_galleryPic1"
                app:layout_constraintEnd_toEndOf="@+id/img_galleryPic1"
                app:layout_constraintStart_toEndOf="@+id/img_galleryPic1"
                app:layout_constraintTop_toBottomOf="@+id/img_galleryPic1" />

            <ImageView
                android:id="@+id/img_galleryPic1_delete"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:background="@drawable/icon_cross"
                android:visibility="gone"
                app:layout_constraintBottom_toBottomOf="@+id/img_galleryPic1"
                app:layout_constraintEnd_toEndOf="@+id/img_galleryPic1"
                app:layout_constraintStart_toEndOf="@+id/img_galleryPic1"
                app:layout_constraintTop_toBottomOf="@+id/img_galleryPic1" />

            <!-- Gallery Pic 2 -->

            <ImageView
                android:id="@+id/img_galleryPic2"
                android:layout_width="@dimen/_80dp"
                android:layout_height="@dimen/_80dp"
                android:background="@color/bg_light_gray"
                app:layout_constraintStart_toEndOf="@+id/img_galleryPic1"
                app:layout_constraintEnd_toEndOf="parent" />


            <ImageView
                android:id="@+id/img_galleryPic2_add"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:background="@drawable/icon_add_circle"
                app:layout_constraintBottom_toBottomOf="@+id/img_galleryPic2"
                app:layout_constraintEnd_toEndOf="@+id/img_galleryPic2"
                app:layout_constraintHorizontal_bias="1.0"
                app:layout_constraintStart_toEndOf="@+id/img_galleryPic2"
                app:layout_constraintTop_toBottomOf="@+id/img_galleryPic2" />

            <ImageView
                android:id="@+id/img_galleryPic2_delete"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:background="@drawable/icon_cross"
                android:visibility="gone"
                app:layout_constraintBottom_toBottomOf="@+id/img_galleryPic2"
                app:layout_constraintEnd_toEndOf="@+id/img_galleryPic2"
                app:layout_constraintStart_toEndOf="@+id/img_galleryPic2"
                app:layout_constraintTop_toBottomOf="@+id/img_galleryPic2" />


        </android.support.constraint.ConstraintLayout>
这个问题解决了图像半隐藏的问题。但我仍然有高度问题。比如，当图像中的灰色框被实际图像替换时，X或+图像的一部分会被覆盖，即被隐藏。 - Sethuraman Srinivasan
将ImageView的位置调整到XML文件中的第一位，即可实现在界面上显示图片。 - Shweta Chauhan
它没有起作用。只是问一下，你认为文件是png格式可能会有问题吗？ - Sethuraman Srinivasan
0

放置水平滚动视图

<HorizontalScrollView
        android:layout_width="match_parent"
        android:layout_height="match_parent">
    <android.support.constraint.ConstraintLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        android:paddingEnd="16dp"
        android:paddingStart="16dp"
        android:paddingTop="16dp"
        tools:ignore="ContentDescription">

        <!-- Profile Pic -->

        <ImageView
            android:id="@+id/img_profilePic"
            android:layout_width="80dp"
            android:layout_height="80dp"
            android:background="@color/black"
            app:layout_constraintStart_toStartOf="parent" />

        <ImageView
            android:id="@+id/img_profilePic_delete"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="@drawable/call_cam_toggle_background"
            app:layout_constraintBottom_toBottomOf="@+id/img_profilePic"
            app:layout_constraintEnd_toEndOf="@+id/img_profilePic"
            app:layout_constraintStart_toEndOf="@+id/img_profilePic"
            app:layout_constraintTop_toBottomOf="@+id/img_profilePic" />

        <!-- Gallery Pic 1 -->

        <ImageView
            android:id="@+id/img_galleryPic1"
            android:layout_width="80dp"
            android:layout_height="80dp"
            android:background="@color/black"
            app:layout_constraintEnd_toStartOf="@+id/img_galleryPic2"
            app:layout_constraintStart_toEndOf="@+id/img_profilePic" />

        <ImageView
            android:id="@+id/img_galleryPic1_add"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="@drawable/call_cam_toggle_background"

            app:layout_constraintBottom_toBottomOf="@+id/img_galleryPic1"
            app:layout_constraintEnd_toEndOf="@+id/img_galleryPic1"
            app:layout_constraintStart_toEndOf="@+id/img_galleryPic1"
            app:layout_constraintTop_toBottomOf="@+id/img_galleryPic1" />

        <ImageView
            android:id="@+id/img_galleryPic1_delete"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="@drawable/icon_cross"
            android:visibility="gone"
            app:layout_constraintBottom_toBottomOf="@+id/img_galleryPic1"
            app:layout_constraintEnd_toEndOf="@+id/img_galleryPic1"
            app:layout_constraintStart_toEndOf="@+id/img_galleryPic1"
            app:layout_constraintTop_toBottomOf="@+id/img_galleryPic1" />

        <!-- Gallery Pic 2 -->

        <ImageView
            android:id="@+id/img_galleryPic2"
            android:layout_width="@dimen/_80dp"
            android:layout_height="@dimen/_80dp"
            android:background="@color/bg_light_gray"
            app:layout_constraintEnd_toEndOf="parent" />


        <ImageView
            android:id="@+id/img_galleryPic2_add"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="@drawable/icon_add_circle"
            app:layout_constraintBottom_toBottomOf="@+id/img_galleryPic2"
            app:layout_constraintEnd_toEndOf="@+id/img_galleryPic2"
            app:layout_constraintHorizontal_bias="1.0"
            app:layout_constraintStart_toEndOf="@+id/img_galleryPic2"
            app:layout_constraintTop_toBottomOf="@+id/img_galleryPic2" />

        <ImageView
            android:id="@+id/img_galleryPic2_delete"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="@drawable/icon_cross"
            android:visibility="gone"
            app:layout_constraintBottom_toBottomOf="@+id/img_galleryPic2"
            app:layout_constraintEnd_toEndOf="@+id/img_galleryPic2"
            app:layout_constraintStart_toEndOf="@+id/img_galleryPic2"
            app:layout_constraintTop_toBottomOf="@+id/img_galleryPic2" />


    </android.support.constraint.ConstraintLayout>
    </HorizontalScrollView>
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接