xamarin inflate menu action bar icons not showing, only text appears - android

i use this code to create menu for action bar in xamarin. but text is being shown, not the icon. i want icons only to be appear. Here is what i try for creating the menu.
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res/android-auto">
<item android:id="#+id/action_reply"
android:icon="#drawable/ic_rotate"
android:title="Reply"
android:showAsAction="always" />
<item android:id="#+id/action_undo"
android:icon="#drawable/ic_dashboard"
android:title="Undo"
android:showAsAction="never" />
</menu>
Here is the action bar code
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:local="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#FEFEFE">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:minHeight="?attr/actionBarSize"
android:background="?attr/colorPrimary"
local:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
local:popupTheme="#style/ThemeOverlay.AppCompat.Light"
android:layout_alignParentTop="true" />
can anyone suggest some improvements?

You are using the Android Support V7 Toolbar, you need to correct your menu to use xmlns:local="http://schemas.android.com/apk/res/android-auto" instead of xmlns:app="http://schemas.android.com/apk/res/android-auto" then change android:showAsAction="always" to local:showAsAction="always"

Related

Android Studio How do I get my Bottom navigation view to show my menu

Im trying to get my material Bottom Navigation bar to show up but whenever i add " app:menu="#menu/nav_menu" " to my acitivty_main.xml, the Navigation bar disappears. How do I fix this?
activity_main.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=".MainActivity">
<FrameLayout
android:id="#+id/fl_wrapper"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#+id/bottom_navigation"/>
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="#+id/bottom_navigation"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
app:menu="#menu/nav_menu"
/>
</RelativeLayout>
nav_menu.xml
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:id="#+id/navigation_profile"
android:icon="#drawable/ic_profile"
android:title="Favorites"
android:visible="true"/>
<item
android:id="#+id/navigation_steps"
android:icon="#drawable/ic_steps"
android:title="Steps"
android:visible="true"
/>
<item
android:id="#+id/navigation_home"
android:icon="#drawable/ic_action_home"
android:title="Home"
android:visible="true"/>
</menu>
I'm not sure why it's not working. When i take away the app:menu part it shows a black navigation bar but as soon as I add the menu, the navigation bar disappears.
I think you need to set background color to bottomnavigation menu.
try adding
android:background="?android:attr/windowBackgroud" in your bottomnavigation menu.

Change the color of overflow menu icons in a material toolbar

I want to change the overflow menu icons color in my material toolbar depending on the android:theme value.
In this example my search icon is affected by the toolbar's theme via some magic related to the app:actionViewClass attribute implementation, but my info icon is not.
My toolbar:
<?xml version="1.0" encoding="utf-8"?>
<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:fitsSystemWindows="true"
app:liftOnScroll="true">
<com.google.android.material.appbar.MaterialToolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:theme="#style/ThemeOverlay.MaterialComponents.Dark.ActionBar"
style="#style/Widget.MaterialComponents.Toolbar.Primary"
app:title="#string/app_name"
app:menu="#menu/menu_main"
app:layout_scrollFlags="scroll|enterAlways|snap"/>
</com.google.android.material.appbar.AppBarLayout>
My 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/action_search"
android:icon="#drawable/ic_search_24dp"
app:showAsAction="always"
app:actionViewClass="androidx.appcompat.widget.SearchView"
android:title="TODO" />
<item android:id="#+id/action_info"
android:icon="#drawable/ic_info_24dp"
app:showAsAction="always"
android:title="TODO" />
</menu>
Does a simple solution exists?
You can use:
<com.google.android.material.appbar.MaterialToolbar
style="#style/Widget.MaterialComponents.Toolbar.Primary"
android:theme="#style/MyThemeOverlay_Toolbar"
...>
<style name="MyThemeOverlay_Toolbar" parent="ThemeOverlay.MaterialComponents.Toolbar.Primary">
<!-- color used by navigation icon and overflow icon -->
<item name="colorOnPrimary">#color/myColor</item>
</style>
You can head over to the Material Components documentation which has a lot of information about styling each part of views from the library.
In this case it seems like the action icon tint is set by the colorControlNormal attribute.
Documentation - Top app bars
Maybe this answer comes too late, but just in case other people need it, I will post my answer here.
The problem you are facing will be solved if you set the attribute theme to the AppBarLayout instead of the MaterialToolbar.
So, in your code, your toolbar should look like this:
<?xml version="1.0" encoding="utf-8"?>
<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:fitsSystemWindows="true"
android:theme="#style/ThemeOverlay.MaterialComponents.Dark.ActionBar"
app:liftOnScroll="true">
<com.google.android.material.appbar.MaterialToolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
style="#style/Widget.MaterialComponents.Toolbar.Primary"
app:title="#string/app_name"
app:menu="#menu/menu_main"
app:layout_scrollFlags="scroll|enterAlways|snap"/>
</com.google.android.material.appbar.AppBarLayout>
Hope this helps to anyone!

Menu with Text only not showing in Toolbar

I have to show back icon, Logo and text (Next) in Toolbar. Next is right aligned. I tried placing text via menu. I have set logo and back button to toolbar.
toolbar.setLogo(R.mipmap.logo);
toolbar.setNavigationIcon(R.mipmap.back);
Also, I have inflated following menu in onCreateOptionsMenu
Menu inflated:
<menu 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"
>
<item
android:id="#+id/action_next"
android:title="#string/next"
app:showAsAction="always" />
Text Menu is not visible at all. if I put icon in menu item, it gets displayed.
I have used android.support.v7.widget.Toolbar.
Edited:
I solved it. In case someone else gets struck with such issue.
Please add
<item name="android:actionMenuTextColor">#color/blue</item>
in styles. Menu itemw as getting selected on click but was not visible, means it was showing white text color on white toolbar. Setting menuText color solved my problem.
Android Documentation explains that the withText option for showAsAction will
Also include the title text (defined by android:title) with the action item.
Since that is what you want, code the following.
<item
android:id="#+id/action_next"
android:title="#string/next"
app:showAsAction="always|withText" />
You can do something like this:
First, remove default title in your Activity:
getSupportActionBar().setDisplayShowTitleEnabled(false);
Then, your toolbar layout can be like this:
<LinearLayout
android:id="#+id/toolbar_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<android.support.v7.widget.Toolbar
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#color/material_blue"
android:elevation="5dp"
android:minHeight="?attr/actionBarSize" >
<TextView
android:id="#+id/toolbar_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="end"
android:gravity="end"
android:text="#string/app_name"
android:textColor="#android:color/white" />
</android.support.v7.widget.Toolbar>
</LinearLayout>
And, in your activity handle the click event:
toolbarTop.findViewById(R.id.toolbar_title).setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
Log.d(TAG,"Clicked");
}
});
Try Changing to support widget. This worked for me
app:actionViewClass="android.support.v7.widget.SearchView"
This what it looked after the change
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools">
<item android:id="#+id/search"
android:title="#string/search_title"
android:icon="#drawable/ic_search"
app:showAsAction="always|withText"
app:actionViewClass="android.support.v7.widget.SearchView"
tools:context=".AppHome.HomeActivity"/>
</menu>
If you are getting an empty action with no text but blank space in it,
it might happen if you have created your own tool bar in the layout and have also used the Action bar in your theme's parent.
If you are creating your own toolbar then use parent="Theme.MaterialComponents.DayNight.NoActionBar" in your themes, both normal and night themes.
It's happening because of the style used in your layout.
To solve this, define a new style and use it in your layout.
<style name="ToolBarStyle" parent="ThemeOverlay.MaterialComponents.Dark.ActionBar">
<item name="android:itemBackground">#fff</item> // background color of the menus
<item name="android:textColor">#000</item>// text color of the menus
</style>
Use it like this in your layout
<com.google.android.material.appbar.MaterialToolbar
android:id="#+id/my_toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:theme="#style/ToolBarStyle"
app:popupTheme="#style/ThemeOverlay.MaterialComponents.Light"
android:background="#color/primary_pink"
android:minHeight="?attr/actionBarSize"
android:elevation="4dp"
/>

Android ActionBar text shows

Problem:
Can anyone please explain the cause for this?
The toolbar text is not properly shown.
Tried:
Tried setting the actionbar text in activity, switching fragment, from menu option method, everywhere
Tried managing the action menu elements
Thanks!
TOOLBAR LAYOUT
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.Toolbar android:id="#+id/toolbar_main"
android:layout_width="match_parent"
app:popupTheme="#style/AppTheme.PopupOverlay"
android:layout_height="?attr/actionBarSize"
android:background="#color/colorPrimary"
app:titleTextColor="#color/colorPrimaryDark"
android:elevation="7dp"
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto" />
MENU LAYOUT
<?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/action_search"
android:icon="#drawable/ic_search_white_24px"
app:showAsAction="always"
android:title="Search"/>
</menu>

Action Bar not displaying menu item with both icon and text

Despite there being enough space in the action bar , only the icon is being displayed, even when I am using
app:showAsAction= "always|withText"
Full code:
<menu 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"
tools:context="com.ishaan.admin.notify.Profile">
<item android:id="#+id/action_logout"
android:title="Logout"
android:icon="#drawable/logout_icon"
app:showAsAction= "always|withText" />
</menu>
It is known thing on the Android 4.0 and discussed ealier
Your can find solution here:
android 4.0, text on the action bar NEVER shows
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<item
android:id="#+id/toolbar_right_button"
android:orderInCategory="1"
android:title="Text"
app:actionLayout="#layout/menu_item_1"
app:showAsAction="ifRoom|withText"/>
</menu>
and in Layout create Layout File menu_item_1.xml:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal">
<Button
android:id="#+id/logout_button"
style="?android:attr/borderlessButtonStyle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:drawableRight="#drawable/ic_toolbar_locked"
android:gravity="center_vertical"
android:text="Text"
android:textColor="#color/PrimaryColour"/>
</RelativeLayout>

Categories

Resources