I've tried app:layout_constraintBottom_toTopOf="#id/the_view_which_will_remain_below" but it's not the desired output.
I want the same behavior from RelativeLayout's layout_above.
With this code my Textview starts appearing from the bottom and as the character increases texts goes above. But I want the texts to start from starting of parent.
<?xml version="1.0" encoding="utf-8"?>
<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="match_parent"
android:padding="16dp"
tools:context="com.fatimamostafa.restfulwebservices.asynctask.AsyncTaskRequest">
<LinearLayout
android:id="#+id/ll"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:weightSum="2"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintBottom_toBottomOf="parent">
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Run" />
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Clear" />
</LinearLayout>
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintBottom_toTopOf="#id/ll"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
android:textSize="160sp"
android:text="Text"
/>
</android.support.constraint.ConstraintLayout>
To put the text at the top of the parent and the LinearLayout at the bottom contraint the top of the text view to parent and un-constraint it from the the LinearLayout:
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Text"
android:textSize="160sp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
/>
<LinearLayout
android:id="#+id/ll"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:weightSum="2"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
>
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Run" />
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Clear" />
</LinearLayout>
I have removed some constraints that I think were redundant.
Also note you can put the TextView obove the LinearLayout using "#+id" instead of #id.
If you want to constraint the text floating between the parent top and the Linear layout add these constraints to the TextView, and adjust the vertical bias between 0 and 1.
app:layout_constraintBottom_toTopOf="#+id/ll"
app:layout_constraintVertical_bias="0.2"
You can use height 0dp and organize views vertically.
in relative layout we can use layout below and above like
<FrameLayout
android:id="#+id/frame_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#+id/bottom_nav"
android:layout_below="#+id/toolbar"
/>
In constraint layout giving height is compulsory so you can give 0 height. and then you can set your view below other views like this
<android.support.v4.view.ViewPager
android:layout_width="match_parent"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/tablayout" />
you can use constraintTop_toBottomOf and constraintBottom_toTopOf properties to adjust your view to above or below of other.
thanks
Related
I am getting error in LinearLayout tag while using linearlayout in constraintlayout
<?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="match_parent"
android:layout_height="match_parent"
tools:context="com.example.tourwip2.LoginActivity">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Login"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Username: "
/>
<EditText
android:id="#+id/edtUsername"
android:layout_width="match_parent"
android:layout_height="wrap_content"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Password: "
/>
<EditText
android:id="#+id/edtPassword"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:inputType="textPassword"
/>
<Button
android:id="#+id/btnLogin"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Login"
/>
</LinearLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
Is there any way to resolve that?
In order to use any layout or view inside a ConstraintLayout you must provide constraints.
Just add these lines inside your XML in your LinearLayout tag
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
After adding your code should look like
<androidx.appcompat.widget.LinearLayoutCompat
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
tools:ignore="MissingConstraints"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent" >
You need to provide constraints to all view inside Constraint Layout, also this applies for ViewGroups like Linear Layout, and Relative Layout.
Mainly you have to provide X, Y, X-end, Y-end, width or height, any 4 from them.
These bottom simple XML additions to Linear Layout will solve your problem.
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
I have two TextViews and a ScrollView nested in a ConstraintLayout. Inside the ScrollView there is a TableLayout. The ScrollView's left, right and bottom constraints are set to "parent". The top constraint is set to the TextView just before it. Here is the XML:
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom">
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginTop="16dp"
android:layout_marginEnd="16dp"
android:text="TextView"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/textView6"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="TextView"
android:textSize="16dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/textView2" />
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/textView6">
<TableLayout
android:layout_width="fill_parent"
android:layout_height="match_parent"
android:layout_marginStart="32dp"
android:layout_marginTop="32dp"
android:layout_marginEnd="32dp"
android:layout_marginBottom="32dp"
android:gravity="center"
android:stretchColumns="0,1,2,3,4">
<TableRow
android:layout_width="fill_parent"
android:layout_weight="1">
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="1" />
... 4 more TextViews
</TableRow>
... many more TableRows
</TableLayout>
</ScrollView>
</androidx.constraintlayout.widget.ConstraintLayout>
The problem is that the ScrollView's width does not match its constraints. Instead, when more rows are added such that the ScrollView is taller than the its parent's remaining height, it overlaps the TextView just before it. The two screenshots below illustrate the problem:
No overlap:
Overlap:
When I set the ScrollView height to "0dp" (match constraints) it renders literally as 0dp (The ScrollView shrinks and none of its contents are shown).
What should I change to make the ScrollView expand and fill the remaining height of its parent container?
I would suggest several points (I couldn't figure out which one is critical):
1. You shouldn't use match_parent for child views of a ConstraintLayout. Instead, use '0dp'.
Official training:
Note: You cannot use match_parent for any view in a ConstraintLayout. Instead use "match constraints" (0dp).
2. You should not use #+id/xxx but use #id/xxx to specify other views. The former is for creating a new id.
Change ConstraintLayout's layout_height to match_parent.
Change TableLayout's layout_height to wrap_content.
My result:
layout.xml:
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout 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:context=".MainActivity">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="bottom">
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginTop="16dp"
android:layout_marginEnd="16dp"
android:text="TextView"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/textView6"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="TextView"
android:textSize="16dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/textView2" />
<ScrollView
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/textView6">
<TableLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginStart="32dp"
android:layout_marginTop="32dp"
android:layout_marginEnd="32dp"
android:layout_marginBottom="32dp"
android:gravity="center"
android:stretchColumns="0,1,2,3,4">
<TableRow
android:layout_width="fill_parent"
android:layout_weight="1">
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="1" />
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="2" />
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="3" />
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="4" />
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="5" />
</TableRow>
<!-- plenty of TableRows... -->
</TableLayout>
</ScrollView>
</androidx.constraintlayout.widget.ConstraintLayout>
</FrameLayout>
You need to correctly constrain your widgets for ConstraintLayout to be able to correctly measure and laid out your views.
In short:
The Top TextView needs to be the head of the vertical chain (app:layout_constraintVertical_chainStyle="packed"), and must have a bottom constraint (bottom_to_Topof...):
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginTop="16dp"
android:layout_marginEnd="16dp"
android:text="TextView"
app:layout_constrainedHeight="true"
app:layout_constraintVertical_chainStyle="packed"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toTopOf="#id/textView6" />
The textView is constrainedHeight = true because you want it to wrap_content, and widgets that have text, can have some problems when wrapped in constraint layouts (see this other answer for more info about why that may be needed).
The Second TextView, needs to be pinned as well to some bottom, in this case the scrollView...
<TextView
android:id="#+id/textView6"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constrainedHeight="true"
android:text="TextView"
android:textSize="16dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/textView2"
app:layout_constraintBottom_toTopOf="#id/scrollView" />
Now they are chained together, but the ScrollView needs some action...
Simply pin the scrollview to the bottom, so it can pull from somewhere, and give it the 0dp you need, so it can calculate its size/position based on the constrains.
<ScrollView
android:id="#+id/scrollView"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/textView6">
(also give it a name/id...)
This causes CL to calculate space/sizing correctly and to avoid the overlaps you complain about, since it now has clear rules about what can go where.
When you omit a constrain (like bottom), especially when there are stupid widgets around like ScrollViews, you can have unpredictable behavior based on the contents, something that is hard to anticipate and fix. Always, when in doubt, try to give all widgets all the constrains you can.
I have a constraint layout with a ViewStub inside it. I have added constraints to the viewStub. but, I wanted to move it down a bit and I tried to use vertical bias but it doesn't move at all. any idea why?
here is my Viewstub
<ViewStub
android:id="#+id/no_data_viewstub"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout="#layout/no_data_layout"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/cardView2"
app:layout_constraintVertical_bias="0.71000004" />
here is the layout that I use in the views tub
<?xml version="1.0" encoding="utf-8"?>
<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:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="32dp"
android:layout_marginBottom="16dp"
android:fontFamily="#font/montserrat_medium"
android:text="#string/oops"
android:textColor="#color/azure"
android:textSize="24sp" />
<ImageView
android:id="#+id/imageView11"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:srcCompat="#drawable/ic_nodata" />
<TextView
android:id="#+id/textView38"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginTop="16dp"
android:fontFamily="#font/montserrat_medium"
android:gravity="center"
android:text="#string/no_data"
android:textColor="#color/error_massage"
android:textSize="18sp" />
</LinearLayout>
I found out that this was a simple error. view stub height can not be match constraint.
in order to change the bias, it needs to have a hight of wrap content.
ConstraintLayout is powerful but tricky sometimes.
I want to implement a layout with the ConstraintLayout which can be easily achieved with the LinearLayout.
The Blue area is parent constraintLayout. The red part is LinearLayout. I want to convert this LinearLayout to ConstraintLayout by maintaining the following conditions
All children (Buttons)'s width should match the widest child.
The widest child is not fixed. It will be changed at runtime.
The red box should remain to maintain wrap_content.
I have tried with doing with barrier, guidelines and other properties of constraint layout without success.
Here is the code with LinearLayout:
<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="match_parent"
android:background="#476dce"
android:padding="16dp">
<LinearLayout
android:orientation="vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
android:background="#f5aaaa">
<Button
android:id="#+id/button1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Button"
tools:text="Small" />
<Button
android:id="#+id/button2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Button"
tools:text="Bigggggeer" />
<Button
android:id="#+id/button3"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Button"
tools:text="Even Bigggggggggeer" />
</LinearLayout>
</android.support.constraint.ConstraintLayout>
The current 1.1 stable release allows a tricky solution based on Barriers and separate backgrounds.
<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="match_parent">
<View
android:id="#+id/background"
android:layout_width="0dp"
android:layout_height="0dp"
android:background="#f5aaaa"
app:layout_constraintBottom_toBottomOf="#+id/button3_txt"
app:layout_constraintLeft_toLeftOf="#+id/left_barrier"
app:layout_constraintRight_toRightOf="#+id/right_barrier"
app:layout_constraintTop_toTopOf="#+id/button1_txt" />
<TextView
android:id="#+id/button1_txt"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:elevation="8dp"
android:padding="16dp"
android:text="small"
app:layout_constraintBottom_toTopOf="#+id/button2_txt"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_chainStyle="packed" />
<TextView
android:id="#+id/button2_txt"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:elevation="8dp"
android:padding="16dp"
android:text="Bigggggeer"
app:layout_constraintBottom_toTopOf="#+id/button3_txt"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#+id/button1_txt" />
<TextView
android:id="#+id/button3_txt"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:elevation="8dp"
android:padding="16dp"
android:text="Even Bigggggggggeer"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#+id/button2_txt" />
<Button
android:id="#+id/button1"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="#+id/button1_txt"
app:layout_constraintLeft_toLeftOf="#+id/left_barrier"
app:layout_constraintRight_toRightOf="#+id/right_barrier"
app:layout_constraintTop_toTopOf="#+id/button1_txt" />
<Button
android:id="#+id/button2"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="#+id/button2_txt"
app:layout_constraintLeft_toLeftOf="#+id/left_barrier"
app:layout_constraintRight_toRightOf="#+id/right_barrier"
app:layout_constraintTop_toTopOf="#+id/button2_txt" />
<Button
android:id="#+id/button3"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="#+id/button3_txt"
app:layout_constraintLeft_toLeftOf="#+id/left_barrier"
app:layout_constraintRight_toRightOf="#+id/right_barrier"
app:layout_constraintTop_toTopOf="#+id/button3_txt" />
<android.support.constraint.Barrier
android:id="#+id/right_barrier"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:barrierDirection="end"
app:constraint_referenced_ids="button1_txt, button2_txt, button3_txt" />
<android.support.constraint.Barrier
android:id="#+id/left_barrier"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:barrierDirection="start"
app:constraint_referenced_ids="button1_txt, button2_txt, button3_txt" />
</android.support.constraint.ConstraintLayout>
We can separate texts from buttons, and set two barriers at each end to track the biggest text between the three TextViews. So now, Buttons act only as a background and as click zones, and, they are set to match constraint between the two barriers.
You might want to be careful with elevation related to texts as Buttons have elevation by default.
Of course, if you are not into Buttons' animated elevation, change them to views.
Finally, ConstraintLayout has the chains feature to mimic LinearLayout's behavior in a more flexible way.
Hope this helps!
Here is the modified layout using ConstraintLayout
<?xml version="1.0" encoding="utf-8"?>
<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="match_parent"
android:background="#476dce"
android:padding="16dp">
<android.support.constraint.ConstraintLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#f5aaaa"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<Button
android:id="#+id/button1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Button"
tools:text="Small" />
<Button
android:id="#+id/button2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Button"
app:layout_constraintTop_toBottomOf="#id/button1"
tools:text="Bigggggeer" />
<Button
android:id="#+id/button3"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Button"
app:layout_constraintTop_toBottomOf="#id/button2"
tools:text="Even Bigggggggggeer" />
</android.support.constraint.ConstraintLayout>
</android.support.constraint.ConstraintLayout>
I have a ConstraintLayout inside a NestedScrollView. The ConstraintLayout contains a bunch of views but the last View can have a dynamic height to fill up the bottom space if there is any but it also needs to be a minimum height if there is not enough space.
For arguments sake, here is an example.
<android.support.v4.widget.NestedScrollView
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
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"
tools:layout_height="match_parent">
<View
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintHeight_min="1500dp"
android:background="#color/red"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintTop_toTopOf="parent"/>
</android.support.constraint.ConstraintLayout>
</android.support.v4.widget.NestedScrollView>
As you can see I have put the ConstraintLayout version in but it doesn't work. Obviously the values are ridiculously large but this is just for testing.
If I don't set fillViewport="true" on the NestedScrollView then ConstraintLayout has a height of 0. When I do set the fillViewport, the ConstraintLayout does not scroll but just fills the screen.
How can I set the View so that it expands to the bottom of the ConstraintLayout which should be as big as the Viewport but if my View is not of the minHeight then we allow scrolling?
I am using version 1.0.2 of the ConstraintLayout library.
What I expect to see is the being all the way to the bottom of the parent but if that size is less than 1500dp then the view scrolls.
I have entered 1500dp like so android:layout_height="1500dp" and the view scrolls accordingly.
UPDATE 1
Seems to be once I put the layout within a FragmentViewPager. The app:layout_constraintHeight_min property isn't respected and it only matches the height of the viewport.
I also tried taking the NestedScrollView out of the fragment and putting the ViewPager inside it but again didn't work.
Add this attribute to the view you'd like to have stretch:
app:layout_constraintHeight_default="spread"
I made a tiny app to demonstrate. No java logic to speak of, but here's the layout:
<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.NestedScrollView
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:fillViewport="true">
<android.support.constraint.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="16dp"
android:background="#caf">
<TextView
android:id="#+id/one"
android:layout_width="0dp"
android:layout_height="48dp"
android:gravity="center"
android:text="hello world"
android:background="#fff"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintBottom_toTopOf="#+id/two"/>
<TextView
android:id="#+id/two"
android:layout_width="0dp"
android:layout_height="48dp"
android:gravity="center"
android:text="hello world"
android:background="#eee"
app:layout_constraintTop_toBottomOf="#+id/one"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintBottom_toTopOf="#+id/three"/>
<TextView
android:id="#+id/three"
android:layout_width="0dp"
android:layout_height="0dp"
android:gravity="center"
android:text="hello world"
android:background="#ddd"
app:layout_constraintHeight_default="spread"
app:layout_constraintHeight_min="300dp"
app:layout_constraintTop_toBottomOf="#+id/two"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintBottom_toBottomOf="parent"/>
</android.support.constraint.ConstraintLayout>
</android.support.v4.widget.NestedScrollView>
The bottom view stretches to fill the viewport when it is smaller than the remaining available space, and scrolling is impossible:
The bottom view maintains a fixed height when it is larger than the remaining available space, which makes scrolling possible:
I am using com.android.support.constraint:constraint-layout:1.0.2 and this works for me:
<android.support.v4.widget.NestedScrollView 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:orientation="vertical">
<android.support.constraint.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<View
android:layout_width="0dp"
android:layout_height="0dp"
android:background="#drawable/gradient"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHeight_min="1500dp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</android.support.constraint.ConstraintLayout>
</android.support.v4.widget.NestedScrollView>
As the first thing is we have to specify the fixed height to each text view or used wrap content as another option.Secondary inside constraint layout the property app:layout_constraintHeight_default="spread" helps the last view to get the remaining complete space left and if no space left then automatically synced to scroll view.
<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.NestedScrollView
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:fillViewport="true">
<android.support.constraint.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#caf"
android:padding="16dp">
<TextView
android:id="#+id/one"
android:layout_width="0dp"
android:layout_height="48dp"
android:background="#fff"
android:gravity="center"
android:text="hello world"
app:layout_constraintBottom_toTopOf="#+id/two"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/two"
android:layout_width="0dp"
android:layout_height="48dp"
android:background="#eee"
android:gravity="center"
android:text="hello world"
app:layout_constraintBottom_toTopOf="#+id/three"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#+id/one" />
<TextView
android:id="#+id/three"
android:layout_width="0dp"
android:layout_height="48dp"
android:background="#eee"
android:gravity="center"
android:text="hello world"
app:layout_constraintBottom_toTopOf="#+id/four"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#+id/two" />
<TextView
android:id="#+id/four"
android:layout_width="0dp"
anroid:layout_height="48dp"
android:background="#eee"
android:gravity="center"
android:text="hello world"
app:layout_constraintBottom_toTopOf="#+id/five"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#+id/three" />
<TextView
android:id="#+id/five"
android:layout_width="0dp"
android:layout_height="0dp"
android:background="#ddd"
android:gravity="center"
android:text="hello world"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintHeight_default="spread"
app:layout_constraintHeight_min="300dp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#+id/three" />
</android.support.constraint.ConstraintLayout>
</android.support.v4.widget.NestedScrollView>