Material Cardview - Children not getting clipped < API 28 - android

When putting a nested scroll view inside a material card view with rounded corners and scrolling there is a bug where other material card views dont get clipped and there edges spill over the rounded corners. Text views and viewpager objects got there corners clipped fine. This bug appears on api 28 and below.
Does anyone know a work around for this?
<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:id="#+id/fragment_workout_container"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="framework.presentation.workouts.WorkoutFragment"
>
<com.google.android.material.appbar.AppBarLayout
android:id="#+id/app_bar_workout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:contentInsetStart="0dp"
app:elevation="0dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<include
android:id="#+id/toolbar_workout_navigation"
layout="#layout/toolbar_home" />
</com.google.android.material.appbar.AppBarLayout>
<com.google.android.material.card.MaterialCardView
style="#style/cv_style_all_rounded"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_marginBottom="#dimen/cv_margin_bottom"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/app_bar_workout"
app:strokeColor="#color/dividerColor"
app:strokeWidth="0.5dp">
<androidx.core.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true"
android:overScrollMode="never"
>
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/home_header_image"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="#drawable/home_header" />
<com.google.android.material.textview.MaterialTextView
android:id="#+id/home_title"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="32dp"
android:layout_marginTop="#dimen/header_margin_top"
android:layout_marginEnd="32dp"
android:gravity="center"
android:text="#string/home_title"
android:textSize="?attr/textAppearanceHeadline5"
android:textStyle="bold"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/home_header_image" />
<com.google.android.material.textview.MaterialTextView
android:id="#+id/home_description"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="32dp"
android:layout_marginTop="#dimen/description_margin_top"
android:layout_marginEnd="32dp"
android:gravity="center"
android:text="#string/home_description"
android:textSize="?attr/textAppearanceHeadline6"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/home_title" />
<View
android:id="#+id/divider_home"
android:layout_width="match_parent"
android:layout_height="1dp"
android:layout_marginStart="#dimen/workout_intro_left_right_margin"
android:layout_marginTop="#dimen/divider_margin_top"
android:layout_marginEnd="#dimen/workout_intro_left_right_margin"
android:background="?android:attr/dividerVertical"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/home_description" />
<androidx.viewpager2.widget.ViewPager2
android:id="#+id/quotesViewPager2"
android:layout_width="0dp"
android:layout_height="150dp"
android:layout_marginStart="#dimen/start_end_padding"
android:layout_marginTop="32dp"
android:layout_marginEnd="#dimen/start_end_padding"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/divider_home" />
<com.google.android.material.textview.MaterialTextView
android:id="#+id/tvFeaturedVideo"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginTop="32dp"
android:layout_marginEnd="16dp"
android:text="#string/featured_video"
android:textSize="?attr/textAppearanceHeadline6"
android:textStyle="bold"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/quotesViewPager2" />
<com.google.android.material.card.MaterialCardView
android:id="#+id/cvFeaturedVideo"
style="#style/cv_style_home_layout"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_marginStart="#dimen/start_end_padding"
android:layout_marginTop="8dp"
android:layout_marginEnd="#dimen/start_end_padding"
android:clipChildren="true"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/tvFeaturedVideo">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/featuredThumbNail"
android:layout_width="0dp"
android:layout_height="210dp"
android:layout_marginBottom="12dp"
android:adjustViewBounds="false"
android:scaleType="centerCrop"
app:layout_constraintBottom_toTopOf="#+id/featuredVideoTitle"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/featuredVideoTitle"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="32dp"
android:layout_marginEnd="32dp"
android:layout_marginBottom="12dp"
android:maxLines="1"
android:text="TextView"
android:textAlignment="center"
android:textSize="18sp"
android:textStyle="bold"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="parent" />
<ImageView
android:id="#+id/youtubeIcon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintBottom_toBottomOf="#+id/featuredThumbNail"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="#drawable/youtube_logo_icon_150px" />
</androidx.constraintlayout.widget.ConstraintLayout>
</com.google.android.material.card.MaterialCardView>
Steps to recreate:
Constraint layout > Material card view (main container) > Nested Scroll View > Additional material card views (enough to scroll) & API 28 and below


In your Cardview, add the property in your xml:
cardPreventCornerOverlap="false"

Related

how to make a constraint layout scrollable

Hello I'm trying to make one of my fragment's layout scrollable but can't reach my goal despite having looking for a solution during many hours. I removed all of the layout_constraintBottom_toBottomOf="parent" constraints inside the main constraint layout and also set the height of the layout to wrap_content. Finally I set the fillViewPort attribute of the scrollView to true but the result remains the same. Can someone help me please ?
Here's my .xml file :
<?xml version="1.0" encoding="utf-8"?>
<ScrollView
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_height="match_parent"
android:layout_width="match_parent"
android:fillViewport="true">
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/layout"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ProgressBar
android:id="#+id/challengeProgressBar"
style="#android:style/Widget.DeviceDefault.Light.ProgressBar.Large"
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_marginTop="300dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<ImageView
android:id="#+id/errorImageView"
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_marginTop="300dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/visibleLayout"
android:layout_width="0dp"
android:layout_height="match_parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<TextView
android:id="#+id/profileNameTextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/profileImageView" />
<ImageView
android:id="#+id/profileImageView"
android:layout_width="150dp"
android:layout_height="150dp"
android:layout_marginStart="143dp"
android:layout_marginTop="45dp"
android:layout_marginEnd="143dp"
android:padding="5dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
tools:src="#tools:sample/avatars" />
<TextView
android:id="#+id/uploadStatusTextView"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_marginTop="4dp"
android:layout_marginBottom="4dp"
app:layout_constraintBottom_toTopOf="#+id/profileImageView"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/nbPointsTextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="30dp"
android:textAppearance="#style/TextAppearance.AppCompat.Display1"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.498"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/profileNameTextView" />
<Button
android:id="#+id/completedChallengesButton"
android:layout_width="0dp"
android:layout_height="40dp"
android:layout_marginStart="75dp"
android:layout_marginTop="52dp"
android:layout_marginEnd="75dp"
android:text="#string/completed_challenges"
android:textSize="10sp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/nbPointsTextView" />
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/completedChallengesRecyclerView"
android:layout_width="0dp"
android:layout_height="150dp"
android:layout_marginStart="75dp"
android:layout_marginEnd="75dp"
android:background="#drawable/border"
android:visibility="visible"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/completedChallengesButton" />
<Button
android:id="#+id/challengesButton"
android:layout_width="0dp"
android:layout_height="40dp"
android:layout_marginStart="75dp"
android:layout_marginEnd="75dp"
android:text="#string/current_challenges"
android:textSize="10sp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/completedChallengesRecyclerView" />
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/challengesRecyclerView"
android:layout_width="0dp"
android:layout_height="150dp"
android:layout_marginStart="75dp"
android:layout_marginTop="8dp"
android:layout_marginEnd="75dp"
android:background="#drawable/border"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="1.0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/challengesButton" />
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
</ScrollView>

The cause is using scrollable view (RecyclerView) inside ScrollView, so you should put this one to your RecyclerView
android:nestedScrollingEnabled="false"
But the better solution is make whole screen into only one RecyclerView

how to make progress bar always in the center screen of scroll view and swipe refresh layout?

I have views hierarchy like this:
and here is my xml:
<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"
android:id="#+id/constraintLayout_profile">
<androidx.swiperefreshlayout.widget.SwipeRefreshLayout
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintTop_toTopOf="parent" android:id="#+id/swipeRefreshLayout_userControl">
<androidx.core.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="0dp"
android:background="#android:color/white"
android:id="#+id/scrollView_user_control"
app:layout_constraintStart_toStartOf="parent" app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<de.hdodenhof.circleimageview.CircleImageView
android:id="#+id/imageView_profile_image_user_information"
android:layout_width="80dp"
android:layout_height="80dp"
android:src="#drawable/user"
app:civ_border_width="0.5dp"
app:civ_border_color="#FF000000" android:layout_marginEnd="8dp"
app:layout_constraintEnd_toEndOf="parent"
android:layout_marginStart="8dp" app:layout_constraintStart_toStartOf="parent"
android:layout_marginTop="16dp" app:layout_constraintTop_toTopOf="parent"/>
<TextView
android:text="User Fullname"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/textView_user_fullname_user_information" android:layout_marginTop="16dp"
app:layout_constraintTop_toBottomOf="#+id/imageView_profile_image_user_information"
app:layout_constraintEnd_toEndOf="parent" android:layout_marginEnd="8dp"
app:layout_constraintStart_toStartOf="parent" android:layout_marginStart="8dp"
android:textSize="18sp"/>
<TextView
android:text="user#email.com"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/textView_user_email_user_information" app:layout_constraintEnd_toEndOf="parent"
android:layout_marginEnd="8dp"
app:layout_constraintStart_toStartOf="parent" android:layout_marginStart="8dp"
app:layout_constraintTop_toBottomOf="#+id/textView_user_fullname_user_information"
android:layout_marginTop="8dp"/>
<TextView
android:text="AKAN DIHADIRI"
android:layout_width="0dp"
android:layout_height="35dp"
android:id="#+id/textView_will_come_user_information" app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent" android:layout_marginTop="16dp"
app:layout_constraintTop_toBottomOf="#+id/textView_user_email_user_information"
android:gravity="center|left"
android:paddingStart="16dp" android:background="#D2D1D6"/>
<ImageView
android:src="#drawable/ic_settings"
android:layout_width="30dp"
android:layout_height="30dp"
android:id="#+id/imageView_gear_setting_user_information"
app:layout_constraintTop_toTopOf="#+id/imageView_profile_image_user_information"
app:layout_constraintEnd_toEndOf="parent" android:layout_marginEnd="24dp"/>
<androidx.recyclerview.widget.RecyclerView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:scrollbars="vertical"
app:layout_constraintTop_toBottomOf="#+id/textView_will_come_user_information"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
tools:listitem="#layout/item_general_event"
android:id="#+id/recyclerView_attended_event_user_control"
app:layout_constraintHorizontal_bias="1.0"
android:nestedScrollingEnabled="false">
</androidx.recyclerview.widget.RecyclerView>
<ImageView
android:id="#+id/imageView_verified_icon"
android:layout_width="20dp"
android:layout_height="20dp"
android:layout_marginTop="4dp"
android:layout_marginEnd="4dp"
app:layout_constraintEnd_toEndOf="#+id/imageView_profile_image_user_information"
app:layout_constraintTop_toTopOf="#+id/imageView_profile_image_user_information"
app:srcCompat="#drawable/verifiedicon" />
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.core.widget.NestedScrollView>
<ProgressBar
android:id="#+id/progressBar_user_control"
style="?android:attr/progressBarStyle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:visibility="visible" />
</androidx.swiperefreshlayout.widget.SwipeRefreshLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
as you can see, there is recycler view inside my scroll view, and also there is a swipe refresh layout wrap it all.
I want my progress bar will always be in the center of the screen. I have tried to read from here: How to make a ProgressBar stay in the center of screen despite scrolling . it is said that
You need the ScrollView to be at same level as ProgressDialog in your
Layout
I have tried to implement that, like the image above, but I don't know why my progress bar will not appear in the screen.
if I put the progress bar inside the scroll view like this:
the progress bar will appear, but not in the center of the screen. it depends of the number of items inside my recycler view. so how to solve this ?

Place your ProgressBar at the bottom of outer ConstraintLayout. Check below:
<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"
android:id="#+id/constraintLayout_profile">
<androidx.swiperefreshlayout.widget.SwipeRefreshLayout
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintTop_toTopOf="parent" android:id="#+id/swipeRefreshLayout_userControl">
<androidx.core.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="0dp"
android:background="#android:color/white"
android:id="#+id/scrollView_user_control"
app:layout_constraintStart_toStartOf="parent" app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<de.hdodenhof.circleimageview.CircleImageView
android:id="#+id/imageView_profile_image_user_information"
android:layout_width="80dp"
android:layout_height="80dp"
android:src="#drawable/user"
app:civ_border_width="0.5dp"
app:civ_border_color="#FF000000" android:layout_marginEnd="8dp"
app:layout_constraintEnd_toEndOf="parent"
android:layout_marginStart="8dp" app:layout_constraintStart_toStartOf="parent"
android:layout_marginTop="16dp" app:layout_constraintTop_toTopOf="parent"/>
<TextView
android:text="User Fullname"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/textView_user_fullname_user_information" android:layout_marginTop="16dp"
app:layout_constraintTop_toBottomOf="#+id/imageView_profile_image_user_information"
app:layout_constraintEnd_toEndOf="parent" android:layout_marginEnd="8dp"
app:layout_constraintStart_toStartOf="parent" android:layout_marginStart="8dp"
android:textSize="18sp"/>
<TextView
android:text="user#email.com"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/textView_user_email_user_information" app:layout_constraintEnd_toEndOf="parent"
android:layout_marginEnd="8dp"
app:layout_constraintStart_toStartOf="parent" android:layout_marginStart="8dp"
app:layout_constraintTop_toBottomOf="#+id/textView_user_fullname_user_information"
android:layout_marginTop="8dp"/>
<TextView
android:text="AKAN DIHADIRI"
android:layout_width="0dp"
android:layout_height="35dp"
android:id="#+id/textView_will_come_user_information" app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent" android:layout_marginTop="16dp"
app:layout_constraintTop_toBottomOf="#+id/textView_user_email_user_information"
android:gravity="center|left"
android:paddingStart="16dp" android:background="#D2D1D6"/>
<ImageView
android:src="#drawable/ic_settings"
android:layout_width="30dp"
android:layout_height="30dp"
android:id="#+id/imageView_gear_setting_user_information"
app:layout_constraintTop_toTopOf="#+id/imageView_profile_image_user_information"
app:layout_constraintEnd_toEndOf="parent" android:layout_marginEnd="24dp"/>
<androidx.recyclerview.widget.RecyclerView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:scrollbars="vertical"
app:layout_constraintTop_toBottomOf="#+id/textView_will_come_user_information"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
tools:listitem="#layout/item_general_event"
android:id="#+id/recyclerView_attended_event_user_control"
app:layout_constraintHorizontal_bias="1.0"
android:nestedScrollingEnabled="false">
</androidx.recyclerview.widget.RecyclerView>
<ImageView
android:id="#+id/imageView_verified_icon"
android:layout_width="20dp"
android:layout_height="20dp"
android:layout_marginTop="4dp"
android:layout_marginEnd="4dp"
app:layout_constraintEnd_toEndOf="#+id/imageView_profile_image_user_information"
app:layout_constraintTop_toTopOf="#+id/imageView_profile_image_user_information"
app:srcCompat="#drawable/verifiedicon" />
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.core.widget.NestedScrollView>
</androidx.swiperefreshlayout.widget.SwipeRefreshLayout>
<ProgressBar
android:id="#+id/progressBar_user_control"
style="?android:attr/progressBarStyle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
android:visibility="visible" />
</androidx.constraintlayout.widget.ConstraintLayout>

RecyclerView not showing in ConstraintLayout

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

Fragments ConstraintLayout is cut of in FrameLayout of activity

I have an activity LoginActivity and a fragment SignupSocialFragment.
The fragment is loaded inside of the FrameLayout inside the activity.
The problem is, that the LinearLayout (social_login_footer) in fragment which is constrained to the bottom of its parent is cut of when the fragment is displayed in the activity.
When I add padding/margin to the social_login_footerI can shift it into view but this does not work reliable.
Can anyone help with why the bottom part is cut of?
Shouldnt the ConstraintLayout match the height of its parent FrameLayout.
Code
activity_login.xml
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/login_constraint"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/colorBlack"
tools:context=".ui.login.LoginActivity">
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/login_constraint_2"
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_toTopOf="parent">
<com.airbnb.lottie.LottieAnimationView
android:id="#+id/login_lottie_animation"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="centerCrop"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:lottie_autoPlay="true"
app:lottie_fileName="background_rotation.json"
app:lottie_loop="true" />
</androidx.constraintlayout.widget.ConstraintLayout>
<ImageView
android:id="#+id/login_logo"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:layout_marginBottom="8dp"
android:adjustViewBounds="true"
android:contentDescription="#string/app_name"
android:scaleType="centerInside"
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.050000012"
app:srcCompat="#drawable/logo_white" />
<TextView
android:id="#+id/login_logo_subtitle"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:text="#string/slogan"
android:textColor="#color/colorWhite"
android:textSize="16sp"
android:translationY="-10dp"
app:layout_constraintEnd_toEndOf="#+id/login_logo"
app:layout_constraintStart_toStartOf="#+id/login_logo"
app:layout_constraintTop_toBottomOf="#id/login_logo" />
<FrameLayout
android:id="#+id/login_content"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginTop="8dp"
android:layout_marginBottom="16dp"
app:layout_constraintTop_toBottomOf="#+id/login_logo_subtitle"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
fragment_login_social.xml
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#300000CC "
android:paddingStart="32dp"
android:paddingEnd="32dp"
tools:context=".ui.login.SignupSocialFragment">
<TextView
android:id="#+id/login_social_text"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:layout_marginBottom="32dp"
android:fontFamily="#font/montserrat_light"
android:text="#string/login_subtitle"
android:textAlignment="center"
android:textSize="16sp"
app:layout_constraintBottom_toTopOf="#+id/social_login_email"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="1.0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<Button
android:id="#+id/social_login_email"
android:layout_marginTop="8dp"
android:layout_marginBottom="8dp"
android:text="#string/email_signup_btn"
app:layout_constraintBottom_toTopOf="#+id/social_login_facebook"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/login_social_text" />
<Button
android:id="#+id/social_login_facebook"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="4dp"
android:layout_marginBottom="8dp"
app:icon="#drawable/facebook_logo"
app:iconGravity="textStart"
app:layout_constraintBottom_toTopOf="#+id/social_login_google"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/social_login_email" />
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/social_login_google"
android:layout_width="0dp"
android:layout_height="60dp"
android:layout_marginTop="16dp"
android:background="#color/colorWhite"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/social_login_facebook">
<TextView
android:id="#+id/social_login_google_txt"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:layout_marginEnd="8dp"
android:layout_marginBottom="8dp"
android:text="#string/google_signup_btn"
android:textColor="#android:color/black"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<ImageView
android:id="#+id/social_login_google_logo"
android:layout_width="24dp"
android:layout_height="24dp"
android:layout_marginEnd="8dp"
android:src="#drawable/googleg_standard_color_18"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toStartOf="#+id/social_login_google_txt"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
<TextView
android:id="#+id/social_login_member"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:padding="4dp"
android:text="#string/already_member"
android:textSize="16sp"
android:clickable="true"
android:focusable="true"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/social_login_google" />
<LinearLayout
android:id="#+id/social_login_footer"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_marginBottom="8dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent">
<TextView
android:id="#+id/login_version"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/app_version"
android:layout_marginEnd="4dp"
android:textSize="12sp" />
<TextView
android:id="#+id/login_policy"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="4dp"
android:text="#string/privacy_link"
android:textSize="12sp" />
</LinearLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
Layout blueprints
Rendered on Nexus 5X API 28

After wasting some hours of my precious lifetime I have finally found it.
The problem is caused by the ImageViews android:adjustViewBounds="true" attribute.
After removing it everything works as expected.

Try adding android:fitsSystemWindows="true" to fragment_login_social.xml first child view

Android ConstraintLayout sometimes doesn't draw correctly after switching between tabs

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
...
/>

Categories

Resources