Move layout above bottom sheet when it opens - android

I want base layout which is currently a included RecyclerView move above Bottomsheet when it opens. Same like adjustResize behaviour.
I tried to set anchor but it does not seem to work.
<?xml version="1.0" encoding="utf-8"?>
<layout 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">
<LinearLayout
style="#style/llDefault"
android:layout_height="match_parent"
android:orientation="vertical">
<include layout="#layout/layout_toolbar_single_chat" />
<TextView
android:id="#+id/tvOnlineStatus"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_margin="#dimen/space_small"
android:background="#drawable/bg_edittext_green"
android:padding="#dimen/space_small"
android:textColor="#color/white"
tools:text="Online" />
<android.support.design.widget.CoordinatorLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1">
<include
layout="#layout/layout_recycler_view_default"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="#dimen/peek_height_bottomsheet"
app:layout_anchor="#+id/bottomSheet"
app:layout_anchorGravity="bottom|end" />
<include
android:id="#+id/bottomSheet"
layout="#layout/layout_bottom_options_single_chat" />
</android.support.design.widget.CoordinatorLayout>
</LinearLayout>
</layout>
I am stuck since 1 hour in this.

Try to change this app:layout_anchorGravity="bottom|end" to app:layout_anchorGravity="top"
Note:-
And to get the advantages of coordinator layout behaiour features , the views need to be direct child of the corrdinator layout.
Hope this helps.

Related

Problem with correct display of BottomSheet

There was a problem with displaying bottomSheet on some devices (the case is quite rare, but it exists and interests how to remove it)
Look at the picture:
The meaning is this: there is 1 activity with .xml CoordinatorLayout, and it already contains several other markups included in it (mainly constraintLayout or LinearLayout)
They all go as bottomSheetBehaviour.
Main activity markup:
<?xml version="1.0" encoding="utf-8"?>
<androidx.coordinatorlayout.widget.CoordinatorLayout
android:id="#+id/activity_land"
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:tools="http://schemas.android.com/tools"
android:focusableInTouchMode="false"
android:isScrollContainer="false">
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="centerCrop"
android:src="#drawable/bg_select_device" />
<include
android:id="#+id/slide_experiment"
layout="#layout/view_show_slide" />
<include
android:id="#+id/landing_"
layout="#layout/view_landing"
android:visibility="visible"
tools:visibility="visible" />
<include
android:id="#+id/confirm_decision"
android:background="#37050505"
layout="#layout/view_confirm_solution" />
<include
android:id="#+id/confirmation_getting_location"
android:background="#37050505"
layout="#layout/view_getting_location" />
<include
android:id="#+id/confirmation_app_settings"
android:background="#37050505"
layout="#layout/view_app_settings" />
</androidx.coordinatorlayout.widget.CoordinatorLayout>
Interested in how to hide the "bottom" bottomSheet so that everything is displayed correctly. Thank you advance!

Floating Action button is not showing in Android Coordinator Layout

I am new to Android and UI development. I have downloaded latest version of Windows Android studio and did some basic native UI, it worked well. Now, I am trying to develop floating action button UI.
I have added CoordinatorLayout inside ConstraintLayout. FAB is added inside CoordinatorLayout. My FAB is not visible in layout preview.
I see androidx.coordinatorlayout.widget.CoordinatorLayout text in that layout with background color. Please let me know how to fix this
implementation 'com.google.android.material:material:1.2.0'
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto">
<androidx.coordinatorlayout.widget.CoordinatorLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#F44336"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
tools:ignore="MissingConstraints">
<com.google.android.material.floatingactionbutton.FloatingActionButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:backgroundTint="#color/colorPrimary"
android:src="#drawable/ic_baseline_add_24"
android:layout_gravity="bottom|end"
/>
</androidx.coordinatorlayout.widget.CoordinatorLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
add constraintTop for your CoordinatorLayout for filling whole screen
app:layout_constraintTop_toTopOf="parent"
or even this will be better
android:layout_width="match_parent"
android:layout_height="match_parent"
with removing all constraints
for test you may also add fixed size FloatingActionButton. if you want to keep wrap_content for FAB then ensure that ic_baseline_add_24 is valid icon with proper size
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto">
<androidx.coordinatorlayout.widget.CoordinatorLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#F44336"
tools:ignore="MissingConstraints">
<com.google.android.material.floatingactionbutton.FloatingActionButton
android:layout_width="80dp"
android:layout_height="80dp"
android:backgroundTint="#color/colorPrimary"
android:src="#drawable/ic_baseline_add_24"
android:layout_gravity="bottom|end"
/>
</androidx.coordinatorlayout.widget.CoordinatorLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
in above code ConstraintLayout isn't needed and you may remove it if you aren't planning to make some more complicated layout. RecyclerView may be placed inside CoordinatorLayout just before FAB - at first REcyclerView will be drawn, after that FAB on top of recycler
Try
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent">
<androidx.coordinatorlayout.widget.CoordinatorLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#F44336"
android:layout_gravity="bottom"
tools:ignore="MissingConstraints">
<com.google.android.material.floatingactionbutton.FloatingActionButton
android:layout_width="104dp"
android:layout_height="107dp"
android:layout_gravity="center"
android:foregroundGravity="center"
android:visibility="visible"
android:src="#drawable/ic_baseline_add_24"
app:backgroundTint="#color/colorPrimary" />
</androidx.coordinatorlayout.widget.CoordinatorLayout>
</LinearLayout>
Don't use a CoordinatorLayout with android:layout_height="wrap_content" to contain just the FAB:
<androidx.coordinatorlayout.widget.CoordinatorLayout
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:fitsSystemWindows="true">
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/rvItems"
android:scrollbars="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
<com.google.android.material.floatingactionbutton.FloatingActionButton
android:id="#+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|end"
app:layout_behavior="com.google.android.material.behavior.HideBottomViewOnScrollBehavior"
android:layout_margin="#dimen/fab_margin"
app:srcCompat="#drawable/ic_add_24px" />
</androidx.coordinatorlayout.widget.CoordinatorLayout>

Bottom Sheet Behaviour in Constraint Layout

I've got a simple application and I'm trying to add Bottom Sheet Behaviour. I want to keep Constraint Layout but I want to get Bottom Sheet Behaviour too. I don't want Coordinator Layout and Bottom Sheet Dialog.
activity_main.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/layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<Button
android:id="#+id/btn"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:enabled="false"
android:onClick="btn"
android:text="#string/btn"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<include
layout="#layout/activity_shop"/>
</androidx.constraintlayout.widget.ConstraintLayout>
activity_shop.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:orientation="vertical"
android:layout_width="match_parent"
android:id="#+id/shop"
android:layout_height="match_parent"
android:layout_gravity="bottom"
app:layout_behavior="com.google.android.material.bottomsheet.BottomSheetBehavior"
app:behavior_hideable="false"
app:behavior_peekHeight="48dp">
<ImageView
android:id="#+id/arrow"
android:layout_width="match_parent"
android:padding="0dp"
android:layout_height="wrap_content"
android:contentDescription="#string/arrow"
app:srcCompat="#drawable/baseline_keyboard_arrow_up_white_48dp" />
<Button
android:id="#+id/button2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Button" />
</LinearLayout>
What I need to change to get this thing working?
For using that use Hierarchy like this for using constraint layout:
<CoordinatorLayout>
// *ViewGroup containing your fixed screen*
<Linear/Relative/Constraint Layout>
</Linear/Relative/Constraint Layout>
// *ViewGroup containing your bottom sheet*
<ConstraintLayout
app:behavior_hideable="false"
app:behavior_peekHeight="90dp"
app:layout_behavior="android.support.design.widget.BottomSheetBehavior" >
</Constraintlayout>
</CoordinatorLayout>
Just add
app:layout_constraintBottom_toBottomOf="parent"
to you activity_shop.xml root
and change it's height to be wrap_content

RecyclerView is not working in NestedScrollView

I am using NestedScrollView in tab layout and when I implemented RecyclerView in NestedScrollView 2 problems occur:
Toolbar is not hiding.
RecyclerView in not scrolling smoothly.
Here is my Code:
<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:fillViewport="true"
xmlns:android="http://schemas.android.com/apk/res/android">
<RelativeLayout
android:layout_width="match_parent"
android:background="#fff"
android:layout_height="wrap_content">
<android.support.v7.widget.RecyclerView
android:layout_below="#+id/toolbar"
android:id="#+id/recyclerView"
android:background="#fafafa"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerInParent="true" />
<ProgressBar
android:id="#+id/progressBar1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true" />
</RelativeLayout>
</android.support.v4.widget.NestedScrollView>
use recylerView.setNestedScrollingEnabled(false); to make your scrolling smoother.
Create separate layout files for views and try. And include those into the list view.
<LinuearLayout ..>
<include layout="#layout/cv1"/>
<include layout="#layout/rv1"/>
<include layout="#layout/rv2"/>
<include layout="#layout/rv3"/>
</LinearLayout>
This is just a clue to you. I did solve similar issues long back in past. Please try experimenting with this clue.

RecyclerView and Toolbar, can't scroll bottom item into view

EDIT: See Using the Master/Detail template in ViewPager Fragments (download link) for full code
I have a toolbar and a recyclerView. When the layout is first inflated the last item of the recyclerView is out of the scroll-able region of the screen and is therefore not visible. After rotating the item appears. It is apparent that the toolbar is pushing the recyclerView outside the boundaries of the screen. If I add padding to the bottom of the recyclerView with the height of the toolbar the issue is resolved BUT only for the initial inflation of the layout. After rotation I am left with a gap on the bottom of the screen. I'm using sdk 23.
A possible workaround would be to programmatically remove the padding after the very first inflation of the layout. I assume I could use:
onCreateView(){ if (onSaveInstanceState != null) removePadding();}
However, I'd rather not have to do a dodgy work-around.
My app is basically exactly the same as the Master/Detail-flow template supplied in Android Studio, except that I use fragments and a single Activity. There is no such issue in the template.
Any ideas?
fragment_item_list.xml
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout 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:fitsSystemWindows="true">
<android.support.design.widget.AppBarLayout
android:id="#+id/app_bar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:popupTheme="#style/AppTheme.PopupOverlay" />
</android.support.design.widget.AppBarLayout>
<FrameLayout
android:id="#+id/frameLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<include layout="#layout/item_list" />
</FrameLayout>
<android.support.design.widget.FloatingActionButton
android:id="#+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|end"
android:layout_margin="#dimen/fab_margin"
android:src="#android:drawable/ic_dialog_email" />
</android.support.design.widget.CoordinatorLayout>
item_list.xml
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.RecyclerView 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/item_list"
android:name="com.idragonit.scrolltabs.ItemListFragment"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
app:layoutManager="LinearLayoutManager"
tools:context="com.idragonit.scrolltabs.ItemListActivity"
tools:listitem="#layout/item_list_content" />
item_list_content.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView
android:id="#+id/id"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="#dimen/text_margin"
android:textAppearance="?attr/textAppearanceListItem" />
<TextView
android:id="#+id/content"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="#dimen/text_margin"
android:textAppearance="?attr/textAppearanceListItem" />
</LinearLayout>
snippet of ItemListFragment.java
Toolbar toolbar = (Toolbar) root.findViewById(R.id.toolbar);
toolbar.setTitle("List");
I added:
android:layout_gravity="fill_vertical"
android:layout_marginBottom="?attr/actionBarSize"
to item_list.xml. The issue persists. The first time the layout is inflated it shows the bottom element as expected. After rotating to landscape and back to portrait it leaves a margin the size of the actionBar at the bottom of the screen.
This issue does not happen in the Master/Detail-flow template available in Android Studio and the code for item_list.xml, item_list_twopane.xml and activity_item_list are exactly the same as the code used in item_list.xml, land/item_list.xml and fragment_item_list.xml in my project. Yet, as the attached images show, the preview of the AppBar shows the flexible space in the Android template but not my code.
EDIT: When I click on the reference for "?attr/actionBarSize" in the template it navigates to a different line in android SDK's values.xml, which starts with <declare-styleable name="AppCompatTheme">. The same line of code in my app references a different line starting with<declare-styleable name="Theme">.
Screenshots:
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout
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/white"
android:orientation="vertical">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:popupTheme="#style/AppTheme.PopupOverlay" />
</android.support.design.widget.AppBarLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<android.support.v7.widget.RecyclerView
android:id="#+id/item_list"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="5dp"
android:scrollbars="vertical" />
</LinearLayout>
<android.support.design.widget.FloatingActionButton
android:id="#+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_gravity="bottom|right"
android:layout_marginBottom="#dimen/activity_vertical_margin"
android:layout_marginRight="#dimen/activity_horizontal_margin"
android:src="#drawable/ic_add"
app:backgroundTint="#color/colorPrimary" />
</android.support.design.widget.CoordinatorLayout>
You must add
android:layout_paddingBottom="?attr/actionBarSize
Instead of
android:layout_marginBottom="?attr/actionBarSize
This works for me

Categories

Resources