In order to get action-buttons into my toolbar, I have implemented a custom-toolbar in which the layout with the button images can be defined. In the activity_main layout file, I refer to this custom-toolbar layout via an include instruction.
It works to the extend that now in 1 line at the top of the action bar both contents appear: My program title and the overflow menu icon PLUS the button from the custom-toolbar. The problem is that below this line a second empty row appears with no content. Means, the height of the action bar is doubled and this unwanted area is overlapping my canvas. Here the screenshot of the phenomena:
I have searched for documents addressing this but did not find a mapping case. Furthermore I have tried all kind of constellations in my layout file (e.g. in respect to the postion of the include instruction) but did not achieve a Change. I also tried with different sizes of the image file without a Change. The current size is 3K with 80x49 Pixel.
Here my code which is reduced to show just the case relevant lines:
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.widget.Toolbar;
import android.view.Menu;
import android.view.View;
public class MainActivity extends AppCompatActivity {
private Toolbar toolbar;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
}
#Override
public boolean onCreateOptionsMenu(Menu menu) {
getMenuInflater().inflate(R.menu.menu_main, menu);
return true;
}
public void on_distance_waiting_Click(View view) {
}
}
The main layout:
<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"
tools:context="com.pm.pmactionbaricon.MainActivity">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/AppTheme.AppBarOverlay"
android:orientation="vertical">
<include layout="#layout/custom_toolbar" />
<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>
</android.support.design.widget.CoordinatorLayout>
The custom-toolbar layout:
<android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
app:layout_collapseMode="pin"
android:id="#+id/toolbar"
android:layout_height="?attr/actionBarSize"
android:padding="0dp"
android:layout_width="match_parent"
android:background="#android:color/transparent"
android:fitsSystemWindows="true"
android:orientation="horizontal">
<RelativeLayout
android:layout_width="310dp"
android:layout_height="wrap_content" >
<Button
android:id="#+id/button1"
android:background="#drawable/distance_waiting_small"
android:layout_width="100dp"
android:layout_height="wrap_content"
style="?android:attr/buttonBarButtonStyle"
android:title="#string/Distance"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:onClick="on_distance_waiting_Click"/>
</RelativeLayout>
</android.support.v7.widget.Toolbar>
The style file:
<resources>
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/colorAccent</item>
</style>
<style name="AppTheme.NoActionBar">
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
</style>
<style name="AppTheme.AppBarOverlay" parent="ThemeOverlay.AppCompat.Dark.ActionBar" />
<style name="AppTheme.PopupOverlay" parent="ThemeOverlay.AppCompat.Light" />
<style name="ToolbarTheme" parent="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<item name="android:textColorPrimary">#android:color/holo_blue_light</item>
<item name="actionMenuTextColor">#android:color/holo_green_light</item>
</style>
</resources>
Here also the used Image:
When I work with the Layouts in the design mode, I can recognize that the regular toolbar element (not the custom-toolbar) seems to be responsible for the unwanted area. The following 3 screenshots might help to Highlight this. It is also strange that the appearance here is different from the result on the device as shown at the beginning.
The activity layout (consider what is selected in the right window):
The activity layout with (Standard) toolbar selected:
The custom toolbar:
So, what is causing this unwanted area below the actionbar?
In your activity_main.xml remove the extra toolbar element:
<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"
tools:context="com.pm.pmactionbaricon.MainActivity">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/AppTheme.AppBarOverlay"
android:orientation="vertical">
<include layout="#layout/custom_toolbar" />
</android.support.design.widget.AppBarLayout>
</android.support.design.widget.CoordinatorLayout>
In custom_toolbar.xml layout make changes as shown below:
<android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
app:layout_collapseMode="pin"
android:id="#+id/toolbar"
android:layout_height="?attr/actionBarSize"
android:padding="0dp"
app:popupTheme="#style/AppTheme.PopupOverlay"
android:layout_width="match_parent"
android:background="?attr/colorPrimary"
android:orientation="horizontal">
<RelativeLayout
android:layout_width="310dp"
android:layout_height="wrap_content">
<Button
android:id="#+id/button1"
android:background="#drawable/distance_waiting_small"
android:layout_width="100dp"
android:layout_height="wrap_content"
style="?android:attr/buttonBarButtonStyle"
android:title="#string/Distance"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:onClick="on_distance_waiting_Click"/>
</RelativeLayout>
</android.support.v7.widget.Toolbar>
Also, make sure that your activity tag has this attribute set in the manifest file.
android:theme="#style/AppTheme.NoActionBar"
Related
I'm trying to make my app bleed under the status bar and the navigation bar. I got the layouts to work using fitSystemWindows = true with just the status bar translucent but when I make the navigation bar as well, the toolbar appears to react as if it needs to fill under the status bar and the notification bar.
The toolbar appears to function normally when in landscape for some reason.
This double "translucent" bar effect also makes the NestedScrollView extends beyond the bottom of the page. I am also not sure how to make the FAB fit.
On another note, I originally wrote the layout with a CoordinatorLayout. This added the extra problem that the NestedScrollView then scrolls up to the bottom of where the toolbar should be, not where it is. I think, however, that the NestedScrollView respected the bottom screen boundary properly with CoordinatorLayout.
Here's the xml for the layout:
<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout 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/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.constraint.ConstraintLayout
android:id="#+id/constraint"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.v4.widget.NestedScrollView
android:id="#+id/nested_scroll_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintTop_toBottomOf="#id/toolbar">
<LinearLayout
android:id="#+id/parent"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#00000000"
android:clipToPadding="false"
android:orientation="vertical"
android:paddingBottom="74dp"/>
</android.support.v4.widget.NestedScrollView>
<android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintTop_toTopOf="parent"
android:background="#color/nav_color_1_bright"
android:elevation="4dp"
android:fitsSystemWindows="true"
app:navigationContentDescription="#string/open_nav_menu"
app:navigationIcon="#drawable/ic_dehaze_white_24dp"/>
<android.support.design.widget.FloatingActionButton
android:id="#+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
android:layout_margin="16dp"
android:clipToPadding="false"
android:fitsSystemWindows="true"
android:onClick="createNew"
android:src="#drawable/ic_add_black_24dp"
app:backgroundTint="#color/darkAccent"
app:fabSize="normal" />
</android.support.constraint.ConstraintLayout>
<android.support.design.widget.NavigationView
android:id="#+id/navigation"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"
android:fitsSystemWindows="true"
app:headerLayout="#layout/nav_header"
app:itemBackground="#drawable/nav_item">
<ListView
android:id="#+id/drawer_list"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:divider="#null"
android:dividerHeight="0dp"
android:fitsSystemWindows="true" />
</android.support.design.widget.NavigationView>
</android.support.v4.widget.DrawerLayout>
I apply the following 'Light Theme' to the Activity programmatically.
<style name="AppTheme" parent="Theme.AppCompat.DayNight.NoActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/colorAccent</item>
<item name="android:windowTranslucentStatus">true</item>
<item name ="android:windowTranslucentNavigation">true</item>
</style>
<style name="LightTheme" parent="AppTheme">
<item name="android:colorPrimary">#color/lightPrimary</item>
<item name="android:colorPrimaryDark">#color/lightPrimaryDark</item>
<item name="android:colorAccent">#color/lightAccent</item>
<item name="android:navigationBarColor">#color/lightPrimaryDark</item>
<item name="actionOverflowButtonStyle">#style/OverflowMenuButtonStyleDark</item>
</style>
Here's a preview of the layout: (bigger version here)
Im adding a Hamburger Icon on the lesft side of my ToolBar but when Im running it the app crashes
Here is my xml file
<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:fitsSystemWindows="true"
android:orientation="vertical">
<android.support.design.widget.AppBarLayout
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="#dimen/abc_action_bar_default_height_material"
android:background="?attr/colorPrimary"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.v7.widget.Toolbar
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="Test"
android:background="#color/colorPrimary"
android:textColor="#color/black"
android:textSize="18dp"
android:gravity="center"/>
</android.support.v7.widget.Toolbar>
</android.support.design.widget.AppBarLayout>
<android.support.v4.widget.DrawerLayout
android:id="#+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<!-- Real content goes here -->
<FrameLayout
android:id="#+id/content"
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:textColor="#color/black"
android:text="Test"/>
</FrameLayout>
<!-- The navigation drawer -->
<android.support.design.widget.NavigationView
android:id="#+id/navigation"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"
app:headerLayout="#layout/navigation_header"
app:menu="#menu/navigation_menu"/>
</android.support.v4.widget.DrawerLayout>
</LinearLayout>
and here is my java class
import android.support.v4.widget.DrawerLayout;
import android.support.v7.app.ActionBarDrawerToggle;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.support.v7.widget.Toolbar;
public class test extends AppCompatActivity {
private DrawerLayout sideBar;
private ActionBarDrawerToggle sideBarToggle;
private Toolbar actionToolbar;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_test);
/* Side Bar */
actionToolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(actionToolbar);
sideBar = (DrawerLayout) findViewById(R.id.navigation);
sideBarToggle = new ActionBarDrawerToggle(this, sideBar, R.string.Open, R.string.Close);
sideBar.addDrawerListener(sideBarToggle);
sideBarToggle.syncState();
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
}
}
Does it have any conflict with my custom Toolbar?
I dont know whats wrong and Im trying to search everywhere but still no luck. I dont know what or where to fix. thnx for the future help
Updated
<android.support.v7.widget.Toolbar
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/toolbar"
>
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="#dimen/abc_action_bar_default_height_material"
android:background="?attr/colorPrimary"
android:theme="#style/Theme.AppCompat.DayNight.NoActionBar">
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/colorPrimary"
android:gravity="center"
android:text="Test"
android:textColor="#color/black"
android:textSize="18dp" />
</android.support.design.widget.AppBarLayout>
</android.support.v7.widget.Toolbar>
Added style.xml
<resources>
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.DayNight.NoActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/colorAccent</item>
</style>
</resources>
style.xml
<resources>
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/colorAccent</item>
</style>
</resources>
main_activity.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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="im.opriday.customlistview.MainActivity">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbr"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</android.support.design.widget.AppBarLayout>
</RelativeLayout>
MainActivity
import android.support.v7.widget.Toolbar instead of import android.widget.Toolbar
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbr);
setSupportActionBar(toolbar);
getSupportActionBar().setTitle("Hello");
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
getSupportActionBar().setDisplayShowHomeEnabled(true);
getSupportActionBar().setHomeAsUpIndicator(R.drawable.ic_menu_black_24dp);
}
This code would be correct. No need in extra TextView
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="#dimen/abc_action_bar_default_height_material"
android:background="?attr/colorPrimary"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</android.support.design.widget.AppBarLayout>
You do not have identifier(android:id="#+id/toolbar") mentioned for the toolbar which you are referencing in your code. Since its not found it would return exception.
<android.support.design.widget.AppBarLayout
android:id="#+id/appBarLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.v7.widget.Toolbar
android:layout_width="match_parent"
android:id="#+id/toolbar" <!---missing-->
android:layout_height="200dp">
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="Test"
android:background="#color/colorPrimary"
android:textColor="#color/black"
android:textSize="18dp"
android:gravity="center"/>
</android.support.v7.widget.Toolbar>
</android.support.design.widget.AppBarLayout>
Your style.xml should have parent with ActionBar like ThemeOverlay.AppCompat.Dark.ActionBar and not NoActionBar as you have right now
<resources>
<!-- Base application theme. -->
<style name="AppTheme" parent="ThemeOverlay.AppCompat.Dark.ActionBar">
Please follow this tutorial for guidance link
Your layout must be in this order.
<DrawerLayout>
<AppBarLayout>
<Toolbar>
// Toolbar content
</Toolbar>
</AppBarLayout>
<NavigationView />
</DrawerLayout>
You need to include the toolbar in your ActionBarDraweToggle constructor parameter if you want a default hamburger menu.
sideBarToggle = new ActionBarDrawerToggle(this, sideBar, actionToolbar , R.string.Open, R.string.Close);
I have a tab layout and each tab is represented my a fragment in the viewpager. Now I tried to attach a Toolbar to the bottom but the android navigation bar keeps overlapping it. Adding a margin is not a option because it looks very strange on devices without a navigation bar on the screen.
XML from main activity:
<?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:id="#+id/main_content"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:context=".MainActivity">
<android.support.design.widget.AppBarLayout
android:id="#+id/appbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingTop="#dimen/appbar_padding_top"
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:layout_weight="1"
android:background="?attr/colorPrimary"
app:layout_scrollFlags="scroll|enterAlways"
app:popupTheme="#style/AppTheme.PopupOverlay"
app:title="#string/app_name">
</android.support.v7.widget.Toolbar>
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.design.widget.TabItem
android:id="#+id/tabItem"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/fragment_map_title" />
<android.support.design.widget.TabItem
android:id="#+id/tabItem2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/fragment_list_title" />
</android.support.design.widget.TabLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
</android.support.design.widget.CoordinatorLayout>
XML from fragment:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<com.google.android.gms.maps.MapView
android:id="#+id/mapView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_above="#id/ballon_info_bar" />
<android.support.v7.widget.Toolbar
android:background="#2a3b4c"
android:id="#+id/ballon_info_bar"
android:layout_width="match_parent"
android:layout_height="120dp"
android:layout_alignParentBottom="true"
android:layout_marginBottom="20dp">
</android.support.v7.widget.Toolbar>
</RelativeLayout>
Style XML:
<resources>
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/colorAccent</item>
<item name="android:windowTranslucentNavigation">true</item>
</style>
<style name="AppTheme.NoActionBar">
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
</style>
<style name="AppTheme.AppBarOverlay" parent="ThemeOverlay.AppCompat.Dark.ActionBar" />
<style name="AppTheme.PopupOverlay" parent="ThemeOverlay.AppCompat.Light" />
</resources>
I found several other posts about this topic but none of them solved my problem.
EDIT1: The margin in the image is just for visualization.
EDIT2: According to the blueprint, the ViewPager is alredy behind the navigationbar
The solution is:
Setting android:fitsSystemWindows to false and setting android:windowTranslucentNavigation to false in style.xml
I have white toolbar with menu item showed as action that is a black vector asset from material icons. There is no ripple effect on menu item click because ripple effect is also white. If toolbar background is changed to other color e.g blue, ripple appears. How to change menu item ripple color so it will be visible on white background? I was trying to change colorControlHighlight in AppTheme but it hasn't changed menu item ripple color.
Style
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
<item name="colorPrimary">#ffffff</item>
</style>
Layout
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"/>
</android.support.design.widget.AppBarLayout>
</LinearLayout>
Menu
<?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/menu_action_read_all"
android:icon="#drawable/ic_done_all_black_24dp"
android:title="#string/menu_notifications_read_all"
app:showAsAction="ifRoom" />
</menu>
Activity
#Override
protected void onCreate(#Nullable Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setSupportActionBar((Toolbar) findViewById(R.id.toolbar));
}
#Override
public boolean onCreateOptionsMenu(Menu menu) {
getMenuInflater().inflate(R.menu.menu_notifications, menu);
return true;
}
In your styles:
<style name="MyToolbarTheme" parent="#style/ThemeOverlay.AppCompat.Light">
<item name="colorControlHighlight">#color/colorAccent</item>
</style>
Apply this theme to your toolbar:
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:popupTheme="#style/MyToolbarTheme"/>
Result:
EDIT
For the action item:
<style name="MyAppBarLayoutTheme" parent="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<item name="colorControlHighlight">#color/colorAccent</item>
</style>
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/MyAppBarLayoutTheme">
<android.support.v7.widget.Toolbar/>
</android.support.design.widget.AppBarLayout>
Result:
Even I faced similar issue due to AppTheme. I was using Theme.MaterialComponents.NoActionBar as default theme for App and only for toolbar the ripple effect was not working. However I solved it using app:theme.
Please try adding a app:theme="#style/Theme.AppCompat.Light.NoActionBar" to your toolbar. This is test with androidx.appcompat.widget.Toolbar it is working for me.
<androidx.appcompat.widget.Toolbar
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#android:color/white"
app:layout_collapseMode="pin"
android:elevation="4dp"
app:theme="#style/Theme.AppCompat.Light.NoActionBar"
android:stateListAnimator="#animator/appbar_elevation"
tools:targetApi="lollipop">
If your view doesn't ripple by default then, all you have to do is add android:background="?attr/selectableItemBackground" to your view to get that ripple/touch effect.
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:background="?attr/selectableItemBackground"
android:contentDescription="#null"
android:src="#mipmap/ic_launcher" />
path : drawable/action_item_ripple
action_item_ripple.xml
<?xml version="1.0" encoding="utf-8"?>
<ripple
xmlns:android="http://schemas.android.com/apk/res/android"
android:color="#android:color/white"
android:radius="20dp">
</ripple>
use
<com.google.android.material.appbar.AppBarLayout
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="wrap_content"
android:theme="#style/AppTheme.AppBarOverlay">
<androidx.appcompat.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"
app:titleTextAppearance="#style/TextAppearance.Widget.Event.Toolbar.Title"
app:titleTextColor="#android:color/white">
<TextView
android:id="#+id/textViewTitleToolbar"
style="#style/TextAppearance.AppCompat.Widget.ActionBar.Title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="#string/app_name"
android:textColor="#android:color/white" />
<androidx.appcompat.widget.AppCompatImageButton
android:id="#+id/imageViewToolbar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="start"
android:background="#drawable/action_item_ripple"
android:src="#android:drawable/ic_delete"
android:visibility="invisible" />
</androidx.appcompat.widget.Toolbar>
Actually i want to put Action Bar menu into my layout given below, i am no getting how to put the Action bar menu into it. Can anyone help me in fixing this problem...
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingLeft="16dp"
android:paddingRight="16dp"
android:id="#id/action_bar"
>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Enable Pin"
android:id="#+id/button"
android:layout_marginBottom="140dp"
android:layout_alignParentBottom="true"
android:layout_alignEnd="#+id/button2"
android:layout_alignStart="#+id/button2" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Enable Pattern"
android:id="#+id/button2"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:layout_marginBottom="51dp" />
</RelativeLayout>
first you must use tool bar because action bar is deprecated
and for that add below code to your layout
<?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="match_parent"
android:orientation="vertical"
android:background="#drawable/back">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
android:fitsSystemWindows="true"
/>
<!-- add your other layout component here -->
</LinearLayout>
and in your activity you must extend form appcompactActivity like below:
public class MainActivity extends AppCompatActivity {
private Toolbar toolbar;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.yourlayout);
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
}
}
and in the style.xml add this code: specially this parent="Theme.AppCompat.Light.NoActionBar"
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
<item name="colorPrimary">#color/primary</item>
<item name="colorPrimaryDark">#color/primary_dark</item>
<item name="colorAccent">#color/accent</item>
</style>
You should use Toolbar, since ActionBar is deprecated. Add this in your layout file:
<android.support.v7.widget.Toolbar
android:id=”#+id/my_awesome_toolbar”
android:layout_height=”wrap_content”
android:layout_width=”match_parent”
android:minHeight=”?attr/actionBarSize”
android:background=”?attr/colorPrimary” />
Depending on your other project files, you may need to modify the styles.xml and your activity. Check out this link for more info.