根据孩子的大小动态调整布局宽度

时间:2019-12-17 10:05:40

标签: android android-layout android-constraintlayout

我有一个对话框布局,其中包含标题,消息和两个按钮。我目前正在使用约束布局。

我希望对话框动态地显示标题的大小,但是当标题的宽度小于按钮的组合宽度时,我希望对话框将其大小调整为按钮的宽度。同时保持消息也正确显示。

现在发生的是,当“标题”宽度小于“按钮”的组合宽度时,“按钮”将重叠,并且消息将被裁剪为与标题相同的大小。

这是我当前的XML布局文件。

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 
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:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/dialog_title_background"
tools:ignore="SmallSp">

  <View
    android:id="@+id/background_gradient"
    android:layout_width="0dp"
    android:layout_height="0dp"
    app:layout_constraintTop_toTopOf="parent"
    app:layout_constraintBottom_toBottomOf="parent"
    android:layout_marginTop="57dp"
    app:layout_constraintStart_toStartOf="parent"
    android:background="@drawable/button_message_dialog_background"
    app:layout_constraintEnd_toEndOf="parent"/>

  <TextView
    android:id="@+id/title"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:fontFamily="@font/ubuntu_light"
    android:layout_marginStart="37dp"
    android:layout_marginEnd="37dp"
    android:textColor="@color/color_primary_interactive_theme1"
    android:textSize="18sp"
    app:layout_constrainedWidth="true"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintBottom_toTopOf="@id/background_gradient"
    app:layout_constraintTop_toTopOf="parent" />

  <TextView
    android:id="@+id/message"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:layout_marginStart="37dp"
    android:layout_marginTop="19dp"
    android:layout_marginEnd="37dp"
    android:fontFamily="@font/ubuntu_light"
    android:textColor="@color/dialog_body_text_color"
    android:textSize="13sp"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="@id/background_gradient"/>

  <androidx.constraintlayout.widget.ConstraintLayout
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:paddingStart="37dp"
    android:paddingEnd="37dp"
    android:paddingBottom="30dp"
    app:layout_constrainedWidth="true"
    android:paddingTop="15dp"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toBottomOf="@id/message">

     <TextView
        android:id="@+id/button1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@drawable/dialog_button_background"
        android:fontFamily="@font/ubuntu_light"
        android:paddingStart="13dp"
        android:paddingTop="3dp"
        android:paddingEnd="13dp"
        android:paddingBottom="3dp"
        android:textColor="@color/white"
        app:layout_constraintEnd_toStartOf="@id/button2"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

     <TextView
        android:id="@+id/button2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@drawable/dialog_button_background"
        android:fontFamily="@font/ubuntu_light"
        android:layout_marginStart="5dp"
        android:paddingStart="13dp"
        android:paddingTop="3dp"
        android:paddingEnd="13dp"
        android:paddingBottom="3dp"
        android:textColor="@color/white"
        app:layout_constraintBottom_toBottomOf="@id/button1"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toEndOf="@id/button1"
        app:layout_constraintTop_toTopOf="@id/button1" />

   </androidx.constraintlayout.widget.ConstraintLayout>

</androidx.constraintlayout.widget.ConstraintLayout>

任何反馈都非常感谢。

更新

我添加了两个示例来更清楚地说明我的问题。

Dialog with long title

Dialog with short title

在第一个示例中,“标题”宽度比“按钮”的组合宽度长,如果是这种情况,则布局应将其大小调整为“标题”的宽度,而“按钮2”的末端应与标题的末端对齐。

在第二个示例中,标题短于Buttons的组合宽度,如果是这种情况,则布局应将其大小调整为2个Buttons的宽度。

在两种情况下,消息也可以是长字符串,但是可以将其剪切掉,但应正确显示。 提前致谢。

1 个答案:

答案 0 :(得分:0)

已使用ConstraintLayout

中提供的 Chains 功能解决
  

在此处找到完整的文档:Control linear groups with a chain

这是您的答案

<androidx.constraintlayout.widget.ConstraintLayout 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:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:background="#efefef"
    tools:ignore="SmallSp">

<View
        android:id="@+id/background_gradient"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:layout_marginTop="57dp"
        android:background="#a1a1a1"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

<TextView
        android:id="@+id/title"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginStart="37dp"
        android:layout_marginEnd="37dp"
        android:textColor="#F44336"
        android:textSize="18sp"
        app:layout_constrainedWidth="true"
        android:text="Title Text"
        app:layout_constraintBottom_toTopOf="@id/background_gradient"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

<TextView
        android:id="@+id/message"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="37dp"
        android:layout_marginTop="19dp"
        android:layout_marginEnd="37dp"
        android:textColor="#000000"
        android:textSize="13sp"
        android:text="Message"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="@id/background_gradient" />

<TextView
        android:id="@+id/button1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="#FFFFFF"
        android:paddingStart="13dp"
        android:paddingTop="3dp"
        android:paddingEnd="13dp"
        android:text="Button 1"
        android:paddingBottom="3dp"
        android:textColor="@color/colorAccent"
        app:layout_constraintEnd_toStartOf="@id/button2"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@id/message" />

<TextView
        android:id="@+id/button2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="#FFFFFF"
        android:paddingStart="13dp"
        android:paddingTop="3dp"
        android:paddingEnd="13dp"
        android:text="Button 2"
        android:paddingBottom="3dp"
        android:textColor="@color/colorAccent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintBaseline_toBaselineOf="@id/button1"
        app:layout_constraintStart_toEndOf="@id/button1" />
</androidx.constraintlayout.widget.ConstraintLayout>
相关问题