CardView in ConstraintLayout Not Wrapping Height.
Facing the similar issue with stable CL library:
compile 'com.android.support.constraint:constraint-layout:1.0.2'
Android Studio: 2.3.2
Observations:
Setting hardcoded cardview-height fixes the issue.
Changing CardView with RelativeLayout fixes.
Is there still an issue with Cardview that it is finding hard to cope up with ConstraintLayout.
XML:
<?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"
tools:layout_editor_absoluteX="0dp"
tools:layout_editor_absoluteY="25dp">
<android.support.v7.widget.CardView
android:id="#+id/cardView"
android:layout_width="0dp"
android:layout_height="122dp"
android:layout_marginBottom="8dp"
android:layout_marginEnd="8dp"
android:layout_marginLeft="8dp"
android:layout_marginRight="8dp"
android:layout_marginStart="8dp"
app:cardBackgroundColor="#color/io15_blue_grey_100"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintHeight_default="wrap"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintWidth_default="spread">
<android.support.constraint.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/mobLeftIcon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
android:layout_marginTop="8dp"
app:layout_constraintBottom_toBottomOf="#+id/mobInputLayout"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toLeftOf="#+id/mobInputLayout"
app:layout_constraintTop_toTopOf="#+id/mobInputLayout"
app:srcCompat="#drawable/ic_up" />
<android.support.design.widget.TextInputLayout
android:id="#+id/mobInputLayout"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
app:layout_constraintLeft_toRightOf="#+id/mobLeftIcon"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent">
<EditText
android:id="#+id/editText4"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Mobile Number"
android:text="123123123" />
</android.support.design.widget.TextInputLayout>
<ImageView
android:id="#+id/phoneLeftIcon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
android:layout_marginTop="8dp"
app:layout_constraintBottom_toBottomOf="#+id/phoneInputLayout"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toLeftOf="#+id/phoneInputLayout"
app:layout_constraintTop_toTopOf="#+id/phoneInputLayout"
app:srcCompat="#drawable/ic_up" />
<android.support.design.widget.TextInputLayout
android:id="#+id/phoneInputLayout"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
app:layout_constraintLeft_toRightOf="#+id/phoneLeftIcon"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#id/mobInputLayout">
<EditText
android:id="#+id/editText5"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Telphone Number"
android:text="123123123" />
</android.support.design.widget.TextInputLayout>
</android.support.constraint.ConstraintLayout>
</android.support.v7.widget.CardView>
</android.support.constraint.ConstraintLayout>
Screenshot:
To make CardView wrap content represented by ConstraintLayout, you have to add 3 chains to views inside ConstraintLayout:
Horizontal spread chain between mobLeftIcon and mobInputLayout
Horizontal spread chain between phoneLeftIcon and phoneInputLayout
Vertical spread chain between mobInputLayout and phoneInputLayout
See this screenshot of Layout Editor:
Here's the final source code for your layout:
<android.support.constraint.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.support.v7.widget.CardView
android:id="#+id/cardView"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:layout_marginStart="8dp"
android:layout_marginEnd="8dp"
android:layout_marginBottom="8dp"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintBottom_toBottomOf="parent">
<android.support.constraint.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/mobLeftIcon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:layout_marginStart="16dp"
android:layout_marginBottom="8dp"
app:srcCompat="#drawable/ic_up"
app:layout_constraintTop_toTopOf="#+id/mobInputLayout"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintBottom_toBottomOf="#+id/mobInputLayout"
app:layout_constraintEnd_toStartOf="#+id/mobInputLayout"
app:layout_constraintHorizontal_chainStyle="spread" />
<android.support.design.widget.TextInputLayout
android:id="#+id/mobInputLayout"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:layout_marginStart="16dp"
android:layout_marginEnd="8dp"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintStart_toEndOf="#+id/mobLeftIcon"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintBottom_toTopOf="#+id/phoneInputLayout"
app:layout_constraintVertical_chainStyle="spread">
<EditText
android:id="#+id/editText4"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Mobile Number"
android:text="123123123" />
</android.support.design.widget.TextInputLayout>
<ImageView
android:id="#+id/phoneLeftIcon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:layout_marginStart="16dp"
android:layout_marginBottom="8dp"
app:srcCompat="#drawable/ic_up"
app:layout_constraintTop_toTopOf="#+id/phoneInputLayout"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintBottom_toBottomOf="#+id/phoneInputLayout"
app:layout_constraintEnd_toStartOf="#+id/phoneInputLayout"
app:layout_constraintHorizontal_chainStyle="spread" />
<android.support.design.widget.TextInputLayout
android:id="#+id/phoneInputLayout"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:layout_marginStart="16dp"
android:layout_marginEnd="8dp"
app:layout_constraintTop_toBottomOf="#+id/mobInputLayout"
app:layout_constraintStart_toEndOf="#+id/phoneLeftIcon"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintBottom_toBottomOf="parent">
<EditText
android:id="#+id/editText5"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Telphone Number"
android:text="123123123" />
</android.support.design.widget.TextInputLayout>
</android.support.constraint.ConstraintLayout>
</android.support.v7.widget.CardView>
</android.support.constraint.ConstraintLayout>
As a result, you get something like:
<android.support.v7.widget.CardView
android:id="#+id/cardView"
android:layout_width="0dp"
android:layout_height="122dp"
You can use the height as 0dp and use the line
app:layout_constraintHeight_default="wrap"
Related
This layout is part of my learning process. So please don't judge the use of textview for displaying data.
The problem is i am not able to scroll the entire data in the bottom textview. Always 2 sets of data is left behind.
If i have 8 sets,the scrollview will show up to 6 sets. If i have 4 set it will show 2 sets and wont scroll at all. What's the problem with my scrollview?
<?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="wrap_content"
tools:context=".FireStoreNotes">
<com.google.android.material.textfield.TextInputLayout
android:id="#+id/textInputLayout"
style="#style/Widget.MaterialComponents.TextInputLayout.OutlinedBox"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginTop="16dp"
android:layout_marginEnd="8dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<com.google.android.material.textfield.TextInputEditText
android:id="#+id/editText_title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="#string/title" />
</com.google.android.material.textfield.TextInputLayout>
<com.google.android.material.textfield.TextInputLayout
android:id="#+id/textInputLayout2"
style="#style/Widget.MaterialComponents.TextInputLayout.OutlinedBox"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginTop="16dp"
android:layout_marginEnd="8dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/textInputLayout">
<com.google.android.material.textfield.TextInputEditText
android:id="#+id/editText_description"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="#string/description" />
</com.google.android.material.textfield.TextInputLayout>
<com.google.android.material.textfield.TextInputLayout
android:id="#+id/textInputLayout3"
style="#style/Widget.MaterialComponents.TextInputLayout.OutlinedBox"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginTop="16dp"
android:layout_marginEnd="8dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/textInputLayout2">
<com.google.android.material.textfield.TextInputEditText
android:id="#+id/editText_priority"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="#string/priority"
android:inputType="number" />
</com.google.android.material.textfield.TextInputLayout>
<com.google.android.material.button.MaterialButton
android:id="#+id/button_add"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginTop="16dp"
android:layout_marginEnd="16dp"
android:text="#string/add_notes"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/textInputLayout3" />
<com.google.android.material.button.MaterialButton
android:id="#+id/button_load"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginTop="8dp"
android:layout_marginEnd="16dp"
android:text="#string/load_notes"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/button_add" />
<androidx.core.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginTop="8dp"
android:layout_marginEnd="16dp"
android:paddingBottom="?android:attr/actionBarSize"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/button_load">
<TextView
android:id="#+id/textView_loadData"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textSize="20sp" />
</androidx.core.widget.NestedScrollView>
</androidx.constraintlayout.widget.ConstraintLayout>
This is how my layout looks.
Thanks in advance.
Edit ConstraintLayout root layout_height (match_parent instead of wrap_content)
For NestedScrollView :
Replace layout_widthand layout_height values by 0dpfor applying constraints.
Add a bottom constraint with app:layout_constraintBottom_toBottomOf="parent"
I'm trying to show a RecyclerView ("mapRecyclerView") below another ConstraintLayout ("clientData) inside a ConstraintLayout but it presents a strange behavior: RecyclerView ("mapRecyclerView") has a Top Constraint to the bottom of another ConstraintLayout ("clientData"), if this ConstraintLayout has width as specific dp the recyclerview shows fine but if the ConstraintLayout has a width of "match_constraint" the RecyclerView is not visible anymore and the "afterMeasured" event of the RecyclerView is never called, here is the XML of the layout:
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<androidx.appcompat.widget.Toolbar
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/toolbar"
android:layout_width="0dp"
android:layout_height="?attr/actionBarSize"
android:minHeight="?attr/actionBarSize"
android:background="#android:color/white"
android:elevation="4dp" app:layout_constraintStart_toStartOf="parent"
android:fontFamily="#font/gotham_rounded_book"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent" android:theme="#style/custom_toolbar"/>
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="0dp"
android:layout_height="wrap_content" app:layout_constraintTop_toBottomOf="#+id/toolbar"
app:layout_constraintStart_toStartOf="parent"
android:id="#+id/clientData" android:background="#color/white"
app:layout_constraintEnd_toEndOf="parent">
<TextView
android:text="1"
android:layout_width="35dp"
android:layout_height="35dp"
android:id="#+id/activeServiceNumber"
android:background="#drawable/button_yellow_round_border" android:textAlignment="center"
android:textSize="18sp"
app:layout_constraintTop_toTopOf="#+id/name" android:layout_marginStart="8dp"
app:layout_constraintStart_toStartOf="parent"
android:fontFamily="#font/gotham_rounded_medium"
android:paddingTop="6dp" android:textColor="#color/white" android:layout_marginTop="8dp"/>
<TextView
android:text="TextView"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:id="#+id/name"
app:layout_constraintStart_toEndOf="#+id/activeServiceNumber" android:layout_marginStart="8dp"
android:fontFamily="#font/gotham_rounded_medium" android:textColor="#color/colorPrimaryText"
android:textSize="16sp" android:layout_marginEnd="8dp"
android:layout_marginBottom="8dp" app:layout_constraintBottom_toTopOf="#+id/client"
app:layout_constraintTop_toTopOf="parent" android:layout_marginTop="8dp"
app:layout_constraintEnd_toStartOf="#+id/directionsBtn"/>
<TextView
android:text="TextView"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:id="#+id/client"
app:layout_constraintStart_toEndOf="#+id/activeServiceNumber" android:layout_marginStart="8dp"
android:fontFamily="#font/gotham_rounded_light" android:textSize="15sp" android:layout_marginEnd="8dp"
android:layout_marginBottom="8dp"
app:layout_constraintBottom_toTopOf="#+id/address"
app:layout_constraintEnd_toStartOf="#+id/directionsBtn"/>
<TextView
android:text="TextView"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:id="#+id/address"
app:layout_constraintStart_toEndOf="#+id/activeServiceNumber" android:layout_marginStart="8dp"
android:fontFamily="#font/gotham_rounded_light" android:textSize="13sp" android:layout_marginEnd="8dp"
android:layout_marginBottom="8dp"
app:layout_constraintBottom_toTopOf="#+id/phone"
app:layout_constraintEnd_toStartOf="#+id/directionsBtn"/>
<TextView
android:text="TextView"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:id="#+id/phone"
app:layout_constraintStart_toEndOf="#+id/activeServiceNumber" android:layout_marginStart="8dp"
android:textSize="13sp" android:fontFamily="#font/gotham_rounded_light" android:layout_marginEnd="8dp"
app:layout_constraintBottom_toBottomOf="parent" android:layout_marginBottom="16dp"
app:layout_constraintEnd_toStartOf="#+id/directionsBtn"/>
<Button
android:layout_width="wrap_content"
android:layout_height="0dp"
android:id="#+id/directionsBtn"
app:layout_constraintEnd_toEndOf="parent"
android:text="Mostrar \nRuta"
android:drawableTop="#drawable/ic_go_to_route" android:textAllCaps="false"
android:background="#color/white"
android:padding="10dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintTop_toTopOf="parent"/>
</androidx.constraintlayout.widget.ConstraintLayout>
<fragment xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/ongoingServiceMap"
android:name="com.google.android.gms.maps.SupportMapFragment"
android:layout_width="match_parent"
android:layout_height="0dp"
android:clickable="true"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
tools:context="com.cargamos.cargamosdriver.views.service.OngoingServiceActivity"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintBottom_toBottomOf="parent" android:focusable="true"
app:layout_constraintTop_toBottomOf="#+id/clientData"/>
<androidx.recyclerview.widget.RecyclerView
android:layout_width="wrap_content"
android:layout_marginTop="32dp"
android:layout_marginBottom="32dp"
app:layout_constraintStart_toStartOf="#+id/ongoingServiceMap"
android:layout_marginStart="8dp"
android:id="#+id/mapRecyclerView"
android:background="#color/white"
app:layout_constraintBottom_toTopOf="#+id/confirmArrivalSlider"
android:layout_height="0dp"
app:layout_constraintTop_toBottomOf="#+id/clientData"/>
<com.ncorti.slidetoact.SlideToActView
android:id="#+id/confirmArrivalSlider"
android:layout_width="0dp"
android:layout_height="wrap_content"
app:text="Confirmar llegada"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:slider_height="60dp"
app:area_margin="4dp"
app:outer_color="#color/colorPrimary" app:text_style="bold" app:text_size="18dp"
android:layout_marginStart="32dp" android:layout_marginBottom="24dp" android:layout_marginEnd="32dp"/>
</androidx.constraintlayout.widget.ConstraintLayout>
Depending on what items you have in your RecyclerView, you probably want to set the width of the RecyclerView to match_parent.
By the way, I can't reproduce the problem you describe in the preview
I'm writing an application for a project. My question is how can I set shadow beetween the first and the second constraint layout?
Should I need to create a xml in drawabale to add to the main one?
I post the xml below and if it is necessary to place the java code also.
<?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:id="#+id/constraintLayout"
android:layout_width="350dp"
android:layout_height="310dp"
android:background="#ff6600">
<android.support.constraint.ConstraintLayout
android:layout_width="290dp"
android:layout_height="266dp"
android:background="#f2f2f2"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.266"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.491">
<TextView
android:id="#+id/textView"
android:layout_width="212dp"
android:layout_height="157dp"
android:layout_marginStart="8dp"
android:layout_marginTop="16dp"
android:layout_marginEnd="8dp"
android:layout_marginBottom="8dp"
android:gravity="center"
android:text="Vuoi registrarti al Torneo?"
android:textAlignment="center"
android:textColor="#000"
android:textSize="20dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.105" />
<Button
android:id="#+id/Btn_yes"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:layout_marginEnd="8dp"
android:layout_marginBottom="8dp"
android:text="SI"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toStartOf="#+id/Btn_No"
app:layout_constraintHorizontal_bias="0.508"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/textView"
app:layout_constraintVertical_bias="0.512" />
<Button
android:id="#+id/Btn_No"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:layout_marginEnd="8dp"
android:layout_marginBottom="8dp"
android:text="NO"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.845"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/textView"
app:layout_constraintVertical_bias="0.512" />
</android.support.constraint.ConstraintLayout>
</android.support.constraint.ConstraintLayout>
Thanks for the answers.
You can use Cardview Like this:
app:cardUseCompactPadding = "true"
Also mention android:hardwareAccelerated="true" in your manifest file
<android.support.v7.widget.CardView
android:id="#+id/card_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginRight="5dp"
app:cardBackgroundColor="#color/colorprimary"
app:cardCornerRadius="5dp"
app:cardUseCompatPadding="true"
app:elevation="0dp">
</android.support.v7.widget.CardView>
I'm having a ViewPager and a RecyclerView in layout file. I want to make the entire layout Scrollable. That is i want the ViewPager to be scrolled up. Hence, i added <ScrollView> as the root layout.
Issue:
The problem i'm facing is that the RecyclerView in scrolling as expected, but the ViewPager area is fixed.
The Below Image depicts the issue mentioned above:
The xml code of my layout file is as shown below:
<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:orientation="vertical"
android:fillViewport="true"
android:layout_width="match_parent"
android:layout_height="match_parent">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<androidx.constraintlayout.widget.Guideline
android:id="#+id/home_viewpager_guideline"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
app:layout_constraintGuide_percent="0.4" />
<androidx.viewpager.widget.ViewPager
android:id="#+id/home_view_pager"
android:layout_width="match_parent"
android:layout_height="0dp"
app:layout_constraintBottom_toTopOf="#+id/home_viewpager_guideline"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="1.0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<LinearLayout
android:id="#+id/home_viewpager_dots_layout"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:layout_marginBottom="16dp"
android:gravity="center"
android:orientation="horizontal"
app:layout_constraintBottom_toTopOf="#+id/home_viewpager_guideline"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="1.0"></LinearLayout>
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/linearLayout3"
android:layout_width="match_parent"
android:layout_height="0dp"
android:background="#color/latest_news_bg"
app:layout_constraintBottom_toTopOf="#+id/latest_news_guideline"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/home_view_pager">
<View
android:id="#+id/divider2"
android:layout_width="0dp"
android:layout_height="3dp"
android:background="#color/gray"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.16"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="parent"
app:layout_constraintVertical_bias="1.0" />
<TextView
android:id="#+id/latest_news_txt"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginLeft="8dp"
android:layout_marginTop="8dp"
android:layout_marginEnd="8dp"
android:layout_marginRight="8dp"
android:layout_marginBottom="8dp"
android:text="Latest News"
android:textColor="#color/dark_gray"
android:textSize="22sp"
app:layout_constraintBottom_toTopOf="#+id/divider2"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
<androidx.constraintlayout.widget.Guideline
android:id="#+id/latest_news_guideline"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
app:layout_constraintGuide_percent="0.51" />
<TextView
android:id="#+id/home_article_type_txt"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginLeft="16dp"
android:layout_marginTop="8dp"
android:layout_marginEnd="16dp"
android:layout_marginRight="16dp"
android:fontFamily="sans-serif-medium"
android:text="Featured Article"
android:textColor="#color/pf_white"
android:textSize="20sp"
app:layout_constraintBottom_toTopOf="#+id/home_viewpager_dots_layout"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.02"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.65" />
<TextView
android:id="#+id/home_article_title_txt"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginLeft="16dp"
android:layout_marginTop="8dp"
android:layout_marginEnd="16dp"
android:layout_marginRight="16dp"
android:layout_marginBottom="8dp"
android:text="What better way to put your health and wellbeing first than"
android:textColor="#color/pf_white"
android:textSize="20sp"
android:textStyle="bold"
app:layout_constraintBottom_toTopOf="#+id/home_viewpager_dots_layout"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.05"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/home_article_type_txt"
app:layout_constraintVertical_bias="0.0" />
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/home_article_list"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginStart="8dp"
android:layout_marginLeft="8dp"
android:layout_marginEnd="8dp"
android:layout_marginRight="8dp"
android:layout_marginBottom="8dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="1.0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/linearLayout3"
app:layout_constraintVertical_bias="1.0" />
</androidx.constraintlayout.widget.ConstraintLayout>
</ScrollView>
What have i tried?
As mentioned in this answer Android ScrollView not Scrolling
, i have tried setting the ScrollView orientation to vertical and fillViewPort property to true, but the problem still persists.
I have also tried using NestedScrollView as the root, but that too didn't work.
If someone can suggest me how to go about with this, it will be really helpful to anyone facing such issue.
I'm seeing a ConstraintLayout occasionally fail to draw correctly, but only when I switch between fragments, and I'm not seeing why.
It looks like this initially:
But, after switching tabs, it looks like this:
fragment_overview.xml (The Fragment layout)
<android.support.constraint.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/palette_grey_light"
android:clipToPadding="false"
android:paddingTop="16dp">
<uk.lobsterdoodle.edinburghwolves.view.FixtureView
android:id="#+id/overview_fixture_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
... a few other views ...
</android.support.constraint.ConstraintLayout>
fixture_view.xml (The custom view layout, FixtureView)
<?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"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<View
android:id="#+id/fixture_away_color"
android:layout_width="0dp"
android:layout_height="0dp"
android:background="#color/palette_red"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toStartOf="#+id/fixture_home_color"
app:layout_constraintHorizontal_chainStyle="spread"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"/>
<View
android:id="#+id/fixture_home_color"
android:layout_width="0dp"
android:layout_height="0dp"
android:background="#color/palette_grey"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_chainStyle="spread"
app:layout_constraintStart_toEndOf="#+id/fixture_away_color"
app:layout_constraintTop_toTopOf="parent"/>
<TextView
android:id="#+id/fixture_away_team_score"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_marginEnd="8dp"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:text="27"
android:textColor="#color/palette_white"
android:textSize="24sp"
app:layout_constraintEnd_toEndOf="#+id/fixture_away_team_name"
app:layout_constraintStart_toStartOf="#+id/fixture_away_team_name"
app:layout_constraintTop_toTopOf="parent"/>
<TextView
android:id="#+id/fixture_away_team_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:layout_marginEnd="32dp"
android:text="WOLVES"
android:textColor="#color/palette_white"
android:textSize="16sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toStartOf="#+id/fixture_home_color"
app:layout_constraintTop_toBottomOf="#+id/fixture_away_team_score"
app:layout_constraintVertical_bias="0.0"
android:layout_marginTop="0dp"/>
<TextView
android:id="#+id/fixture_home_team_score"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_marginEnd="8dp"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:text="21"
android:textColor="#color/palette_white"
android:textSize="24sp"
app:layout_constraintEnd_toEndOf="#+id/fixture_home_team_name"
app:layout_constraintStart_toStartOf="#+id/fixture_home_team_name"
app:layout_constraintTop_toTopOf="parent"/>
<TextView
android:id="#+id/fixture_home_team_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:layout_marginStart="32dp"
android:text="PIRATES"
android:textColor="#color/palette_white"
android:textSize="16sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="#+id/fixture_home_color"
android:layout_marginTop="0dp"
app:layout_constraintTop_toBottomOf="#+id/fixture_home_team_score"/>
<TextView
android:id="#+id/fixture_state"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="8dp"
android:layout_marginStart="8dp"
android:text="FINAL"
android:textColor="#color/palette_white"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintBottom_toBottomOf="#+id/fixture_away_team_score"
android:layout_marginBottom="0dp"
/>
</android.support.constraint.ConstraintLayout>
While your fixture_view.xml file constrains views in the ConstraintLayout properly, a view in the ConstraintLayout in fragment_overview.xml isn't constrained, so they won't display properly at runtime. Add some some constraints to your FixtureView in fragment_overview.xml like so:
<android.support.constraint.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/palette_grey_light"
android:clipToPadding="false"
android:paddingTop="16dp">
<!-- You were missing constraints here -->
<uk.lobsterdoodle.edinburghwolves.view.FixtureView
android:id="#+id/overview_fixture_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent" />
<android.support.v7.widget.CardView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginEnd="16dp"
android:layout_marginStart="16dp"
android:layout_marginTop="16dp"
app:cardBackgroundColor="#color/palette_white"
app:cardElevation="2dp"
app:contentPadding="16dp"
app:layout_constraintTop_toBottomOf="#id/overview_fixture_view"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="standings"
android:textColor="#color/palette_grey"/>
</android.support.v7.widget.CardView>
</android.support.constraint.ConstraintLayout>
Fixed, by making the score TextView's height wrap_content instead of matching constraint of 0dp
<TextView
android:id="#+id/fixture_away_team_score"
android:layout_width="wrap_content"
android:layout_height="wrap_content" <-- wrap, not 0dp
...
/>