[英]Is it possible to put a ConstraintLayout inside a ScrollView?
So recently, with Android Studio 2.2 there's a new ConstraintLayout that makes designing a lot easier, but unlike RelativeLayout
and Linearlayout
, I can't use a ScrollView
to surround ConstraintLayout
.所以最近,Android Studio 2.2 有一个新的 ConstraintLayout 使设计变得容易得多,但与RelativeLayout
和Linearlayout
不同,我不能使用ScrollView
来包围ConstraintLayout
。 Is this possible?这可能吗? If so, how?如果是这样,如何?
ie IE
<ScrollView 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="match_parent"
android:layout_height="match_parent"
tools:layout_editor_absoluteX="0dp"
tools:layout_editor_absoluteY="0dp">
<android.support.constraint.ConstraintLayout
android:id="@+id/constraintLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:layout_editor_absoluteX="0dp"
tools:layout_editor_absoluteY="0dp">
<!-- Have whatever children you want inside -->
</android.support.constraint.ConstraintLayout>
</ScrollView>
Try adding android:fillViewport="true"
to the ScrollView.尝试将android:fillViewport="true"
到 ScrollView。
Found the solution here: LinearLayout not expanding inside a ScrollView在这里找到解决方案: LinearLayout not expand inside a ScrollView
There was a bug with ConstraintLayout inside ScrollViews and it has been fixed. ScrollViews 中的 ConstraintLayout 有一个错误,它已被修复。 google has fixed the bug in Android Studio 2.2 Preview 2 (constraintlayout 1.0.0-alpha2). google 已修复 Android Studio 2.2 Preview 2 (constraintlayout 1.0.0-alpha2) 中的错误。
Check this link for new update (Preview 2): works properly inside ScrollView and RecycleView检查此链接以获取新更新(预览 2): 在 ScrollView 和 RecycleView 中正常工作
Solution 1:解决方案1:
The solution was to use
android:fillViewport="true"
on theScrollView
解决方案是在ScrollView
上使用android:fillViewport="true"
Solution 2:解决方案2:
Use
NestedScrollView
instead ofScrollView
withandroid:fillViewport="true"
在android:fillViewport="true"
使用NestedScrollView
而不是ScrollView
Edit - 09/16/20:编辑 - 09/16/20:
Currently, it is more usual to use the ScrollView with the ConstraintLayout height set to wrap_content, it works very well, don't forget the fillViewPort and that both Scroll and Nested support only one direct child.目前,更常用的是将 ScrollView 的 ConstraintLayout 高度设置为 wrap_content,它工作得很好,不要忘记 fillViewPort 并且 Scroll 和 Nested 都只支持一个直接子级。
use NestedScrollView
with viewport true is working good for me使用带有视口 true 的NestedScrollView
对我很有用
<android.support.v4.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true">
<android.support.constraint.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="700dp">
</android.support.constraint.ConstraintLayout>
</android.support.v4.widget.NestedScrollView>
不要忘记,如果您将某些视图的底部约束到约束布局的底部。Scrollview 无法滚动。
Set ScrollView
layout_height
as a wrap_content
then it will work fine.将ScrollView
layout_height
设置为wrap_content
然后它会正常工作。 Below are example which may help someone.以下是可能对某人有所帮助的示例。 I have used compile 'com.android.support.constraint:constraint-layout:1.0.2'
for constraint layout.我使用compile 'com.android.support.constraint:constraint-layout:1.0.2'
进行约束布局。
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout
android:orientation="vertical"
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="match_parent"
android:layout_height="match_parent"
android:id="@+id/activity_main"
tools:context=".ScrollViewActivity">
<ScrollView
android:layout_width="0dp"
android:layout_height="wrap_content"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
>
<android.support.constraint.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="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:paddingLeft="8dp"
android:paddingRight="8dp"
android:scrollbars="vertical">
<TextView
android:id="@+id/tvCommonSurname"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="surname"
android:textAppearance="?android:attr/textAppearanceLarge"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toTopOf="parent"
tools:layout_constraintLeft_creator="1"
tools:layout_constraintTop_creator="1" />
<EditText
android:id="@+id/editText3"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:ems="10"
android:inputType="text"
android:maxLines="1"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="@+id/tvCommonSurname"
tools:layout_constraintLeft_creator="1"
tools:layout_constraintRight_creator="1"
tools:layout_constraintTop_creator="1" />
<TextView
android:id="@+id/tvCommonName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:text="firstName"
android:textAppearance="?android:attr/textAppearanceLarge"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toBottomOf="@+id/editText3"
tools:layout_constraintLeft_creator="1"
tools:layout_constraintTop_creator="1" />
<EditText
android:id="@+id/editText"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:ems="10"
android:inputType="text"
android:maxLines="1"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="@+id/tvCommonName"
tools:layout_constraintLeft_creator="1"
tools:layout_constraintRight_creator="1"
tools:layout_constraintTop_creator="1" />
<TextView
android:id="@+id/tvCommonLastName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:text="middleName"
android:textAppearance="?android:attr/textAppearanceLarge"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toBottomOf="@+id/editText"
tools:layout_constraintLeft_creator="1"
tools:layout_constraintTop_creator="1" />
<EditText
android:id="@+id/editText2"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:ems="10"
android:inputType="text"
android:maxLines="1"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="@+id/tvCommonLastName"
tools:layout_constraintLeft_creator="1"
tools:layout_constraintRight_creator="1"
tools:layout_constraintTop_creator="1" />
<TextView
android:id="@+id/tvCommonPhone"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:text="Phone number"
android:textAppearance="?android:attr/textAppearanceLarge"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toBottomOf="@+id/editText2"
tools:layout_constraintLeft_creator="1"
tools:layout_constraintTop_creator="1" />
<EditText
android:id="@+id/editText4"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:digits="0123456789"
android:ems="10"
android:inputType="phone"
android:maxLength="10"
android:maxLines="1"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="@+id/tvCommonPhone"
tools:layout_constraintLeft_creator="1"
tools:layout_constraintRight_creator="1"
tools:layout_constraintTop_creator="1" />
<TextView
android:id="@+id/textView3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:text="sex"
android:textAppearance="?android:attr/textAppearanceLarge"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toBottomOf="@+id/editText4"
tools:layout_constraintLeft_creator="1"
tools:layout_constraintTop_creator="1" />
<RadioGroup
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/radiogroup"
android:layout_width="0dp"
android:layout_height="48dp"
android:layout_marginTop="8dp"
android:orientation="horizontal"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toBottomOf="@+id/textView3"
tools:layout_constraintLeft_creator="1"
tools:layout_constraintTop_creator="1">
<RadioButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="pirates" />
<RadioButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="ninjas" />
</RadioGroup>
<TextView
android:id="@+id/tvCommonDOB"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:text="dob"
android:textAppearance="?android:attr/textAppearanceLarge"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toBottomOf="@+id/radiogroup"
tools:layout_constraintLeft_creator="1"
tools:layout_constraintTop_creator="1" />
<EditText
android:id="@+id/editText5"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:ems="10"
android:inputType="date"
android:maxLines="1"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="@+id/tvCommonDOB"
tools:layout_constraintLeft_creator="1"
tools:layout_constraintRight_creator="1"
tools:layout_constraintTop_creator="1" />
<TextView
android:id="@+id/tvCommonLivingCity"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:text="livingCity"
android:textAppearance="?android:attr/textAppearanceLarge"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toBottomOf="@+id/editText5"
tools:layout_constraintLeft_creator="1"
tools:layout_constraintTop_creator="1" />
<EditText
android:id="@+id/editText34"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:ems="10"
android:inputType="text"
android:maxLines="1"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="@+id/tvCommonLivingCity"
tools:layout_constraintLeft_creator="1"
tools:layout_constraintRight_creator="1"
tools:layout_constraintTop_creator="1" />
<TextView
android:id="@+id/tvCommonPlaceOfBithday"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:text="placeOfBirth"
android:textAppearance="?android:attr/textAppearanceLarge"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toBottomOf="@+id/editText34"
tools:layout_constraintLeft_creator="1"
tools:layout_constraintTop_creator="1" />
<EditText
android:id="@+id/editText6"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:ems="10"
android:inputType="text"
android:maxLines="1"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="@+id/tvCommonPlaceOfBithday"
tools:layout_constraintLeft_creator="1"
tools:layout_constraintRight_creator="1"
tools:layout_constraintTop_creator="1" />
<TextView
android:id="@+id/textView4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:text="education"
android:textAppearance="?android:attr/textAppearanceLarge"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toBottomOf="@+id/editText6"
tools:layout_constraintLeft_creator="1"
tools:layout_constraintTop_creator="1" />
<Spinner
android:id="@+id/spinner_id"
android:layout_width="0dp"
android:layout_height="48dp"
android:layout_marginTop="8dp"
android:spinnerMode="dialog"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="@+id/textView4"
tools:layout_constraintLeft_creator="1"
tools:layout_constraintRight_creator="1"
tools:layout_constraintTop_creator="1" />
</android.support.constraint.ConstraintLayout>
</ScrollView>
</android.support.constraint.ConstraintLayout>
Use NestedScrollView
with android:fillViewport="true"
将NestedScrollView
与android:fillViewport="true"
一起使用
<android.support.v4.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true">
<android.support.constraint.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<!--Edit your stuff-->
</android.support.constraint.ConstraintLayout>
</android.support.v4.widget.NestedScrollView>
Try giving some padding bottom to your constraint layout like below尝试为您的约束布局提供一些填充底部,如下所示
<ScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="@+id/top"
android:fillViewport="true">
<android.support.constraint.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingBottom="100dp">
</android.support.constraint.ConstraintLayout>
</ScrollView>
Anyone who has set below property to任何将以下属性设置为
ScrollView: : android:fillViewport="true"
滚动android:fillViewport="true"
:: android:fillViewport="true"
constraint layout: android:layout_height="wrap_content"
约束布局: android:layout_height="wrap_content"
And it's still not working then make sure then you have not set the Inner scrollable layout (RecycleView) bottom constraint to bottom of the parent.并且它仍然不起作用然后确保您没有将内部可滚动布局(RecycleView)底部约束设置为父级的底部。
Add below lines of code:添加以下代码行:
android:nestedScrollingEnabled="false"
android:layout_height="wrap_content"
Make sure to remove below constraint:确保删除以下约束:
app:layout_constraintBottom_toBottomOf="parent"
Full code完整代码
<androidx.core.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true">
<androidx.constraintlayout.widget.ConstraintLayout
android:id="@+id/selectHubLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
tools:context=".ui.hubs.SelectHubFragment">
<include
android:id="@+id/include"
layout="@layout/signup_hub_selection_details"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<androidx.recyclerview.widget.RecyclerView
android:id="@+id/rv_HubSelection"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:nestedScrollingEnabled="false"
app:layoutManager="androidx.recyclerview.widget.LinearLayoutManager"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="1.0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/include" />
</androidx.constraintlayout.widget.ConstraintLayout>
Since the actual ScrollView
is encapsulated in a CoordinatorLayout
with a Toolbar
...由于实际的ScrollView
被封装在一个带有Toolbar
的CoordinatorLayout
......
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="@style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar
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="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:popupTheme="@style/AppTheme.PopupOverlay"/>
</android.support.design.widget.AppBarLayout>
<include layout="@layout/list"/>
</android.support.design.widget.CoordinatorLayout>
... I had to define android:layout_marginTop="?attr/actionBarSize"
to make the scrolling working: ...我必须定义android:layout_marginTop="?attr/actionBarSize"
以使滚动工作:
<?xml version="1.0" encoding="utf-8"?>
<ScrollView
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="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="?attr/actionBarSize">
<android.support.constraint.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_behavior="@string/appbar_scrolling_view_behavior">
<!-- UI elements here -->
</android.support.constraint.ConstraintLayout>
</ScrollView>
Above also works with NestedScrollView
instead of ScrollView
.以上也适用于NestedScrollView
而不是ScrollView
。 Defining android:fillViewport="true"
is not needed for me.我不需要定义android:fillViewport="true"
。
I've spent 2 days attempting to convert layouts to ConstraintLayout
in the so-called "stable" release Android Studio 2.2 and I've not got ScrollView
to work in the designer.我花了 2 天时间尝试在所谓的“稳定”版本 Android Studio 2.2 中将布局转换为ConstraintLayout
,但我没有让ScrollView
在设计器中工作。 I'm not going to start down the route of adding constraints in XML for Views
that are further down the scroll.我不打算开始在 XML 中为滚动进一步向下的Views
添加约束的路线。 After all this is supposed to be a visual design tool.毕竟这应该是一个视觉设计工具。
And the number of rendering errors, stack overflows and theme issues I've had has led me to conclude that the whole ConstraintLayout
implementation is still riddled with bugs.我所遇到的渲染错误、堆栈溢出和主题问题的数量使我得出结论,整个ConstraintLayout
实现仍然充斥着错误。 Unless you are developing simple layouts then I'd leave it well alone until it's had a few more iterations at least.除非您正在开发简单的布局,否则我会保持原样,直到它至少有更多的迭代。
That's 2 days I'm not going to get back.那是2天我不会回来。
I had NestedScrollView inside ConstraintLayout , and this NestedScrollView has one ConstraintLayout .我在 ConstraintLayout 中有NestedScrollView ,而这个NestedScrollView 有一个 ConstraintLayout 。
If you're facing issue with NestedScrollView
,如果您遇到NestedScrollView
问题,
add android:fillViewport="true"
to NestedScrollView, worked.添加android:fillViewport="true"
到 NestedScrollView,工作。
I had an error that ConstraintLayout is not allowed, then i added android.support.constraint.ConstraintLayout and is working. 我有一个错误,不允许ConstraintLayout,然后我添加android.support.constraint.ConstraintLayout并正在工作。 I'm a beginner and don't understand why. 我是初学者,不明白为什么。
PROBLEM:问题:
I had a problem with ConstraintLayout and ScrollView when i wanted to include it in another layout.当我想将 ConstraintLayout 和 ScrollView包含在另一个布局中时,我遇到了问题。
DECISION:决定:
The solution to my problem was to use dataBinding.我的问题的解决方案是使用数据绑定。
Don't forget about tools:context=".YouClassName"
property in ScrollView
.不要忘记ScrollView
tools:context=".YouClassName"
属性。
It is what was causing my application to crash.这就是导致我的应用程序崩溃的原因。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.