We Keep Coding

Minimize bottom navigation bar with animation when bottom sheet is expanded

I have a bottom navigation bar and a bottom sheet above it. The bottom sheet can be expanded to fill the entire screen and I would like to add an animation that hides the bottom navigation bar as the bottom sheet is expanded. Below are screenshots of my layout, the expanded image shows what it currently looks like and the desired image shows what I want it to look like. I have looked in the bottom sheet documentation but I could not find anything useful.
Collapsed: https://i.imgur.com/B4rVGzn.png
Expanded: https://i.imgur.com/Z25I2h0.png
Desired: https://i.imgur.com/PsE06gQ.png
Below is my layout
<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/constraintLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="#+id/navigation_bar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:backgroundTint="?attr/colorSurface"
android:elevation="16dp"
app:layout_constraintBottom_toBottomOf="parent"
app:menu="#menu/bottom_nav_menu">
</com.google.android.material.bottomnavigation.BottomNavigationView>
<fragment
android:id="#+id/map"
android:name="com.google.android.gms.maps.SupportMapFragment"
android:layout_width="match_parent"
android:layout_height="0dp"
app:cameraZoom="13.8"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
tools:context=".MainActivity" />
<androidx.coordinatorlayout.widget.CoordinatorLayout
android:id="#+id/coordinatorLayout"
android:layout_width="match_parent"
android:layout_height="0dp"
app:layout_constraintBottom_toTopOf="#+id/navigation_bar"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
android:elevation="16dp" >
<include layout="#layout/bottom_sheet" />
<LinearLayout
android:id="#+id/floating_action_buttons"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|end"
android:clipToPadding="false"
android:gravity="center"
android:orientation="vertical"
android:padding="16dp"
app:layout_behavior="jonathan.gpsapp.FloatingButtonBehavior">
<com.google.android.material.floatingactionbutton.FloatingActionButton
android:id="#+id/center_map"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:clickable="true"
android:src="#drawable/ic_center"
app:backgroundTint="?attr/colorSurface"
app:fabSize="mini"
app:tint="?attr/colorPrimary" />
<com.google.android.material.floatingactionbutton.FloatingActionButton
android:id="#+id/record"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:clickable="true"
android:src="#drawable/ic_record"
app:backgroundTint="?attr/colorPrimary"
app:fabSize="auto"
app:tint="#f2f2f2" />
</LinearLayout>
</androidx.coordinatorlayout.widget.CoordinatorLayout>
</androidx.constraintlayout.widget.ConstraintLayout>```

You need to use the addBottomSheetCallback to listen the slide position of your BotomSheet and with this value you can hide the BottomNavigation smoothly :
private int navigationHeight;
bottomSheet.addBottomSheetCallback(new BottomSheetBehavior.BottomSheetCallback() {
#Override
public void onStateChanged(#NonNull View bottomSheet, int newState) {
}
#Override
public void onSlide(#NonNull View bottomSheet, float slideOffset) {
if (navigationHeight == 0)
navigationHeight = navigation.getHeight(); //the height of the navigationView
float slideY = navigationHeight - navigationHeight * (1 - slideOffset);
navigation.setTranslationY(slideY);//Translate the navigatinView
}
});
Note: for a good result you must move the bottom Navigation on the coordinatorlayout

Dynamically added RecyclerView entry not auto resizing

So I've been trying to figure this out for quite a while now and cannot get this to work. I have a RecyclerView which has a child added to it upon a button press (this is a test case at the moment). As you will see in the code below, When onBindView is called, the text is changed. However as the title says, the text does not auto resize to fill the box in question.
How would I be able to do this?
RecyclerViewEntry.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="wrap_content"
android:id="#+id/ma_rv_ple_layout_root"
android:background="#drawable/background_border_rc"
android:padding="15dp"
android:clickable="true"
android:focusable="true"
android:layout_margin="5dp"
>
<TextView
android:text="#string/ma_rv_ple_project_label"
android:layout_width="0dp"
android:layout_height="0dp" android:id="#+id/am_rv_ple_project_title_label"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
android:textAppearance="#style/TextAppearance.AppCompat.Display1"
android:gravity="center"
app:layout_constraintDimensionRatio="1"
android:breakStrategy="balanced"
app:autoSizeTextType="uniform"
android:maxLines="1"
/>
</androidx.constraintlayout.widget.ConstraintLayout>
ProjectListAdapter.java
#Override
public void onBindViewHolder(#NonNull ProjectListAdapter.ViewHolder holder, int position) {
// TODO: Create and build our ViewHolder.
String entry = ProjectManager.getInstance().getProjectItem(position).getProjectName();
holder.getProjectNameTextView().setText(entry);
}

List page RecyclerView infinite scrolling not working when putted in NestedScrollView

I have taken two recyclerviews as I have to show two lists in which one is horizontal list and another is vertical with infinite scroll, for scrolling of both the lists I have added them in nestedScrollView but infinite scroll of vertical list is not working, there is an pagination logic after first loading of items when I scroll down then api gets called and then it loads items in list
<android.support.v4.widget.NestedScrollView
android:id="#+id/scrollView"
android:layout_width="match_parent"
android:layout_height="match_parent">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:id="#+id/llRecentlyBought"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentStart="true"
android:layout_alignParentTop="true"
android:orientation="vertical"
android:visibility="gone"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<TextView
android:id="#+id/txtVRecentlyBought"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/bg_grey_color"
android:padding="10dp"
android:text="#string/recently_bought"
android:textSize="#dimen/font_s_ize_levelone_signup" />
<android.support.v7.widget.RecyclerView
android:id="#+id/recyclerRecentlyBought"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:nestedScrollingEnabled="false"
android:paddingStart="#dimen/padding_home_1"
android:paddingEnd="#dimen/padding_home_1"
android:scrollbars="none"
android:focusable="false"
android:focusableInTouchMode="true"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
</LinearLayout>
<android.support.v7.widget.RecyclerView
android:id="#+id/products_in_gridView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/llRecentlyBought"
android:layout_alignParentStart="true"
android:layout_gravity="top"
android:layout_marginTop="5dp"
android:background="#android:color/white"
android:descendantFocusability="blocksDescendants"
android:fadingEdge="none"
android:paddingStart="#dimen/padding_home_1"
android:paddingEnd="#dimen/padding_home_1"
android:paddingBottom="#dimen/padding_home_1"
android:scrollbars="none"
android:focusable="false"
android:focusableInTouchMode="true"
app:layout_behavior="#string/appbar_scrolling_view_behavior"/>
</RelativeLayout>
</android.support.v4.widget.NestedScrollView>
BaseAttacher mBaseAttacher = Mugen.with(productsInGridRecyclerView, new MugenCallbacks() {
#Override
public void onLoadMore() {
if (indexOfCurrentPage < TOTAL_PAGE_AVAILABLE) {
indexOfCurrentPage += 1;
// loadNextPage(indexOfCurrentPage);
if (isLastPage == false) {
loadNextPage(indexOfCurrentPage);
} else if (isLastPage == true) {
// Toast.makeText(getActivity(), "No more products", Toast.LENGTH_SHORT).show();
Toast.makeText(getActivity(), getResources().getString(R.string.txt_no_product_found), Toast.LENGTH_SHORT).show();
}
}
}
#Override
public boolean isLoading() {
return isLoading;
}
#Override
public boolean hasLoadedAllItems() {
return false;
}
}).
start();
mBaseAttacher.setLoadMoreEnabled(true);
mBaseAttacher.setLoadMoreOffset(2);
above is the baseattacher to vertical list which is not getting called when I scroll down, without nestedscrollview its working help me with infinite scrolling of list in nestedscrollview
libary used https://github.com/vinaysshenoy/mugen

no need of nestedscrollview
i have just added app:layout_behavior="#string/appbar_scrolling_view_behavior" to parent layout
it works !!

How to collapse a view to the bottom of the screen in android using coordinator layout?

Can someone help me make a Collapsable Toolbar go to the bottom without exiting from the screen?
Initial view:
After scrolling down:
This is what I've tried, but the toolbar scrolls always to the top and dissapears:
<?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/search_place_root_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".activities.location.SearchPlaceActivity">
<android.support.constraint.ConstraintLayout
android:id="#+id/search_place_header"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:background="#color/home_background"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<EditText
android:id="#+id/search_place_et"
android:layout_width="match_parent"
android:layout_height="40dp"
android:layout_marginBottom="8dp"
android:layout_marginEnd="25dp"
android:layout_marginStart="57dp"
android:layout_marginTop="8dp"
android:background="#e3e3e3"
android:padding="10dp"
android:textColor="#color/black"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<ImageView
android:id="#+id/search_place_back_btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="25dp"
app:layout_constraintBottom_toBottomOf="#+id/search_place_et"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="#+id/search_place_et"
app:srcCompat="#drawable/back" />
</android.support.constraint.ConstraintLayout>
<android.support.design.widget.CoordinatorLayout
android:layout_width="match_parent"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/search_place_header"
android:foregroundGravity="bottom">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true">
<android.support.design.widget.CollapsingToolbarLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<android.support.constraint.ConstraintLayout
android:id="#+id/search_place_results_container"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.v7.widget.RecyclerView
android:id="#+id/list_search"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:background="#color/white"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<android.support.constraint.ConstraintLayout
android:layout_width="0dp"
android:layout_height="122dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/list_search">
<ImageView
android:id="#+id/imageView22"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="25dp"
android:src="#drawable/location_pin"
app:layout_constraintBottom_toBottomOf="#id/search_place_use_my_current_loc_tv"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="#id/search_place_use_my_current_loc_tv" />
<TextView
android:id="#+id/search_place_use_my_current_loc_tv"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="22dp"
android:layout_marginTop="34dp"
android:fontFamily="#font/opensanssemibold"
android:letterSpacing="0.02"
android:lineSpacingExtra="12sp"
android:text="#string/use_my_current_location"
android:textColor="#000000"
android:textSize="15sp"
app:layout_constraintStart_toEndOf="#+id/imageView22"
app:layout_constraintTop_toTopOf="parent" />
</android.support.constraint.ConstraintLayout>
</android.support.constraint.ConstraintLayout>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
</android.support.design.widget.CoordinatorLayout>
</android.support.constraint.ConstraintLayout>
How can I make the transition for my whole content to go to the bottom and shrink a little bit?

Xml
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
tools:context="info.androidhive.bottomsheet.MainActivity"
tools:showIn="#layout/activity_main">
<-Your Views->
</LinearLayout>
Java
BottomSheetBehavior sheetBehavior = BottomSheetBehavior.from(layoutBottomSheet);
/**
* bottom sheet state change listener
* we are changing button text when sheet changed state
* */
sheetBehavior.setBottomSheetCallback(new BottomSheetBehavior.BottomSheetCallback() {
#Override
public void onStateChanged(#NonNull View bottomSheet, int newState) {
switch (newState) {
case BottomSheetBehavior.STATE_HIDDEN:
break;
case BottomSheetBehavior.STATE_EXPANDED: {
btnBottomSheet.setText("Close Sheet");
}
break;
case BottomSheetBehavior.STATE_COLLAPSED: {
btnBottomSheet.setText("Expand Sheet");
}
break;
case BottomSheetBehavior.STATE_DRAGGING:
break;
case BottomSheetBehavior.STATE_SETTLING:
break;
}
}
#Override
public void onSlide(#NonNull View bottomSheet, float slideOffset) {
}
});
See more details

Android Collapsing Toolbar was not hiding other element while collapsed

I have a layout on Android support design collapsing toolbar which contains the TextView but when I collapse my toolbar. some TextView showing with toolbar title.
I want to hide every other things rather than toolbar and title.
Here is my layout.
<android.support.design.widget.AppBarLayout
android:id="#+id/MyAppbar"
android:layout_width="match_parent"
android:layout_height="256sp"
android:fitsSystemWindows="true">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/collapse_toolbar"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
android:background="#ff009688"
app:contentScrim="#color/colorPrimary"
app:expandedTitleMarginTop="100sp"
app:expandedTitleGravity="center|bottom"
android:fitsSystemWindows="true">
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="fitXY"
app:srcCompat="#drawable/bgimg"
app:layout_collapseMode="parallax"/>
<android.support.v7.widget.Toolbar
android:id="#+id/MyToolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:layout_collapseMode="pin" />
<RelativeLayout
android:layout_width="match_parent"
app:layout_anchor="#+id/MyAppbar"
android:layout_height="match_parent">
<de.hdodenhof.circleimageview.CircleImageView
android:id="#+id/profile_image"
android:layout_width="96dp"
android:layout_height="96dp"
android:src="#drawable/studentprofile"
app:civ_border_width="2dp"
app:civ_border_color="#0adcf4"
android:layout_marginTop="58dp"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true" />
<TextView
android:id="#+id/branch"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="Branch: "
android:textColor="#color/textColorPrimary"
android:textSize="14sp"
android:layout_marginBottom="20sp"
android:layout_alignParentBottom="true"
android:layout_centerInParent="true" />
</RelativeLayout>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
And my java code is...
collapsingToolbar =
(CollapsingToolbarLayout) findViewById(R.id.collapse_toolbar);
collapsingToolbar.setTitle(name);
collapsingToolbar.setExpandedTitleTextAppearance(R.style.expandedappbar);
collapsingToolbar.setCollapsedTitleTextAppearance(R.style.collapsedappbar);
final ImageView profile=(ImageView)findViewById(R.id.profile_image);
Picasso.with(this)
.load(photo_url)
.placeholder(R.drawable.studentprofile)
.networkPolicy(NetworkPolicy.NO_CACHE)
.into(new Target() {
#Override
public void onBitmapLoaded (final Bitmap bitmap, Picasso.LoadedFrom from){
/* Save the bitmap or do something with it here */
Palette.from(bitmap).generate(new Palette.PaletteAsyncListener() {
#Override
public void onGenerated(Palette palette) {
collapsingToolbar.setContentScrimColor(palette.getMutedColor(ContextCompat.getColor(context,R.color.colorPrimary)));
collapsingToolbar.setStatusBarScrimColor(palette.getMutedColor(ContextCompat.getColor(context,R.color.colorPrimaryDark)));
}
});
//Set it in the ImageView
profile.setImageBitmap(bitmap);
}
#Override
public void onBitmapFailed(Drawable errorDrawable) {
}
#Override
public void onPrepareLoad(Drawable placeHolderDrawable) {
}
});

Since I resolve my problem myself I'm posting this answer so it will helpfull for others .
CollapsingToolBar extends FrameLayout so any xml tag written after another tag will be layered as top of parent. My RelativeLayout is written after the Toolbar thats why Relative Layout elements are showing on Toolbar after CollapsingToolbar collapsed.
just putting RelativeLayout before the Toolbar will hides the element after toolbar collapsed.
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/collapse_toolbar"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
android:background="#ff009688"
app:contentScrim="#color/colorPrimary"
app:expandedTitleMarginTop="100sp"
app:expandedTitleGravity="center|bottom"
android:fitsSystemWindows="true">
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="fitXY"
app:srcCompat="#drawable/bgimg"
app:layout_collapseMode="parallax"/>
<RelativeLayout
android:layout_width="match_parent"
app:layout_anchor="#+id/MyAppbar"
android:layout_height="match_parent">
<de.hdodenhof.circleimageview.CircleImageView
android:id="#+id/profile_image"
android:layout_width="96dp"
android:layout_height="96dp"
android:src="#drawable/studentprofile"
app:civ_border_width="2dp"
app:civ_border_color="#0adcf4"
android:layout_marginTop="58dp"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true" />
<TextView
android:id="#+id/branch"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="Branch: "
android:textColor="#color/textColorPrimary"
android:textSize="14sp"
android:layout_marginBottom="20sp"
android:layout_alignParentBottom="true"
android:layout_centerInParent="true" />
</RelativeLayout>
<android.support.v7.widget.Toolbar
android:id="#+id/MyToolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:layout_collapseMode="pin" />
</android.support.design.widget.CollapsingToolbarLayout>

try this:
change your CollapsingToolbarLayout layout attribute:
use:
app:layout_scrollFlags="scroll|enterAlways|enterAlwaysCollapsed"
instead of
app:layout_scrollFlags="scroll|exitUntilCollapsed"
and add this attribute to the toolbar component
android:minHeight="?attr/actionBarSize"
Explanation:
Assuming enterAlways is declared and you have specified a minHeight, you can also specify enterAlwaysCollapsed. When this setting is used, your view will only appear at this minimum height. Only when scrolling reaches to the top will the view expand to its full height:
for details:https://guides.codepath.com/android/Handling-Scrolls-with-CoordinatorLayout