Recyclerview crop last and first items shadow - android

Recyclerview crop first and last items shadows and i cant't fix it with any attributes.
I have a such xml screen:
<?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=".screens.view.CreateRequestFragment">
<ScrollView
android:id="#+id/createRequestScrollView"
android:layout_width="match_parent"
android:layout_height="0dp"
app:layout_constraintBottom_toTopOf="#+id/sendRequestButton"
app:layout_constraintEnd_toEndOf="parent"
android:background="#color/transparent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<!-- ... some elements inside scrollview -->
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/usersRecyclerView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/margin_m"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/selectUsersTitle" />
</androidx.constraintlayout.widget.ConstraintLayout>
</ScrollView>
<Button
android:id="#+id/sendRequestButton"
style="#style/OnDutyButtonStart"
android:text="Send Request"
android:layout_margin="#dimen/margin_m"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
tools:text="Send Request" />
</androidx.constraintlayout.widget.ConstraintLayout>
In this case i get cropped last and first items shadows:
but i need it like this:
If i add margin or padding - i get the same with blank white space and always cropped shadows.

Related

Draw a floating view on a recycler view item

I want to draw a floating view outside a recycler view item.
It's like a tooltip in excel, each cell will be an item, and some items will have that tooltip:
I tried to use
clipChildren="false"
but it's still covered by other items.
This is item layout:
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="50dp"
android:layout_height="50dp"
android:clipChildren="false"
android:orientation="vertical">
<View
android:id="#+id/box"
android:layout_width="0dp"
android:layout_height="0dp"
android:background="#f0f0"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<View
android:layout_width="30dp"
android:layout_height="20dp"
android:background="#ff00"
android:translationX="10dp"
android:translationY="15dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
And this is activity layout with recycler view:
<?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"
android:clipChildren="false"
tools:context=".MainActivity">
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/recycler_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:clipChildren="false"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
This is my result:
And expected result is something like this:
Is there any way to archive this?
It looks like each RecyclerView item is partially overwriting the previous item. It is not clear to me how you got the first image (not the Excel image but the next one), but you can try setting the following attributes in the XML for the RecyclerView. The result is to write the items in the reverse order from what is normally done.
<androidx.recyclerview.widget.RecyclerView
...
android:clipChildren="false"
app:layoutManager="androidx.recyclerview.widget.LinearLayoutManager"
app:layout_constraintTop_toTopOf="parent"
app:reverseLayout="true" />
You could also set these, or any combination of these, in code. I would play around with these values to see where it gets you.

Accessibility implementation in nested RecyclerView

In my application i have nested recycler view. UI looks like this
XML layouts
Parent
<?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/relativeLayout"
android:layout_width="match_parent"
android:background="#0F171E"
android:layout_height="match_parent"
tools:context=".MainActivity">
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/Parent_recyclerView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="4dp"
android:scrollbars="vertical"
android:importantForAccessibility="no"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
Child
<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"
android:background="#0F171E"
android:focusable="true"
android:focusableInTouchMode="true">
<TextView
android:id="#+id/category"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginTop="24dp"
android:importantForAccessibility="no"
android:text="Category"
android:textColor="#C4DFEF"
android:textSize="16sp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/Child_RV"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:descendantFocusability="afterDescendants"
android:importantForAccessibility="yes"
android:contentDescription="Category"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.01"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/category" />
</androidx.constraintlayout.widget.ConstraintLayout>
During vertical navigation, I'm need to announce "Category" followed by whatever child recycler view item supposed to say. Also, during vertical navigation, focus should not go to "Category" header, instead it should go directly to child recycler view item.
I have tried couple of things but it did not work. Currently i'm hearing text in format
"child item" item 2 of 15 in list "Category".
Any suggestions.
Noticed that you tube app on android Tv does this , it speaks the row title before speaking child item details.

How to keep progressbar always below a recyclerView and not to be squeezed out of screen if there are too many items?

I am making a layout for showing scanned bluetooth device. Here is the layout:
<?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=".fragments.ScannedListFragment">
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/recycler_view_scan_list"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toTopOf="#id/progressBar_scan_list"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
tools:itemCount="12"
tools:listitem="#layout/list_item_scanned_list" />
<ProgressBar
android:id="#+id/progressBar_scan_list"
style="?android:attr/progressBarStyle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintTop_toBottomOf="#id/recycler_view_scan_list"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
But when there are too many list items, the progressbar will be squeezed out of the screen. Just like this:
demonstration1
I want to keep the progressbar stick to the bottom of the recyclerView when the screen has enough space to show all content and the progressbar can be completely shown above the bottom of the screen without scrolling even if there are too many items in the recyclerView.
I tried vertically chaining two views and packed chain with bias but no luck. Also, I found that adding app:layout_constraintHeight_max="" for the recyclerView can achieve similar effect. But it seems not a general solution for different screen sizes.
Create a vertical chain by constraining the bottom of the ProgressBar to the parent, then set the chain style to packed so that both views stick together and then set the vertical bias to 0 to align them to the top of the parent. To prevent the RecyclerView from pushing the ProgressBar out of the screen set the app:layout_constrainedHeight="true" attribute for the RecyclerView - it enforces constraints when the height is set to wrap_content.
<?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=".fragments.ScannedListFragment">
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/recycler_view_scan_list"
android:layout_width="0dp"
android:layout_height="wrap_content"
app:layout_constraintVertical_chainStyle="packed"
app:layout_constraintVertical_bias="0"
app:layout_constrainedHeight="true"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toTopOf="#id/progressBar_scan_list"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
tools:itemCount="12"
tools:listitem="#layout/list_item_scanned_list" />
<ProgressBar
android:id="#+id/progressBar_scan_list"
style="?android:attr/progressBarStyle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintTop_toBottomOf="#id/recycler_view_scan_list"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent" />
</androidx.constraintlayout.widget.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=".fragments.ScannedListFragment">
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/recycler_view_scan_list"
android:layout_width="match_parent"
android:layout_height="0dp"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toTopOf="#id/progressBar_scan_list"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
tools:itemCount="12"
tools:listitem="#layout/list_item_scanned_list" />
<ProgressBar
android:id="#+id/progressBar_scan_list"
style="?android:attr/progressBarStyle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
This way it will be always visible. Make the progress bar bottom constraint to parent and recycler view height 0dp

ConstraintLayout - how to wrap over RecyclerView

I have a ConstraintLayout with an appBar (containing a toolbar), two fragments (containing a RecyclerView each) and a button at the bottom.
What I am trying to do is to wrap the height of the layout over the size of the RecyclerViews. As you can see on the picture below, every Recyclerview is taking an equal height regardless of the size of the list.
And this is my layout
<?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="#color/template_grey_light"
tools:context=".presentation.ui.activity.MainActivity">
<include
android:id="#+id/AppBar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toTopOf="#+id/fragmentTop"
app:layout_constraintVertical_chainStyle="packed"
layout="#layout/app_bar" />
<androidx.fragment.app.FragmentContainerView
android:id="#+id/fragmentTop"
android:layout_width="match_parent"
android:layout_height="0dp"
app:layout_constraintTop_toBottomOf="#+id/AppBar"
app:layout_constraintBottom_toTopOf="#+id/fragmentBottom"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"/>
<androidx.fragment.app.FragmentContainerView
android:id="#+id/fragmentBottom"
android:layout_width="match_parent"
android:layout_height="0dp"
app:layout_constraintTop_toBottomOf="#+id/fragmentTop"
app:layout_constraintBottom_toTopOf="#+id/shuffleButton"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"/>
<Button
android:id="#+id/shuffleButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#color/white"
android:background="#color/template_love_red"
android:text="Go!"
android:layout_marginBottom="20dp"
app:layout_constraintTop_toBottomOf="#+id/fragmentBottom"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"/>
</androidx.constraintlayout.widget.ConstraintLayout>
I understand I am having 0dp on the height attributes and that makes it equal in height, but then if I don't, everything will overlap at the top. Any idea on how to make it work?
Use android:layout_height="wrap_content" in your FragmentContainerView tag

Recyclerview first item start margin

How do I align the first item to tvFoo when starting the fragment (without putting theRecyclerView inside another container)?
Right now, tvFoo is separated 16dp from the left edge and the first item from the list, only 8dp.
What I want is that the horizontal list is visible completely across the screen when scrolling (but at the beginning it is 16dp from the left).
This is what I have
This is what I want
fragment_foo.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="wrap_content">
<TextView
android:id="#+id/tvFoo"
style="#style/Tv.16.Black"
android:layout_marginStart="16dp"
android:layout_marginTop="16dp"
android:text="#string/foo"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"/>
<TextView
android:id="#+id/tvCount"
style="#style/Tv.13.Gray"
android:layout_marginStart="4dp"
app:layout_constraintBottom_toBottomOf="#id/tvFoo"
app:layout_constraintStart_toEndOf="#id/tvFoo"
app:layout_constraintTop_toTopOf="#id/tvFoo"
tools:text="(21)"/>
<android.support.v7.widget.RecyclerView
android:id="#+id/rv"
style="#style/WrapContent"
android:layout_marginTop="16dp"
app:layout_constraintTop_toBottomOf="#id/tvFoo"
tools:layoutManager="android.support.v7.widget.GridLayoutManager"
tools:listitem="#layout/item_foo"
tools:orientation="horizontal"/>
<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:layout_marginTop="16dp"
android:background="#color/colorPrimaryLight"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintTop_toBottomOf="#id/rv"/>
</android.support.constraint.ConstraintLayout>
item_foo.xml
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout
style="#style/WrapContent"
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_marginStart="8dp"
android:background="?selectableItemBackground">
<ImageView
android:id="#+id/ivFoo"
android:layout_width="160dp"
android:layout_height="90dp"
android:background="#color/lightGray"
android:padding="16dp"
android:src="#drawable/ic_picture_64dp"/>
</android.support.constraint.ConstraintLayout>
Add padding to your RecyclerView and Use
android:clipToPadding = "false"
inside your RecyclerView, to disable padding while scrolling it.
<android.support.v7.widget.RecyclerView
android:id="#+id/rv"
style="#style/WrapContent"
android:layout_marginTop="16dp"
android:padding="16dp"
android:clipToPadding = "false"
app:layout_constraintTop_toBottomOf="#id/tvFoo"
tools:layoutManager="android.support.v7.widget.GridLayoutManager"
tools:listitem="#layout/item_foo"
tools:orientation="horizontal"/>

Categories

Resources