Question

以下是我尝试设计的屏幕，我正在使用CoordinatorLayout 但无法将图像与屏幕截图中显示的RelativeLayout对齐。

以下是我的代码

<android.support.design.widget.CoordinatorLayout
        android:id="@+id/layoutDocumentVerification"
        android:layout_below="@+id/layoutTitles"
        android:layout_marginTop="16dp"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <RelativeLayout
            android:id="@+id/layoutContent"
            android:background="@drawable/drawable_rectangle_white_grey_border"
            android:padding="10dp"
            android:layout_width="match_parent"
            android:layout_height="wrap_content">

            <ImageView
                android:id="@+id/imgDocVerification"
                android:layout_marginRight="10dp"
                app:srcCompat="@drawable/ic_document_verification"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content" />

            <com.widgets.TextViewRobotoRegular
                android:id="@+id/lblDocVerify"
                android:layout_toRightOf="@+id/imgDocVerification"
                android:text="Document Verification"
                android:textSize="14sp"
                android:textColor="@color/ekyc_black"
                android:layout_marginTop="10dp"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content" />

            <com.widgets.TextViewRobotoLight
                android:id="@+id/lblUploadDoc"
                android:layout_toRightOf="@+id/imgDocVerification"
                android:layout_below="@+id/lblDocVerify"
                android:text="Please upload your documents"
                android:textSize="13sp"
                android:layout_marginTop="8dp"
                android:textColor="@color/ekyc_light_gray"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content" />

            <com.widgets.TextViewRobotoBold
                android:id="@+id/lblKnowMore"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_toRightOf="@+id/imgDocVerification"
                android:layout_below="@+id/lblUploadDoc"
                android:layout_marginTop="8dp"
                android:layout_marginBottom="16dp"
                android:text="@string/know_more_about_sips"
                android:textColor="@color/color_view_history"
                android:textSize="13sp" />

        </RelativeLayout>

        <ImageView
            android:id="@+id/imgExpand"
            android:src="@drawable/ic_crm_accepted"
            app:layout_anchor="@id/layoutContent"
            app:layout_anchorGravity="center|bottom"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />

    </android.support.design.widget.CoordinatorLayout>

我遇到的问题是下拉图像没有放置到水平线的中心，而是放在该线的上方。请帮忙

Answer 1

这是解决您问题的方法。我没有使用嵌套的相对布局的协调器，而是使用 LinearLayout 和嵌套的 FrameLayout 和 LinearLayout

这是布局xml

<LinearLayout android:id="@+id/layoutDocumentVerification"
android:layout_below="@+id/layoutTitles"
android:layout_marginTop="16dp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal">

<FrameLayout
    android:layout_width="wrap_content"
    android:layout_height="match_parent"
    android:layout_marginLeft="16dp"
    android:layout_marginRight="16dp">

    <ImageView
        android:id="@+id/imgExpand"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:padding="5dp"
        android:src="@drawable/ic_crm_accepted"/>
</FrameLayout>

<LinearLayout
    android:id="@+id/layoutContent"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <ImageView
        android:id="@+id/imgDocVerification"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />

    <TextView
        android:id="@+id/lblDocVerify"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginBottom="8dp"
        android:text="Document Verification"
        android:textSize="14sp"
        android:textColor="@android:color/black"/>

    <TextView
        android:id="@+id/lblUploadDoc"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginBottom="8dp"
        android:text="Please upload your documents"
        android:textSize="13sp"
        android:textColor="@android:color/darker_gray"/>

    <TextView
        android:id="@+id/lblKnowMore"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Know more"
        android:textAllCaps="true"
        android:textStyle="bold"
        android:textColor="@android:color/holo_orange_dark"
        android:textSize="13sp" />
</LinearLayout>

如果您需要带自定义字体的TextView，则应在自定义主题中设置 fontFamily 属性。

Answer 2

由于“文档验证”TextView，如果它不在中心，您无法将图像居中，那么您将无法将图像设置为居中水平线。您可以先从“文档验证”TextView

中删除下面的行

android:layout_toRightOf="@+id/imgDocVerification"

然后用下面的线居中你的图像。然后你可以在中心水平线设置它。

   android:layout_centerVertical="true"

无法在相对布局方面对齐imageview

2 个答案: