The issue is, as the title states, that when the appbar is fully visible the title isn't, and when it starts collapsing, the title appears (images below)
So here's what it looks like when the AppBar is fully visible
And here's when I've started scrolling down
<?xml version="1.0" encoding="utf-8"?>
<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:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent">
<com.google.android.material.appbar.AppBarLayout
android:id="#+id/appbar"
app:layout_constraintTop_toTopOf="parent"
android:backgroundTint="?android:attr/windowBackground"
android:layout_height="wrap_content"
android:layout_width="match_parent">
<com.google.android.material.appbar.CollapsingToolbarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:toolbarId="#+id/toolbar"
app:layout_scrollFlags="scroll|enterAlways|enterAlwaysCollapsed"
app:contentScrim="?android:attr/windowBackground">
<androidx.appcompat.widget.Toolbar
android:layout_gravity="center"
android:id="#+id/toolbar"
android:layout_height="80dp"
android:background="?android:attr/windowBackground"
android:layout_width="match_parent">
</androidx.appcompat.widget.Toolbar>
</com.google.android.material.appbar.CollapsingToolbarLayout>
</com.google.android.material.appbar.AppBarLayout>
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:outlineProvider="none"
android:elevation="5dp"
app:layout_anchor="#id/nav_host_fragment_activity_main"
app:layout_anchorGravity="bottom|center_horizontal"
app:layout_behavior="#string/hide_bottom_view_on_scroll_behavior"
android:layout_height="match_parent">
<com.google.android.material.bottomnavigation.BottomNavigationView
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
android:layout_marginBottom="10dp"
android:id="#+id/nav_view"
android:outlineProvider="paddedBounds"
android:elevation="100dp"
android:layout_width="350dp"
android:layout_height="60dp"
android:layout_marginStart="0dp"
android:layout_marginEnd="0dp"
app:menu="#menu/bottom_nav_menu" />
</androidx.constraintlayout.widget.ConstraintLayout>
<fragment
app:layout_behavior="#string/appbar_scrolling_view_behavior"
android:id="#+id/nav_host_fragment_activity_main"
android:name="androidx.navigation.fragment.NavHostFragment"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:defaultNavHost="true"
app:layout_constraintBottom_toTopOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:navGraph="#navigation/mobile_navigation" />
</androidx.coordinatorlayout.widget.CoordinatorLayout>
This is the layout for my activity
This happens regardless of fragments, so I won't be providing them for now.
setSupportActionBar(binding.toolbar);
AppBarConfiguration appBarConfiguration = new AppBarConfiguration.Builder(
R.id.navigation_home, R.id.navigation_settings, R.id.navigation_updates)
.build();
NavController navController = Navigation.findNavController(this, R.id.nav_host_fragment_activity_main);
NavigationUI.setupActionBarWithNavController(this, navController, appBarConfiguration);
And this is the way I set the AppBar.
So my goal is just to have the title always be visible. Another bug I noticed that might be related - the title, even when visible, doesn't change regardless of fragment.
Turns out I needed to set
app:titleEnabled="false"
for the CollapsingToolbarLayout and it worked afterwards
Related
I want to add a FloatingActionButton in the middle of BottomAppBar with curve below.
So i Added tried to design the MainActivity like below. I maintained Single Activity Architecture in this app.
Now, I have faced two problems.
If I want to set Visibility:gone for bottomappbar & floatingActionButtonin any particular fragment than both are gone but created an empty view. Like the screen shot. How can I remove that empty view?
I want to make transparent the gap between FloatingActionButton & BottomAppBar. But failed to do that.
This is the code below of my MainActivity's XML.
<?xml version="1.0" encoding="utf-8"?>
<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"
tools:context=".ui.MainActivity">
<com.google.android.material.appbar.AppBarLayout
android:id="#+id/appbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fitsSystemWindows="true">
<androidx.appcompat.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/colorPrimary"
android:theme="#style/ThemeOverlay.MaterialComponents.Dark.ActionBar" />
</com.google.android.material.appbar.AppBarLayout>
<fragment
android:id="#+id/my_nav_host_fragment"
android:name="androidx.navigation.fragment.NavHostFragment"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="?attr/actionBarSize"
app:defaultNavHost="true"
app:layout_behavior="com.google.android.material.appbar.AppBarLayout$ScrollingViewBehavior"
app:navGraph="#navigation/navigation_graph" />
<com.google.android.material.bottomappbar.BottomAppBar
android:id="#+id/bottomAppBar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
app:fabCradleMargin="10dp"
app:elevation="0dp"
app:fabCradleRoundedCornerRadius="10dp"
app:fabCradleVerticalOffset="10dp">
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="#+id/bottom_nav_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginEnd="16dp"
android:background="#android:color/transparent"
app:menu="#menu/navigation_menu" />
</com.google.android.material.bottomappbar.BottomAppBar>
<com.google.android.material.floatingactionbutton.FloatingActionButton
android:id="#+id/fab_add"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:contentDescription="#string/app_name"
android:src="#drawable/ic_dashboard_add"
app:backgroundTint="#color/colorDashboardFloatingButton"
app:tint="#color/colorWhite"
app:layout_anchor="#id/bottomAppBar" />
</androidx.coordinatorlayout.widget.CoordinatorLayout>
Here are the screenshots.
in the xml file I have a coordinatorlayout and inside this coordinatorlayout I have CollapsingToolbarLayout with tablayout inside AppBarLayout and the remainder of layout I have ViewPager inside NesdedScrollView.
the problem is the AppBarLayout not collapse when scrolling NesdedScrollView.
Its appear that NesdedScrollView is not work ViewPager.
next is my code
<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"
tools:context=".acivities.Ihram">
<com.google.android.material.appbar.AppBarLayout
android:layout_width="match_parent"
android:layout_height="250dp"
android:id="#+id/collapsing_appbar"
android:fitsSystemWindows="true"
android:layout_margin="2dp"
android:showDividers="end"
app:elevation="1dp"
android:backgroundTint="#color/green"
android:outlineSpotShadowColor="#color/green"
app:layout_behavior="com.google.android.material.appbar.AppBarLayout$ScrollingViewBehavior">
<com.google.android.material.appbar.CollapsingToolbarLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
app:contentScrim="#color/grey"
app:layout_scrollFlags="scroll|snap|exitUntilCollapsed"
app:title="#string/alihram"
android:background="#drawable/ihram"
app:expandedTitleGravity="top|center"
android:id="#+id/collapsing_toolbar"
app:collapsedTitleTextColor="#color/white">
<com.google.android.material.tabs.TabLayout
android:layout_width="match_parent"
android:layout_height="?actionBarSize"
android:id="#+id/ihram_tab_layouts"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:tabTextColor="#color/primary"
app:tabIndicatorColor="#color/purple_700"
android:contextClickable="true"
app:tabTextAppearance="#style/CustomViewAllTab"
android:clickable="true"
android:layout_gravity="bottom"
android:elevation="#dimen/cardview_compat_inset_shadow">
<com.google.android.material.tabs.TabItem
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="sied"
android:contextClickable="true"/>
<com.google.android.material.tabs.TabItem
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="mems"/>
<com.google.android.material.tabs.TabItem
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="sence" />
</com.google.android.material.tabs.TabLayout>
<androidx.appcompat.widget.Toolbar
android:id="#+id/ihram_toolbar"
android:layout_width="match_parent"
android:layout_height="?actionBarSize"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_scrollFlags="scroll|enterAlways"
app:layout_collapseMode="pin">
</androidx.appcompat.widget.Toolbar>
</com.google.android.material.appbar.CollapsingToolbarLayout>
</com.google.android.material.appbar.AppBarLayout>
<androidx.core.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<androidx.viewpager.widget.ViewPager
android:id="#+id/ihram_view_pager"
android:layout_width="match_parent"
android:layout_height="match_parent">
</androidx.viewpager.widget.ViewPager>
</androidx.core.widget.NestedScrollView>
</androidx.coordinatorlayout.widget.CoordinatorLayout>
I found many answer but not work in my case.
Thanks in advance to anyone who can help
I have a toolbar at the top of the screen, and when I call share intent the toolbar crawls up, how can I fix that?
<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="match_parent"
android:layout_height="match_parent">
<androidx.appcompat.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?actionBarSize"
android:background="#color/white"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:title="#string/app_name">
</androidx.appcompat.widget.Toolbar>
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/recyclerView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/toolbar"/>
</androidx.constraintlayout.widget.ConstraintLayout>
I'm using Bottom Navigation View for my application. Here I have added 3 items in menu and have customized the app:itemTextAppearanceActive & app:itemTextAppearanceInactive attribute of Bottom Navigation View as follows:
<android.support.constraint.ConstraintLayout
android:layout_below="#+id/tb_home"
android:id="#+id/cl_home_stats"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:visibility="gone">
<android.support.design.widget.BottomNavigationView
android:id="#+id/bnv_home_stats"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:background="?android:attr/windowBackground"
android:soundEffectsEnabled="true"
app:labelVisibilityMode="labeled"
app:itemTextAppearanceActive="#style/navTextActive"
app:itemTextAppearanceInactive="#style/navTextInactive"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:menu="#menu/navigation"/>
</android.support.constraint.ConstraintLayout>
in style xml file:
<style name="navTextInactive">
<item name="android:textSize">20dp</item>
<item name="android:textColor">#color/colorInActive</item>
</style>
<style name="navTextActive">
<item name="android:textSize">20dp</item>
<item name="android:textStyle">bold</item>
<item name="android:textColor">#color/colorActive</item>
</style>
When a click is made on navigation menu, there is no change in Active and Inactive status of other menus. Active selection remains of first menu even if you select other menu.
Complete xml file for activity view:
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
tools:context=".HomeActivity"
tools:showIn="#layout/app_bar_home">
<RelativeLayout
android:id="#+id/rl_home"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:visibility="visible">
<android.support.design.widget.TabLayout
android:id="#+id/tb_home"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:tabTextAppearance="#style/MyCustomTabText"
android:visibility="gone">
<android.support.design.widget.TabItem
android:id="#+id/tb_home_billing"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/title_billing"/>
<android.support.design.widget.TabItem
android:id="#+id/tb_home_stats"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/title_stats" />
</android.support.design.widget.TabLayout>
<RelativeLayout
android:layout_below="#+id/tb_home"
android:id="#+id/rl_home_billing"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:visibility="gone">
<Button
android:id="#+id/bt_home_billing_order"
android:layout_alignParentStart="true"
android:layout_width="160dp"
android:layout_height="80dp"
android:layout_marginStart="10dp"
android:layout_marginTop="10dp"
android:text="#string/title_order"
android:textSize="20sp"
android:textStyle="bold"/>
<Button
android:id="#+id/bt_home_billing_parcel"
android:layout_alignParentEnd="true"
android:layout_width="160dp"
android:layout_height="80dp"
android:layout_marginTop="10dp"
android:layout_marginEnd="10dp"
android:text="#string/title_parcel"
android:textSize="20sp"
android:textStyle="bold"/>
<ExpandableListView
android:id="#+id/elv_home_billing_unsettled"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/bt_home_billing_order"
android:layout_marginTop="30dp"
android:layout_marginStart="10dp"
android:layout_marginEnd="10dp"
android:indicatorLeft="?android:attr/expandableListPreferredItemIndicatorLeft"
android:divider="#android:color/darker_gray"
android:dividerHeight="0.5dp">
</ExpandableListView>
</RelativeLayout>
<android.support.constraint.ConstraintLayout
android:layout_below="#+id/tb_home"
android:id="#+id/cl_home_stats"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:visibility="gone">
<android.support.design.widget.BottomNavigationView
android:id="#+id/bnv_home_stats"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:background="?android:attr/windowBackground"
android:soundEffectsEnabled="true"
app:labelVisibilityMode="labeled"
app:itemTextAppearanceActive="#style/navTextActive"
app:itemTextAppearanceInactive="#style/navTextInactive"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:menu="#menu/navigation"/>
</android.support.constraint.ConstraintLayout>
</RelativeLayout>
</android.support.constraint.ConstraintLayout>
You first add in main layout this code:
<?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/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingTop="?attr/actionBarSize">
<com.google.android.material.tabs.TabLayout
android:layout_width="match_parent"
android:layout_height="40dp"
tools:ignore="MissingConstraints" >
</com.google.android.material.tabs.TabLayout>
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="#+id/nav_view"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="0dp"
android:layout_marginEnd="0dp"
android:background="?android:attr/windowBackground"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:menu="#menu/bottom_nav_menu" />
<fragment
android:id="#+id/nav_host_fragment"
android:name="androidx.navigation.fragment.NavHostFragment"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:defaultNavHost="true"
app:layout_constraintBottom_toTopOf="#id/nav_view"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:navGraph="#navigation/mobile_navigation" />
</androidx.constraintlayout.widget.ConstraintLayout>
And in menu named bottom_nav_menu.xml :
<item
android:id="#+id/navigation_home"
android:icon="#drawable/ic_home_black_24dp"
android:title="#string/title_home" />
<item
android:id="#+id/navigation_dashboard"
android:icon="#drawable/ic_dashboard_black_24dp"
android:title="#string/title_dashboard" />
<item
android:id="#+id/navigation_notifications"
android:icon="#drawable/ic_notifications_black_24dp"
android:title="#string/title_notifications" />
And which fragment you want to switch, you should add those fragment.
And for activity code is :
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
BottomNavigationView navView = findViewById(R.id.nav_view);
// Passing each menu ID as a set of Ids because each
// menu should be considered as top level destinations.
AppBarConfiguration appBarConfiguration = new AppBarConfiguration.Builder(
R.id.navigation_home, R.id.navigation_dashboard, R.id.navigation_notifications)
.build();
NavController navController = Navigation.findNavController(this, R.id.nav_host_fragment);
NavigationUI.setupActionBarWithNavController(this, navController, appBarConfiguration);
NavigationUI.setupWithNavController(navView, navController);
}
And from Android-Studio you can start this automatically:
New Project> Phone and Tablet > Navigation Drawer Activity> Done
Or For new activity:
New > Activity > Bottom Navigation Activity> Done.
Hope it will help you otherwise you can ask me in comment.
Thanks.
I have implemented an activity with two slides, the slides content is a fragment with RecyclerView that loads data from my server and creates a GridLayout with images (like in image gallery).
I have added the behavior of scrolling so when you scroll you don't see the toolbar.
My problem is that when the activity starts with the fragment the toolbar is half hidden and when i continue to scroll down and the toolbar is completely hidden the CoordinatorLayout from under is exposed so i get this thing:
as you can see the light green is the CoordinatorLayout and the red is the ViewPager and what i want to achieve is that when you scroll more you will only see the red background and never the green one.
My activity_main.xml
<android.support.design.widget.AppBarLayout
android:id="#+id/appbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/backgroundGray"
android:fitsSystemWindows="true">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="56dp"
android:background="#color/appGreen"
app:layout_scrollFlags="scroll|enterAlways">
<com.apps.haver.getout.libs.view.CustomTextView
android:id="#+id/actionBarTitleText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_marginLeft="10dp"
android:ellipsize="end"
android:maxLines="1"
android:text="Get Out"
android:textColor="#color/white"
android:textSize="50sp"
app:fontName="Peterbuilt.ttf" />
</android.support.v7.widget.Toolbar>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#565654"
android:orientation="vertical"
android:scrollbars="none">
<com.apps.haver.getout.libs.slider.SlidingTabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="#dimen/normal_row"
android:background="#color/appGreen"
android:elevation="2dp" />
<android.support.v4.view.ViewPager
android:id="#+id/pager"
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:background="#e90f0f" />
</LinearLayout>
</android.support.design.widget.AppBarLayout>
And my fragment.xml
<FrameLayout 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"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
tools:context="com.apps.haver.getout.FriendsFragment">
<com.apps.haver.getout.libs.view.AutofitRecyclerView
android:id="#+id/rvPager"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:clipToPadding="false"
android:columnWidth="102dp"
android:fitsSystemWindows="true"
android:scrollbars="vertical" />
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/pressToRetryPanel"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:visibility="gone">
<TextView
android:id="#+id/textPressToRetry"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:text="#string/press_to_retry"
android:textColor="#color/black"
android:textSize="16sp" />
</RelativeLayout>
<include
android:id="#+id/loadingPanel"
layout="#layout/loading_template"
android:layout_width="match_parent"
android:layout_height="match_parent" />
How can I make the toolbar to hide when I am scrolling but still see the RecyclerView content on my entire screen?
Thanks...