如何使用ConstraintLayout缩小第一个视图以适合剩余空间? [英] How can I use ConstraintLayout to have the first View shrink to fit remaining space?
问题描述
我的布局如下.注意,Z
位于Y
下方,但仅限于底部.在Y
和Z
之间有一个不错的间隙,这是由多余的垂直空间提供的.这是我期望和实际的行为,当垂直空间过多时.
但是,显示键盘时,我没有足够的垂直空间.
所需的行为(没有多余的垂直空间):当我用完垂直空间时,我希望发生以下情况:X
(ScrollView
),缩小以填充剩余的空间,允许Y
和Z
以全尺寸显示.
实际行为(没有多余的垂直空间) Y
缩小.
我的来源在下面.在两种情况下(垂直空间过多,垂直空间都没有)如何修改它以达到我想要的行为?
<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">
<ScrollView
android:id="@+id/scrollView"
android:layout_width="match_parent"
android:layout_height="0dp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#fbe9e7"
android:gravity="center"
android:text="X"
android:textSize="96sp">
</TextView>
</ScrollView>
<TextView
android:id="@+id/text_Y"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#f3e5f5"
android:gravity="center"
android:text="Y"
android:textSize="96sp"
app:layout_constraintTop_toBottomOf="@+id/scrollView" />
<TextView
android:id="@+id/text_Z"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#e1f5fe"
android:gravity="center"
android:text="Z"
android:textSize="96sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/text_Y"
app:layout_constraintVertical_bias="1" />
</androidx.constraintlayout.widget.ConstraintLayout>
问题主要是由于X
滚动视图在垂直空间有限时需要为0dp
,而在wrap_content
垂直空间过多时需要
注意:您可以通过在Android Studio中的布局的预览窗格中相应地拖动右下角来演示布局在垂直空间较小的情况下的行为
尝试一下
<?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"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ScrollView
android:id="@+id/scrollView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constrainedHeight="true"
app:layout_constraintBottom_toTopOf="@+id/text_Y"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0"
app:layout_constraintVertical_chainStyle="packed">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#fbe9e7"
android:gravity="center"
android:text="X"
android:textSize="96sp">
</TextView>
</ScrollView>
<TextView
android:id="@+id/text_Y"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#f3e5f5"
android:gravity="center"
android:text="Y"
android:textSize="96sp"
app:layout_constraintBottom_toTopOf="@+id/text_Z"
app:layout_constraintTop_toBottomOf="@+id/scrollView"
app:layout_constraintVertical_bias="0" />
<TextView
android:id="@+id/text_Z"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#e1f5fe"
android:gravity="center"
android:text="Z"
android:textSize="96sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
I have the following layout. Notice Z
is positioned below Y
, but constrained to the bottom. There is a nice gap gap between Y
and Z
, afforded by the excess vertical space. This is my desired and actual behavior when there is excess vertical space.
However, I run out of excess vertical space when the keyboard is shown.
Desired Behavior (no excess vertical space) When I run out of vertical space, I would like the following to occur: X
(ScrollView
), shrinks to fill the remaining space, allowing Y
and Z
to be displayed at full size.
Actual Behavior (no excess vertical space) Y
shrinks instead.
My source is below. How can I modify it to get my desired behavior in both scenarios (excess vertical space and no excess vertical space)?
<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">
<ScrollView
android:id="@+id/scrollView"
android:layout_width="match_parent"
android:layout_height="0dp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#fbe9e7"
android:gravity="center"
android:text="X"
android:textSize="96sp">
</TextView>
</ScrollView>
<TextView
android:id="@+id/text_Y"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#f3e5f5"
android:gravity="center"
android:text="Y"
android:textSize="96sp"
app:layout_constraintTop_toBottomOf="@+id/scrollView" />
<TextView
android:id="@+id/text_Z"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#e1f5fe"
android:gravity="center"
android:text="Z"
android:textSize="96sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/text_Y"
app:layout_constraintVertical_bias="1" />
</androidx.constraintlayout.widget.ConstraintLayout>
The issue largely stems from the X
scrollview needing to be 0dp
when vertical space is limited, but wrap_content
when there is excess vertical space
Note: you can demo how the layout will behave with less vertical space by dragging the bottom right corner accordingly in the preview pane for a layout in Android Studio
try this
<?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"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ScrollView
android:id="@+id/scrollView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constrainedHeight="true"
app:layout_constraintBottom_toTopOf="@+id/text_Y"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0"
app:layout_constraintVertical_chainStyle="packed">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#fbe9e7"
android:gravity="center"
android:text="X"
android:textSize="96sp">
</TextView>
</ScrollView>
<TextView
android:id="@+id/text_Y"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#f3e5f5"
android:gravity="center"
android:text="Y"
android:textSize="96sp"
app:layout_constraintBottom_toTopOf="@+id/text_Z"
app:layout_constraintTop_toBottomOf="@+id/scrollView"
app:layout_constraintVertical_bias="0" />
<TextView
android:id="@+id/text_Z"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#e1f5fe"
android:gravity="center"
android:text="Z"
android:textSize="96sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
这篇关于如何使用ConstraintLayout缩小第一个视图以适合剩余空间?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!