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.
Related
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
I'm using Android support design widget BottomNavigationView for making my bottom navigation items. It doesn't show the icons, but it shows text and is working fine. I am using the support library version com.google.android.material:material:1.4.0 and my XML code for bottomnavigationView is:
<?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/white"
tools:context=".MainActivity">
<androidx.appcompat.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#drawable/gradient_bg"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="#dimen/_30sdp">
<ImageView
android:layout_width="#dimen/_55sdp"
android:layout_height="#dimen/_35sdp"
android:src="#drawable/logo1" />
</LinearLayout>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="#dimen/_54sdp"
android:gravity="center"
android:text=""
android:textColor="#color/white"
android:textSize="#dimen/_12sdp" />
</androidx.appcompat.widget.Toolbar>
<FrameLayout
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="0dp"
app:layout_constraintBottom_toTopOf="#+id/layout"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/toolbar" />
<LinearLayout
android:id="#+id/layout"
android:layout_width="match_parent"
android:layout_height="#dimen/_45sdp"
android:layout_weight="0.90"
android:background="#color/app_col1"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toStartOf="parent"
android:gravity="center"
android:orientation="vertical">
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="#+id/bottom_nav_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/app_col1"
app:itemIconTint="#color/white"
app:labelVisibilityMode="labeled"
android:layout_gravity="center"
android:theme="#style/Theme.App"
app:itemTextColor="#drawable/tab_color"
app:menu="#menu/bottom_navigation_menu"/>
</LinearLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
My menu XML code is below
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<item
android:id="#+id/page_1"
android:enabled="true"
android:iconTint="#drawable/ic_baseline_home_24"
app:showAsAction="ifRoom"
android:title="Home"/>
<item
android:id="#+id/page_2"
android:iconTint="#drawable/ic_baseline_home_24"
app:showAsAction="withText"
android:title="Category"/>
<item
android:id="#+id/page_3"
app:showAsAction="ifRoom"
android:iconTint="#drawable/user"
android:title="Profile"/>
</menu>
How can I solve this issue?
In your activity layout add the following code.
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="#+id/btmMenu"
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_alignParentBottom="true"
app:itemIconSize="#dimen/bottom_navigation_icon_size"
app:labelVisibilityMode="labeled"
android:background="#color/white_color"
app:menu="#menu/menu"
app:elevation="0dp"></com.google.android.material.bottomnavigation.BottomNavigationView>
Create a menu.xml file and add the below code.
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:id="#+id/Home"
android:title="Home"
android:icon="#drawable/home_selector"/>
<item
android:id="#+id/Statistics"
android:title="Statistics"
android:icon="#drawable/statitics_selector"/>
<item
android:id="#+id/Analytics"
android:title="Analytics"
android:icon="#drawable/analytics_selector"/>
<item
android:id="#+id/Profile"
android:title="Profile"
android:icon="#drawable/profile_selector"/>
</menu>
How can I provide a divider for BottomNavigationView in Android? I need this tiny line between Home and Settings.
You can create a background for the BottomNavigationView as is suggested here. If you already have a background and since BottomNavigationView is a FrameLayout, you could add a divider as follows:
navigation_divider.xml
<shape
android:shape="rectangle">
<size android:width="2dp" />
<solid android:color="#E91E63" />
</shape>
activity_main.xml
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingTop="?attr/actionBarSize">
<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">
<View
android:layout_width="2dp"
android:layout_height="30dp"
android:layout_gravity="center"
android:background="#drawable/navigation_divider" />
</com.google.android.material.bottomnavigation.BottomNavigationView>
<fragment
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="#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>
You will, of course, need an even number of selections in the menu.
My RecyclerView doesn't animate when scrolling. I've narrowed down the problem to the NestedScrollView that the RecyclerView is in. When the RecyclerView is outside the NestedScrollView it animates fine. But when it's in the NestedScrollView it doesn't. How can I animate the RecyclerView while keeping it in the NestedScrollView?
Here's the relevant layout:
<androidx.coordinatorlayout.widget.CoordinatorLayout
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/mainToolbar">
<com.google.android.material.appbar.AppBarLayout
android:id="#+id/tab_anim_appbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center|top"
android:layout_marginLeft="40dp"
android:layout_marginRight="40dp"
android:background="#android:color/transparent"
app:elevation="0dp">
<com.google.android.material.appbar.MaterialToolbar
android:id="#+id/searchToolbar"
style="#style/Widget.MaterialComponents.Toolbar.Primary"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center|top"
android:background="#A106A1"
android:elevation="2dp"
app:contentInsetLeft="0dp"
app:contentInsetStart="0dp"
app:layout_scrollFlags="scroll|enterAlways">
<!-- dummy to catch focus -->
<LinearLayout
android:layout_width="0px"
android:layout_height="0px"
android:focusable="true"
android:focusableInTouchMode="true" />
<androidx.appcompat.widget.SearchView
android:id="#+id/searchView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="30dp"
android:layout_marginLeft="30dp"
android:layout_marginEnd="35dp"
android:layout_marginRight="35dp"
android:animateLayoutChanges="true"
android:layoutDirection="rtl"
app:iconifiedByDefault="true"
app:searchHintIcon="#null" />
</com.google.android.material.appbar.MaterialToolbar>
</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.recyclerview.widget.RecyclerView
android:id="#+id/myRecyclerView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingHorizontal="1dp" />
</androidx.core.widget.NestedScrollView>
</androidx.coordinatorlayout.widget.CoordinatorLayout>
And here's the animation applied in the RecyclerView adapter:
#Override
public void onBindViewHolder(#NonNull MyViewHolder holder, int position) { //binds the data to the view
holder.container.setAnimation(AnimationUtils.loadAnimation(holder.container.getContext(),R.anim.fade_out));
holder.nameTextView.setText(labels[position]);
holder.packageNameTextView.setText(packageNames[position]);
holder.iconImageView.setImageDrawable(drawables[position]);
}
Update: Here it is using the CollapsingToolbarLayout instead of NestedScrollView. How do I make the toolbar scroll?
<androidx.coordinatorlayout.widget.CoordinatorLayout
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/mainToolbar">
<com.google.android.material.appbar.AppBarLayout
android:id="#+id/tab_anim_appbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center|top"
android:layout_marginLeft="40dp"
android:layout_marginRight="40dp"
android:background="#android:color/transparent"
app:elevation="0dp">
<com.google.android.material.appbar.CollapsingToolbarLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<com.google.android.material.appbar.MaterialToolbar
android:id="#+id/searchToolbar"
style="#style/Widget.MaterialComponents.Toolbar.Primary"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center|top"
android:background="#A106A1"
android:elevation="2dp"
app:contentInsetLeft="0dp"
app:contentInsetStart="0dp"
app:layout_scrollFlags="scroll">
<!-- dummy to catch focus -->
<LinearLayout
android:layout_width="0px"
android:layout_height="0px"
android:focusable="true"
android:focusableInTouchMode="true" />
<androidx.appcompat.widget.SearchView
android:id="#+id/searchView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="30dp"
android:layout_marginLeft="30dp"
android:layout_marginEnd="35dp"
android:layout_marginRight="35dp"
android:animateLayoutChanges="true"
android:layoutDirection="rtl"
app:iconifiedByDefault="true"
app:searchHintIcon="#null" />
</com.google.android.material.appbar.MaterialToolbar>
</com.google.android.material.appbar.CollapsingToolbarLayout>
</com.google.android.material.appbar.AppBarLayout>
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/myRecyclerView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="3dp"
app:layout_behavior="#string/appbar_scrolling_view_behavior"/>
</androidx.coordinatorlayout.widget.CoordinatorLayout>
It is not a good way to put RecyclerView inside NestedScrollView. If you want to make SearchBar above RecyclerView, you can check this.
You can also check this refference.
I checked your xml and modified it. It is working on my side. Please modify it according to your UI requirements.
N.B.: Check after populating data on recyclerview. First it may seem it is not working due to no data on recyclerview.
<?xml version="1.0" encoding="utf-8"?>
<androidx.coordinatorlayout.widget.CoordinatorLayout 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"
android:fitsSystemWindows="true"
tools:context=".MainActivity"
xmlns:android="http://schemas.android.com/apk/res/android">
<com.google.android.material.appbar.AppBarLayout
android:id="#+id/tab_anim_appbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center|top"
android:fitsSystemWindows="true"
android:background="#android:color/transparent"
android:theme="#style/AppTheme.AppBarOverlay"
app:elevation="0dp">
<com.google.android.material.appbar.CollapsingToolbarLayout
android:id="#+id/collapsing_toolbar_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
app:toolbarId="#+id/toolbar_scrolling">
<LinearLayout
android:layout_width="0px"
android:layout_height="0px"
android:focusable="true"
android:focusableInTouchMode="true" />
<androidx.appcompat.widget.SearchView
android:id="#+id/searchView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="30dp"
android:layout_marginLeft="30dp"
android:layout_marginEnd="35dp"
android:layout_marginRight="35dp"
android:paddingLeft="16dp"
android:paddingRight="16dp"
android:animateLayoutChanges="true"
android:background="#drawable/rounded_bg"
android:layoutDirection="rtl"
app:iconifiedByDefault="true"
app:searchHintIcon="#null" />
</com.google.android.material.appbar.CollapsingToolbarLayout>
</com.google.android.material.appbar.AppBarLayout>
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/myRecyclerView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="3dp"
app:layout_behavior="#string/appbar_scrolling_view_behavior"/>
</androidx.coordinatorlayout.widget.CoordinatorLayout>
In activity:
getSupportActionBar().setBackgroundDrawable(getResources()
.getDrawable(R.drawable.rounded_bg_action_bar));
rounded_bg_action_bar.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<solid android:color="#android:color/holo_purple" />
<corners android:bottomLeftRadius="20dp"
android:bottomRightRadius="20dp" />
</shape>
rounded_bg.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<solid android:color="#android:color/holo_purple" />
<corners android:bottomLeftRadius="100dp"
android:bottomRightRadius="100dp" />
</shape>
Using the new appcompat-v21 I try to build a navigation drawer.. The first time I didn't write any background color or drawable and the navigation drawer started with a transparent background!! So strange! But, when I clicked in the items of it I could see the ripple effect of Android lollipop. (Amazing). So I tried to put a white background like this:
<android.support.v4.widget.DrawerLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
tools:context=".HomeActivity"
android:id="#+id/drawer"
android:layout_width="match_parent"
android:layout_height="match_parent">
<RelativeLayout
android:id="#+id/content_frame"
android:layout_width="match_parent"
android:layout_height="match_parent">
<include
android:id="#+id/toolbar"
layout="#layout/toolbar"/>
</RelativeLayout>
<ListView
android:id="#+id/navdrawer"
android:layout_width="315dp"
android:layout_height="match_parent"
android:layout_gravity="start"
android:choiceMode="singleChoice"
android:fitsSystemWindows="true"
android:clipToPadding="false"
android:divider="#android:color/transparent"
android:dividerHeight="0dp"
android:background="#ffff"/>
</android.support.v4.widget.DrawerLayout>
The navigation drawer now is white and so it's correct. But with this background I lost the ripple effect in the item click. My item XML is this one:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:background="?android:selectableItemBackground"
android:layout_height="fill_parent" >
<LinearLayout
android:id="#+id/spinnerLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="13dp"
android:orientation="vertical" >
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<ImageView
android:id="#+id/sfondomappa"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_weight="0"
android:adjustViewBounds="true"
android:scaleType="center"
android:src="#drawable/banner_nav" />
<TextView
android:id="#+id/drawerWelcome"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/sfondomappa"
android:layout_centerHorizontal="true"
android:background="#40000000"
android:fontFamily="sans-serif-medium"
android:gravity="center_horizontal"
android:padding="10dp"
android:text="Hola"
android:textColor="#color/ldrawer_color"
android:textSize="14sp" />
</RelativeLayout>
</LinearLayout>
<LinearLayout
android:id="#+id/headerLayout"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:orientation="vertical" >
<TextView
android:id="#+id/drawerTitle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_gravity="center_horizontal"
android:layout_margin="12dp"
android:fontFamily="sans-serif-regular"
android:gravity="center_horizontal"
android:textColor="#color/main_orange"
android:textSize="15sp" />
</LinearLayout>
<LinearLayout
android:id="#+id/itemLayout"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
android:background="?android:attr/activatedBackgroundIndicator"
android:orientation="vertical" >
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_centerVertical="true" >
<ImageView
android:id="#+id/drawer_icon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:gravity="center_vertical"
android:padding="3dp" />
<TextView
android:id="#+id/drawer_itemName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_marginLeft="32dp"
android:fontFamily="sans-serif-medium"
android:gravity="center_vertical"
android:textColor="#E4000000"
android:textSize="14sp" />
</LinearLayout>
</LinearLayout>
</RelativeLayout>
I even wrote this android:background="?android:selectableItemBackground" in my root layout but nothing change.. How can I solve?
EDIT:
I wrote again the listview of my drawer in this way
<ListView
android:id="#+id/navdrawer"
android:layout_width="315dp"
android:layout_height="match_parent"
android:layout_gravity="start"
android:layout_marginRight="72dp"
android:background="#android:color/white"
android:choiceMode="singleChoice"
android:divider="#00000000"
android:dividerHeight="1.00dp"
android:elevation="2dp"
android:longClickable="false"
android:orientation="vertical"
android:overScrollMode="never"
android:scrollbars="none" />
and the ripple works. But now i lost the current position i clicked.
I've faced the same problem ... the solution is not documented good enough, but here it is.
Create a selector drawable in your drawable-v21 folder:
v21/activated_background.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#color/primary_dark" android:state_activated="true" />
<item android:drawable="#color/primary" android:state_checked="true" />
<item android:state_pressed="true">
<ripple android:color="#color/primary" />
</item>
<item android:drawable="#color/background_light" />
</selector>
As you can see in the code above, the magic is done by adding the <ripple ... /> element above. It's available in v21+ only, so that's why you have to declare separate selectors for -v21 and normal.
Lastly, just put this selector drawable as background of the desired element, in your case the ListView item.