Question

我正在尝试创建一个与此相似的布局不管设备屏幕大小如何，该值始终相同

这里的约束是

需要重叠视图
- 为此，我必须使用相对布局
TextView必须根据设备屏幕大小更改其大小
- 为此，我必须使用线性布局

根据我的有限知识，但两者都存在冲突

这是我的代码，但这不是响应式设计

 <RelativeLayout 
     xmlns:android="http://schemas.android.com/apk/res/android"
     android:layout_width="match_parent"
     android:layout_height="match_parent">

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/topic_name_parent"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_alignParentStart="true"
    android:layout_alignParentTop="true"
    android:layout_marginStart="0dp"
    android:layout_marginTop="0dp"
    android:background="#795548"
    android:gravity="center"
    android:orientation="vertical"
    android:weightSum="5">

    <TextView
        android:id="@+id/topic_name"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_marginLeft="24dp"
        android:layout_marginRight="24dp"
        android:layout_weight="3"
        android:background="@drawable/rounded_corner"
        android:gravity="center"
        android:lineSpacingExtra="2sp"
        android:text="Demo"
        android:textColor="#000000"
        android:textSize="24sp" />
</LinearLayout>

<ImageView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentRight="true"
    android:layout_marginVertical="125dp"
    android:layout_marginHorizontal="25dp"
    android:src="@drawable/ic_outline_create_24px" />
</RelativeLayout>

Answer 1

使用 ConstraintLayout

尝试此操作

<androidx.constraintlayout.widget.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="match_parent"
    android:background="@color/colorPrimary">

    <TextView
        android:id="@+id/topic_name"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:gravity="center"
        android:lineSpacingExtra="2sp"
        android:text="Demo"
        android:textColor="#000000"
        android:textSize="24sp"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="@+id/guideline" />

    <android.support.constraint.Guideline
        android:id="@+id/guideline"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        app:layout_constraintGuide_percent="0.5" />

    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentEnd="true"
        android:layout_margin="10dp"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:srcCompat="@drawable/ic_close" />


</androidx.constraintlayout.widget.ConstraintLayout>

输出

如何创建具有重叠视图的响应式设计

1 个答案: