I'm implementing material design to my application. I replaced native ActionBar with new android Toolbar. Menu items are added, onOptionsItemSelected works perfectly. But when I click overflow icon or item with several more menu items, the application crashes.
toolbar screenshot: https://www.dropbox.com/s/smay4k1qwkd8amz/Screenshot_2015-05-29-11-31-55.png?dl=0
activity_main.xml
?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<android.support.v7.widget.Toolbar
android:id="#+id/app_bar"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:minHeight="?attr/actionBarSize"
android:background="#color/my_primary"
app:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light">
</android.support.v7.widget.Toolbar>
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="Hello World, MyActivity"
/>
</LinearLayout>
styles.xml
<?xml version="1.0" encoding="utf-8"?>
<resources>
<style name="AppTheme" parent="AppTheme.Base">
</style>
<style name="AppTheme.Base" parent="Theme.AppCompat.Light.NoActionBar">
<item name="colorPrimary">#color/my_primary</item>
<item name="colorPrimaryDark">#color/my_primary_dark</item>
<item name="colorAccent">#color/my_accent</item>
</style>
</resources>
MyActivity.java
public class MyActivity extends ActionBarActivity {
private Toolbar toolbar;
/**
* Called when the activity is first created.
*/
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
toolbar = (Toolbar) findViewById(R.id.app_bar);
setSupportActionBar(toolbar);
}
#Override
public boolean onCreateOptionsMenu(Menu menu) {
MenuInflater inflater = getMenuInflater();
inflater.inflate(R.menu.main, menu);
return super.onCreateOptionsMenu(menu);
}
}
menu\main.xml
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:Compat="http://schemas.android.com/apk/res/com.example.myapp">
<item
android:id="#+id/action_add"
android:title="Add"
android:icon="#android:drawable/ic_menu_add"
Compat:showAsAction="always"/>
<item
android:title="Items"
android:icon="#android:drawable/ic_menu_agenda"
Compat:showAsAction="always"
>
<menu>
<item
android:id="#+id/action_1"
android:title="item1"/>
<item
android:id="#+id/action_2"
android:title="item2"/>
</menu>
</item>
<item
android:id="#+id/action_about"
android:title="About"
android:icon="#android:drawable/ic_menu_help"
Compat:showAsAction="never"/>
</menu>
The following message is shown after the crash:
05-29 11:21:18.012 31469-31469/com.example.myapp E/AndroidRuntime﹕ FATAL EXCEPTION: main
Process: com.example.myapp, PID: 31469
java.lang.NoSuchFieldError: No static field title of type I in class Landroid/support/v7/appcompat/R$id; or its superclasses (declaration of 'android.support.v7.appcompat.R$id' appears in /data/app/com.example.myapp-1/base.apk)
at android.support.v7.internal.view.menu.ListMenuItemView.onFinishInflate(ListMenuItemView.java:89)
at android.view.LayoutInflater.rInflate(LayoutInflater.java:814)
at android.view.LayoutInflater.inflate(LayoutInflater.java:504)
at android.view.LayoutInflater.inflate(LayoutInflater.java:414)
at android.support.v7.internal.view.menu.MenuPopupHelper$MenuAdapter.getView(MenuPopupHelper.java:370)
at android.support.v7.internal.view.menu.MenuPopupHelper.measureContentWidth(MenuPopupHelper.java:219)
at android.support.v7.internal.view.menu.MenuPopupHelper.tryShow(MenuPopupHelper.java:153)
at android.support.v7.widget.ActionMenuPresenter$OpenOverflowRunnable.run(ActionMenuPresenter.java:752)
at android.os.Handler.handleCallback(Handler.java:739)
at android.os.Handler.dispatchMessage(Handler.java:95)
at android.os.Looper.loop(Looper.java:135)
at android.app.ActivityThread.main(ActivityThread.java:5293)
at java.lang.reflect.Method.invoke(Native Method)
at java.lang.reflect.Method.invoke(Method.java:372)
at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:904)
at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:699)
Also I am using the last version of appcompat library. I followed tutorials, googled, but nothing is found. What is the reason of this crash? Please, help.
Read here.. http://developer.android.com/guide/topics/ui/menus.html
You have just created menus, you haven't provided their functions. in other words, you just inflate the menus on screen, not provided the function what they will do if use clicks on it.
To enable them you need to implement following method, for example
#Override
public boolean onOptionsItemSelected(MenuItem item) {
// Handle item selection
switch (item.getItemId()) {
case R.id.new_game:
newGame();
return true;
case R.id.help:
showHelp();
return true;
default:
return super.onOptionsItemSelected(item);
}
}
in your mainActivity.
If you are using trasitive = false ; in build.gradle then remove it
Related
I want to make an app with a custom toolbar with a menu on the toolbar. The problem I have is that when I run the app and I click on the menu on the right side of the toolbar, the options do not appear but the menu box appears. One of the options closes the app and if I click the menu area where the exit option is the app closes.
Here is my activity_main.xml file:
<?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"
tools:context=".MainActivity">
<androidx.appcompat.widget.Toolbar
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#color/toolbar_color"
android:id="#+id/toolbar"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:title="#string/app_name"
app:logo="#drawable/applogo">
</androidx.appcompat.widget.Toolbar>
Here is my mainActivity.java:
public class MainActivity extends AppCompatActivity {
Toolbar toolbar;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
toolbar = findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
}
#Override
public boolean onCreateOptionsMenu(Menu menu) {
getMenuInflater().inflate(R.menu.menu, menu);
return super.onCreateOptionsMenu(menu);
}
#Override
public boolean onOptionsItemSelected(#NonNull MenuItem item) {
int id = item.getItemId();
if(id == R.id.exit)
{
this.finishAffinity();
}
return true;
}
}
This is my menu.xml file:
<?xml version="1.0" encoding="utf-8"?>
<item
android:title="#string/new_entry"
android:id="#+id/add">
</item>
<item
android:title="#string/about"
android:id="#+id/about">
</item>
<item
android:title="#string/exit"
android:id="#+id/exit">
</item>
I created the toolbar xml I set it in MainActivity .. I created the menu xml and I inflate it in MainActivity from all the tutorials these are the steps that I had to go through to get here, yet I don't know why the items in the menu xml file won't show up in the emulator.
Big thanks to Gabriele Mariotti. In his words: " The issue is the text color in the popup menu." .All I had to do was to was to add the following line of code to the Toolbar xml.
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"
Try this one I have made a demo for you it is working I have tested it on the emulator as well as the device.
<?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"
>
<androidx.appcompat.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/teal_700"
android:elevation="4dp"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:text="Hello World!" />
</RelativeLayout>
MainActivity
public class MainActivity extends AppCompatActivity {
Toolbar toolbar;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
toolbar = findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
}
#Override
public boolean onCreateOptionsMenu(Menu menu) {
MenuInflater inflater = getMenuInflater();
inflater.inflate(R.menu.my_menu, menu);
return true;
}
}
my_menu
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<item
android:id="#+id/item1"
android:title="Item 1"
app:showAsAction="never" />
<item
android:id="#+id/item2"
android:title="Item 2"
app:showAsAction="never" />
<item
android:id="#+id/item3"
android:title="Item 3"
app:showAsAction="never" />
<item
android:id="#+id/item4"
android:title="Item 4"
app:showAsAction="never" />
</menu>
I want to add a menu to my main activity. When I start my application, all shows up correctly but the menu. What I'm doing wrong?
This is my activity_main.xml:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<WebView
android:id="#+id/activity_main_webview"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</RelativeLayout>
This is part of the MainActivity.java:
#Override
public boolean onCreateOptionsMenu(Menu menu) {
getMenuInflater().inflate(R.menu.menu_main, menu);
return super.onCreateOptionsMenu(menu);
}
#Override
public boolean onOptionsItemSelected(MenuItem item) {
switch (item.getItemId()){
case R.id.menu1:
Toast.makeText(this, "Clicked Menu 1", Toast.LENGTH_SHORT).show();
break;
case R.id.menu2:
Toast.makeText(this, "Clicked Menu 2", Toast.LENGTH_SHORT).show();
break;
default:
break;
}
return super.onOptionsItemSelected(item);
}
This is the styles.xml
<resources>
<style name="AppTheme" parent="android:Theme.DeviceDefault.Light">
<item name="android:statusBarColor">#android:color/black</item>
<item name="android:windowActionBar">false</item>
<item name="android:windowNoTitle">true</item>
</style>
</resources>
And for last, this is the menu_main.xml:
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:id="#+id/menu1"
android:title="Option 1" />
<item
android:id="#+id/menu2"
android:title="Optiion 2" />
</menu>
Is your activity extending from AppCompatActivity?
Extending from AppCompatActivity allows you to set the toolbar using the method setSupportActionBar check this first.
If not, the 'easy' way would be to use a theme that by default provides you an AppBar (ending with .DarkActionBar for example)
You need to create a toolbar in your activity_main.xml and in your MainActivity.java in the onCreate add this:
setSupportActionBar(yourToolbarId);
Now I have this
But I want to make this:
<?xml version="1.0" encoding="utf-8"?>
<item
android:id="#+id/menu"
android:icon="#drawable/ic_menu"
android:title="#string/title_menu"
app:showAsAction="always" />
<item
android:id="#+id/file"
android:icon="#drawable/ic_file"
android:title="#string/title_file"
app:showAsAction="always" />
<item
android:id="#+id/new_file"
android:icon="#drawable/ic_new_file"
android:title="#string/title_new_file"
app:showAsAction="always" />
<item
android:id="#+id/visual"
android:icon="#drawable/ic_eye"
android:title="#string/title_eye"
app:showAsAction="always" />
<item
android:id="#+id/print"
android:icon="#drawable/ic_print"
android:title="#string/title_print"
app:showAsAction="always" />
<item android:id="#+id/help"
android:icon="#drawable/ic_help"
android:title="#string/title_help" />
This menu I add in activity
override fun onCreateOptionsMenu(menu: Menu): Boolean {
val inflater = menuInflater
inflater.inflate(R.menu.designer_options_menu, menu)
return true
}
And I don't understand how I can install ic_menu at the left side
You can use the Up/Home button for doing that by using a custom toolbar within a CoordinatorLayout:
1. 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=".MainActivity">
<android.support.design.widget.AppBarLayout
android:id="#+id/appbar"
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="?attr/actionBarSize"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light">
</android.support.v7.widget.Toolbar>
</android.support.design.widget.AppBarLayout>
<!-- My Layout -->
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Hello World!" />
</LinearLayout>
</android.support.design.widget.CoordinatorLayout>
2. Your 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/folder"
android:icon="#drawable/ic_folder_black_24dp"
android:orderInCategory="1"
android:title=""
app:showAsAction="always" />
<item
android:id="#+id/file"
android:icon="#drawable/ic_insert_drive_file_black_24dp"
android:orderInCategory="2"
android:title=""
app:showAsAction="always" />
<item
android:id="#+id/eye"
android:icon="#drawable/ic_remove_red_eye_black_24dp"
android:orderInCategory="3"
android:title=""
app:showAsAction="always" />
<item
android:id="#+id/print"
android:icon="#drawable/ic_print_black_24dp"
android:orderInCategory="4"
android:title=""
app:showAsAction="always" />
</menu>
3. Java
public class MainActivity extends AppCompatActivity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
Toolbar toolbar = findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
if (getSupportActionBar() != null) {
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
getSupportActionBar().setHomeAsUpIndicator(R.drawable.ic_menu_black_24dp);
getSupportActionBar().setTitle("");
}
}
#Override
public boolean onOptionsItemSelected(MenuItem item) {
switch (item.getItemId()) {
case android.R.id.home:
Toast.makeText(this, "Home", Toast.LENGTH_SHORT).show();
break;
case R.id.eye:
Toast.makeText(this, "Eye", Toast.LENGTH_SHORT).show();
break;
case R.id.file:
Toast.makeText(this, "File", Toast.LENGTH_SHORT).show();
break;
case R.id.folder:
Toast.makeText(this, "Folder", Toast.LENGTH_SHORT).show();
break;
case R.id.print:
Toast.makeText(this, "Print", Toast.LENGTH_SHORT).show();
break;
}
return super.onOptionsItemSelected(item);
}
#Override
public boolean onCreateOptionsMenu(Menu menu) {
getMenuInflater().inflate(R.menu.menu, menu);
return true;
}
}
4. Style: use NoActionBar theme
<resources>
<!-- Base application theme. -->
<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>
5. Gradle:: add design support library for coordinator layout
implementation 'com.android.support:design:28.0.0'
The result
Simpler Version
Add android:icon to your Main Activity or whatever Activity you want this icon:
<activity
android:name=".Main"
android:icon="#drawable/ic_settings_white_24dp"
android:launchMode="singleTop">
Enable the "home" icon in your Main.java:
getActionBar().setDisplayShowHomeEnabled( true ); // In your onCreate() or wherever.
You might also want to hide the back icon in the top left and the app name in the top left. You can do that with these two commands:
// Disable back icon in top left and hide app name.
getActionBar().setDisplayHomeAsUpEnabled( false );
getActionBar().setDisplayShowTitleEnabled( false );
To handle the click event you just need to capture the home in onOptionsItemSelected:
#Override
public boolean onOptionsItemSelected( MenuItem item ) {
switch( item.getItemId() ) {
case android.R.id.home:
// Do something.
return true;
}
}
Worked for us and the end result is something like this:
With AppCompatActivity
You need to do this slightly differently if your Activity is extending from AppCompatActivity. Here are the changes to the steps above:
No need to add android:icon to AndroidManifest.xml.
Set the Icon to use in your Main.java Activity and use getSupportActionBar():
getSupportActionBar().setHomeAsUpIndicator( R.drawable.ic_settings_white_24dp );
i created an a custom toolbar to replace the default action bar of appcompat in android. but when i run the application i get two title, like in the picture
http://i.stack.imgur.com/wOPVE.png
i want only the title in the middle
here the code:
Main.java
public class MainMenu extends AppCompatActivity{
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main_menu);
Toolbar toolbar = (Toolbar)findViewById(R.id.mytoolbar);
setSupportActionBar(toolbar);
Typeface mistral = Typeface.createFromAsset(getAssets(), "MISTRAL.TTF");
TextView title = (TextView)findViewById(R.id.toolbar_title);
title.setText("Fyllo");
title.setTypeface(mistral);
}
#Override
public boolean onCreateOptionsMenu(Menu menu){
super.onCreateOptionsMenu(menu);
getMenuInflater().inflate(R.menu.my_menu, menu);
return true;
}
#Override
public boolean onOptionsItemSelected(MenuItem item) {
int id =item.getItemId();
if(id == R.id.action_settings){
Toast.makeText(getApplicationContext(),"this is a menu option",Toast.LENGTH_SHORT).show();
return true;
}
return super.onOptionsItemSelected(item);
}
MainMenu.xml
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
tools:context="com.example.adams.fyllo.MainMenu">
<android.support.v7.widget.Toolbar
android:id="#+id/mytoolbar"
android:layout_width="match_parent"
android:layout_height="56dp"
android:background="#00000000"
android:elevation="4dp"
android:title="Services">
<TextView
android:id="#+id/toolbar_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="18sp"
android:textAppearance="?android:attr/textAppearanceMedium"
android:layout_gravity="center"
android:text="Toolbar Title" />
</android.support.v7.widget.Toolbar>
</RelativeLayout>
And for style, i am using AppTheme
<resources>
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">#000000</item>
<item name="colorPrimaryDark">#000000</item>
<item name="colorAccent">#color/colorAccent</item>
<item name="android:titleTextStyle">#style/NoTitleText</item>
</style>
<style name="NoTitleText">
<item name="android:textSize">0sp</item>
<item name="android:textColor">#00000000</item>
</style>
</resources>
What can i do to remove this error
You have given titles two times either you want to remove upper one remove TextView which is inside Toolbar and setTitle of toolbar.
otherwise remove title from the Toolbar
You can remove title with help of
getSupportActionBar().setDisplayShowTitleEnabled(false);
How I can force menu item to show under overflow icon. I am providing app support from api level 8 and above. for now it is showing as actionview .
My menuLayout is as follows.
//main.xml
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto" >
<item
android:id="#+id/action_menu_setting"
android:title="#string/menuItemSetting"
app:showAsAction="ifRoom"/>
<item
android:id="#+id/action_signout"
android:title="#string/menuItemLogout"
app:showAsAction="ifRoom"/>
</menu>
in Java class
#Override
public boolean onCreateOptionsMenu(Menu menu) {
MenuInflater inflater = getMenuInflater();
inflater.inflate(R.menu.main, menu);
return super.onCreateOptionsMenu(menu);
}
I have tried with other options of showAsAction but none of them worked. Please suggest me how I can show above two menu itme under overflow icon(when i click on over these two will appearer as actionlist.)
layout for custom action bar
<?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="?android:attr/actionBarSize"
android:background="#drawable/header"
android:orientation="vertical" >
<TextView
android:id="#+id/tvActionBarTitle"
android:layout_width="match_parent"
android:layout_height="?android:attr/actionBarSize"
android:gravity="center"
android:textColor="#FFFFFF"
android:textSize="30sp" />
<Button.../>
<!-- your code for button -->
</LinearLayout>
You can call below function in onCreate and define button in this function as I have defined appName text view and its OnClick event
private void createCutomActionBarTitle()
{
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.ICE_CREAM_SANDWICH)
{
this.getActionBar().setHomeButtonEnabled(true);
}
this.getActionBar().setDisplayShowCustomEnabled(true);
this.getActionBar().setDisplayShowTitleEnabled(false);
this.getActionBar().setBackgroundDrawable(drawable);
this.getActionBar().setIcon(logo);
LayoutInflater inflator = LayoutInflater.from(this);
View v = inflator.inflate(R.layout.custom_action_bar, null);
((TextView) v.findViewById(R.id.tvActionBarTitle)).setText(Global.ACTIVITY_NAME);
this.getActionBar().setCustomView(v);
}
Hope this will be useful for you :)
But clicking physical button of device will not trigger this button you have to look for it, as I don't have any idea about it
Could you post java code ? Do you have code below in your activity ?
#Override
public boolean onCreateOptionsMenu(Menu menu) {
// TODO Auto-generated method stub
getMenuInflater().inflate(R.menu.menu, menu);;
return super.onCreateOptionsMenu(menu);
}
Edit :
I alway use code like this(when i click action_settings it will show action list contains setting and bar, i think just replace android:title="#string/action_settings" with android:icon)
<menu xmlns:android="http://schemas.android.com/apk/res/android" >
<item
android:id="#+id/action_settings"
android:orderInCategory="100"
android:showAsAction="always"
android:title="#string/action_settings">
<menu>
<item
android:enabled="true"
android:visible="true"
android:title="setting"
android:id="#+id/setting">
</item>
<item
android:enabled="true"
android:visible="true"
android:title="B"
android:id="#+id/bar">
</item>
</menu>
</item>
<item
android:id="#+id/action_settings1"
android:orderInCategory="100"
android:showAsAction="always"
android:title="#string/action_settings"/>
</menu>
Hope it helps