Here is what I am trying to implement: when people click on the menu on top right corner of a toolbar, an options menu appears on bottom of the screen. See picture below:
I am not sure what method should I call for the item at the bottom. Can somebody give me some hint on how to implement this?
I implement successfully the icon in the top right menu bar with the code below. But I don't know how to show the options at the bottom of the screen, with width match_parent, and height wrap_content
onClick on the right top corner
#Override
public boolean onCreateOptionsMenu(Menu menu) {
// Inflate the menu; this adds items to the action bar if it is present.
getMenuInflater().inflate(R.menu.edit_profile_image_menu, menu);
return true;
}
#Override
public boolean onOptionsItemSelected(MenuItem item) {
int id = item.getItemId();
switch (id) {
case R.id.more:
//How to show the 2 option in the bottom of screen here
return true;
}
return super.onOptionsItemSelected(item);
}
Update
After implement the code of Nikesh, the popup shown like this:
UPDATED ANSWER
You can now use Material Design BottomAppBar
A bottom app bar displays navigation and key actions at the bottom of mobile screens
SAMPLE CODE
Add below dependencies in your build.gradle
implementation 'com.google.android.material:material:1.0.0'
Now create 3 menu file in res/menu directory
bottom_menu.xml
<?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"
xmlns:tools="http://schemas.android.com/tools">
<item
android:id="#+id/app_bar_search"
android:icon="#drawable/ic_search"
android:title="Search"
app:showAsAction="ifRoom" />
<item
android:id="#+id/app_bar_fav"
android:icon="#drawable/ic_favorite"
android:title="Favorite"
app:showAsAction="ifRoom"/>
<item
android:icon="#drawable/ic_favorite"
android:title="Favorite"
app:showAsAction=""/>
</menu>
nav_drawer_menu.xml
<?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/navItemOne"
android:title="Nav Item 1"
app:showAsAction="never"/>
<item
android:id="#+id/navItemTwo"
android:title="Nav Item 2"
app:showAsAction="never"/>
<item
android:id="#+id/navItemThree"
android:title="Nav Item 3"
app:showAsAction="never"/>
</menu>
toolbar_menu.xml
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:id="#+id/app_bar_fav"
android:icon="#drawable/ic_favorite"
android:title="Favorite"
app:showAsAction="ifRoom"/>
<item
android:id="#+id/app_bar_search"
android:icon="#drawable/ic_search"
android:title="Search"
app:showAsAction="ifRoom"/>
<item
android:id="#+id/app_bar_settings"
android:title="Settings"
app:showAsAction="never"/>
<item
android:title="Menu Item 1"
app:showAsAction="never"/>
<item
android:title="Menu Item 2"
app:showAsAction="never"/>
<item
android:title="Menu Item 3"
app:showAsAction="never"/>
</menu>
Now Create a class name BottomNavigationDrawerFragment to open navigation drawer from bottom
import android.content.Context
import android.os.Bundle
import android.view.Gravity
import android.view.LayoutInflater
import android.view.View
import android.view.ViewGroup
import android.widget.Toast
import com.google.android.material.bottomsheet.BottomSheetDialogFragment
import kotlinx.android.synthetic.main.bottom_nav_layout.*
class BottomNavigationDrawerFragment : BottomSheetDialogFragment() {
override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?, savedInstanceState: Bundle?): View? {
return inflater.inflate(R.layout.bottom_nav_layout, container, false)
}
override fun onActivityCreated(savedInstanceState: Bundle?) {
super.onActivityCreated(savedInstanceState)
navigation_view.setNavigationItemSelectedListener { menuItem ->
// Bottom Navigation Drawer menu item clicks
when (menuItem!!.itemId) {
R.id.navItemOne -> context!!.toast(" Nav item one is Clicked ")
R.id.navItemTwo -> context!!.toast(" Nav item Two is Clicked ")
R.id.navItemThree -> context!!.toast(" Nav item Three is Clicked ")
}
// Add code here to update the UI based on the item selected
// For example, swap UI fragments here
true
}
}
// This is an extension method for easy Toast call
fun Context.toast(message: CharSequence) {
val toast = Toast.makeText(this, message, Toast.LENGTH_SHORT)
toast.setGravity(Gravity.BOTTOM, 0, 600)
toast.show()
}
}
Code of MainActivity
import android.os.Bundle
import android.view.Menu
import android.view.MenuItem
import android.widget.Toast
import androidx.appcompat.app.AppCompatActivity
import kotlinx.android.synthetic.main.activity_main.*
class MainActivity : AppCompatActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_main)
// attach menu to your BottomAppBar
bottomBar.replaceMenu(R.menu.bottom_menu)
// handle click event of navigationIcon
bottomBar.setNavigationOnClickListener {
toast("Navigation Icon Clicked")
val bottomNavDrawerFragment = BottomNavigationDrawerFragment()
bottomNavDrawerFragment.show(supportFragmentManager, bottomNavDrawerFragment.tag)
}
// handle click event of FloatingActionButton
fab.setOnClickListener {
toast("Fab Icon Clicked")
}
//handle click event of menu of BottomAppBar
bottomBar.setOnMenuItemClickListener { menuItem ->
when (menuItem!!.itemId) {
R.id.app_bar_search -> toast("Search menu of bottomBar is clicked!")
}
true
}
}
// Overriding Actionbar menu
override fun onCreateOptionsMenu(menu: Menu): Boolean {
val inflater = menuInflater
inflater.inflate(R.menu.toolbar_menu, menu)
return true
}
//handle click event of menu of Actionbar
override fun onOptionsItemSelected(item: MenuItem?): Boolean {
when (item!!.itemId) {
R.id.app_bar_fav -> toast("Fav menu item of toolbar is clicked!")
R.id.app_bar_search -> toast("Search menu item of toolbar is clicked!")
R.id.app_bar_settings -> toast("Settings item of toolbar is clicked!")
else -> toast("Menu item of toolbar is clicked!")
}
return true
}
// method to display toast
private fun toast(message: String) {
Toast.makeText(this, message, Toast.LENGTH_SHORT).show()
}
}
layout.activity_main
<?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"
android:id="#+id/main_content"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#ffffff"
android:fitsSystemWindows="true">
<com.google.android.material.bottomappbar.BottomAppBar
android:id="#+id/bottomBar"
style="#style/Widget.MaterialComponents.BottomAppBar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
app:fabCradleMargin="10dp"
app:fabCradleVerticalOffset="4dp"
android:backgroundTint="#color/colorPrimary"
app:fabAlignmentMode="center"
app:navigationIcon="#drawable/ic_drawer"/>
<com.google.android.material.floatingactionbutton.FloatingActionButton
android:id="#+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_anchor="#id/bottomBar"
app:srcCompat="#drawable/ic_apps" />
</androidx.coordinatorlayout.widget.CoordinatorLayout>
bottom_nav_layout.xml
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<com.google.android.material.navigation.NavigationView
android:id="#+id/navigation_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:layout_marginEnd="8dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:menu="#menu/nav_drawer_menu"/>
</androidx.constraintlayout.widget.ConstraintLayout>
SAMPLE CODE for JAVA Lover
BottomNavigationDrawerFragment
import android.content.Context;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.MenuItem;
import android.view.View;
import android.view.ViewGroup;
import android.widget.Toast;
import com.google.android.material.bottomsheet.BottomSheetDialogFragment;
import com.google.android.material.navigation.NavigationView;
import androidx.annotation.NonNull;
import androidx.annotation.Nullable;
import neel.com.bottomappbar.R;
public class BottomNavigationDrawerFragment extends BottomSheetDialogFragment {
private Context mContext;
#Override
public void onAttach(Context context) {
super.onAttach(context);
mContext=context;
}
#Nullable
#Override
public View onCreateView(#NonNull LayoutInflater inflater, #Nullable ViewGroup container, #Nullable Bundle savedInstanceState) {
View rootView= inflater.inflate(R.layout.bottom_nav_layout, container, false);
NavigationView navigationView=rootView.findViewById(R.id.navigation_view);
navigationView.setNavigationItemSelectedListener(new NavigationView.OnNavigationItemSelectedListener() {
#Override
public boolean onNavigationItemSelected(#NonNull MenuItem menuItem) {
switch (menuItem.getItemId()){
case R.id.navItemOne:
Toast.makeText(mContext, "Nav item One is Clicked ", Toast.LENGTH_SHORT).show();
return true;
case R.id.navItemTwo:
Toast.makeText(mContext, "Nav item Two is Clicked ", Toast.LENGTH_SHORT).show();
return true;
case R.id.navItemThree:
Toast.makeText(mContext, "Nav item Three is Clicked ", Toast.LENGTH_SHORT).show();
return true;
}
return false;
}
});
return rootView;
}
#Override
public void onActivityCreated(#Nullable Bundle savedInstanceState) {
super.onActivityCreated(savedInstanceState);
}
}
MainActivity
import android.os.Bundle;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.widget.Toast;
import com.google.android.material.bottomappbar.BottomAppBar;
import com.google.android.material.floatingactionbutton.FloatingActionButton;
import androidx.annotation.Nullable;
import androidx.appcompat.app.AppCompatActivity;
import androidx.appcompat.widget.Toolbar;
import neel.com.bottomappbar.R;
public class MainActivity extends AppCompatActivity {
BottomAppBar bottomAppBar;
FloatingActionButton floatingActionButton;
#Override
protected void onCreate(#Nullable Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
bottomAppBar = findViewById(R.id.bottomBar);
// attach menu to your BottomAppBar
bottomAppBar.replaceMenu(R.menu.bottom_menu);
// handle click event of navigationIcon of bottomAppBar
bottomAppBar.setNavigationOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View view) {
BottomNavigationDrawerFragment bottomNavigationDrawerFragment = new BottomNavigationDrawerFragment();
bottomNavigationDrawerFragment.show(getSupportFragmentManager(), bottomNavigationDrawerFragment.getTag());
}
});
//handle click event of menu of BottomAppBar
bottomAppBar.setOnMenuItemClickListener(new Toolbar.OnMenuItemClickListener() {
#Override
public boolean onMenuItemClick(MenuItem item) {
switch (item.getItemId()) {
case R.id.app_bar_search:
Toast.makeText(MainActivity.this, "Search menu of bottomBar is clicked!", Toast.LENGTH_SHORT).show();
return true;
case R.id.app_bar_fav:
Toast.makeText(MainActivity.this, "Favorite menu of bottomBar is clicked!", Toast.LENGTH_SHORT).show();
return true;
}
return false;
}
});
floatingActionButton.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View view) {
Toast.makeText(MainActivity.this, "Fab Is clicked ", Toast.LENGTH_SHORT).show();
}
});
}
// Overriding Actionbar menu
#Override
public boolean onCreateOptionsMenu(Menu menu) {
getMenuInflater().inflate(R.menu.toolbar_menu, menu);
return true;
}
//handle click event of menu of Actionbar
#Override
public boolean onOptionsItemSelected(MenuItem item) {
switch (item.getItemId()) {
case R.id.app_bar_fav:
Toast.makeText(MainActivity.this, "Fav menu item of toolbar is clicked!", Toast.LENGTH_SHORT).show();
return true;
case R.id.app_bar_search:
Toast.makeText(MainActivity.this, "Search menu item of toolbar is clicked!", Toast.LENGTH_SHORT).show();
return true;
case R.id.app_bar_settings:
Toast.makeText(MainActivity.this, "app_bar_settings", Toast.LENGTH_SHORT).show();
return true;
}
return false;
}
}
for more information please check below articles
Bottom App Bar. How to start
Implementing Google’s newly launched Bottom AppBar
Implementing BottomAppBar I: Material Components for Android
Bottom App Bars
OUTPUT
https://www.youtube.com/watch?v=k145bGLrleo
OLD ANSWER
try this attach this PopupMenu in your bottom view click event something like button click event
step 1
create a view at bootom of your layout like this
<View
android:layout_gravity="center"
android:id="#+id/myView"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
step 2 create a new_menu.xml file like this
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<item
android:id="#+id/temp"
android:title="#string/str_menu_account_logout"
android:icon="#drawable/next"
app:showAsAction="ifRoom"></item>
</menu>
now add this code to create option menu in your java file
#Override
public boolean onCreateOptionsMenu(Menu menu) {
// Inflate the menu; this adds items to the action bar if it is present.
getMenuInflater().inflate(R.menu.new_menu, menu);
return true;
}
#Override
public boolean onOptionsItemSelected(MenuItem item) {
if (item.getItemId() == R.id.temp) {
PopupMenu popupMenu = new PopupMenu(this, findViewById(R.id.myView),Gravity.CENTER);
popupMenu.inflate(R.menu.home_menu);
popupMenu.show();
return true;
}
return false;
}
I will suggest to use the Material design App Bar(Bottom), with few modifications you can get the result.
Try this https://material.io/design/components/app-bars-bottom.html
hope this will help.
Simple.
Make a dialog with its own contents which will makeup the bottom menu.
When user clicks there above then the dialog should show but its position would be below i.e. anchored with the bottom. You can find many codes regarding how to position dialog at the bottom of the scree anchored!! SO not adding any.Hope it helps.!
Answer by #Nilesh is very elaborate and bit complicated.
Simple Solution
Create FrameLayout and arrange your buttons inside frame layout depending on your requirements. Set id -- I use id = "menu"
Set visibility to gone android:visibility = "gone"
On menubutton click
findViewById(R.id.menu).setVisibility(View.VISIBLE);
Now to make menu disappear when you click outside the menu, add an empty view or layout behind the menu. set ontouch listner. Set visibility GONE when the background view is touched.
there is no need to reinvent the wheel; use a BottomNavigationView, which is being provided by:
dependencies {
api "com.google.android.material:material:1.0.0"
}
it can be added into the layout alike this (set gone by default):
<android.support.design.widget.BottomNavigationView
android:id="#+id/navigation"
android:layout_width="match_parent"
android:layout_height="56dp"
android:layout_gravity="start"
android:visiblity="gone"
app:menu="#menu/bottom" />
the menu/bottom.xml:
<menu
xmlns:android="http://schemas.android.com/apk/res/android">
<item android:id="#+id/action_search"
android:title="#string/menu_search"
android:icon="#drawable/ic_search" />
<item android:id="#+id/action_settings"
android:title="#string/menu_settings"
android:icon="#drawable/ic_add" />
</menu>
then hook into the onMenuOpened() event:
#Override
public boolean onMenuOpened(int featureId, Menu menu) {
this.mBottomNavigationView.setVisibility(View.VISIBLE);
return super.onMenuOpened(featureId, menu);
}
and also implement method onOptionsItemSelected():
#Override
public boolean onOptionsItemSelected(MenuItem item) {
switch (item.getItemId()) {
case R.id.action_search:
...
this.hideBottomNavigation();
return true;
case R.id.action_settings:
...
this.hideBottomNavigation();
return true;
default:
this.hideBottomNavigation();
return super.onOptionsItemSelected(item);
}
}
private void hideBottomNavigation() {
this.mBottomNavigationView.setVisibility(View.GONE);
}
BottomSheetDialogFragment would indeed be the other option available, while it does not support inflating a menu, but a fragment ...nevertheless it would merely be the same approach.
You can now use Material Design BottomAppBar
1st add this in build.gradle where all are being implemented
implementation 'com.google.android.material:material:1.0.0'
create menu
anyname.xml
2nd add coordinator layout and inside it bottomAppBaradd menu and navigation as given here
3rd Add code by initialising
private var mBottomAppBar: BottomAppBar ?= null
Then add them into the method
//bottom bar
mBottomAppBar = findViewById(R.id.bar)
mBottomAppBar?.setOnMenuItemClickListener{
when(it.itemId){
R.id.itemConfig->showConfigBottomSheetDialogFragment()
}
true
}
mBottomAppBar?.setNavigationOnClickListener{
startContentHighlightActivity()
}
}
The navigation will directly work and the menu will work according to the items you will add.
//This is click event of button
#Override
public void onClick(View view) {
switch (view.getId()){
case R.id.buttonSort:
PopupMenu popupMenu = new PopupMenu(this, findViewById(R.id.myView),Gravity.CENTER);
popupMenu.inflate(R.menu.bottom_menu);
popupMenu.show();
break;
}
This is my home_menu.xml:
<?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/bottom_menu_price"
android:title="Price low to high"
android:icon="#drawable/ic_price_low"
/>
<item
android:id="#+id/bottom_menu_price_high"
android:title="Price high to low"
android:icon="#drawable/ic_price_high"
/>
<item
android:id="#+id/bottom_menu_date"
android:title="New Added"
android:icon="#drawable/ic_date_sort"
/>
<item
android:id="#+id/bottom_menu_rate"
android:title="Best Rated"
android:icon="#drawable/ic_rate_sort"
/>
Related
I am trying to access navigation drawer so that when i click on the top left corner of app bar, I can access settings in a new activity. Right now what I get when I click on the upper left corner and then click settings is the menu retracts and nothing else happens. I have a bottom navigation bar also. Please help. Here's what I have so far:
NavigationActivity.java
package com.tt.lateoclock;
import android.content.Intent;
import android.os.Bundle;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.widget.TextView;
import android.widget.Toast;
import androidx.appcompat.widget.Toolbar;
import com.google.android.material.bottomnavigation.BottomNavigationView;
import com.google.android.material.navigation.NavigationView;
import com.google.firebase.database.DatabaseReference;
import com.tt.lateoclock.Prevalent.Prevalent;
import com.tt.lateoclock.ui.findFood.FindFoodFragment;
import androidx.annotation.NonNull;
import androidx.appcompat.app.ActionBarDrawerToggle;
import androidx.appcompat.app.AppCompatActivity;
import androidx.core.content.ContextCompat;
import androidx.core.view.GravityCompat;
import androidx.drawerlayout.widget.DrawerLayout;
import androidx.navigation.NavController;
import androidx.navigation.Navigation;
import androidx.navigation.ui.AppBarConfiguration;
import androidx.navigation.ui.NavigationUI;
import androidx.recyclerview.widget.RecyclerView;
import de.hdodenhof.circleimageview.CircleImageView;
public class NavigationActivity extends AppCompatActivity implements NavigationView.OnNavigationItemSelectedListener, BottomNavigationView.OnNavigationItemSelectedListener {
DrawerLayout drawer;
NavigationView navigationView;
Menu menu;
private DatabaseReference merchantRef;
RecyclerView recyclerView;
RecyclerView.LayoutManager layoutManager;
ActionBarDrawerToggle toggle;
Intent settingsIntent;
NavController navController;
AppBarConfiguration appBarConfiguration;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_navigation);
//merchantRef = FirebaseDatabase.getInstance().getReference().child("Merchants");
Toolbar toolbar = (Toolbar)findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
toolbar.setTitle("Home");
drawer = findViewById(R.id.container);
toggle = new ActionBarDrawerToggle(this, drawer, toolbar, R.string.navigation_drawer_open, R.string.navigation_drawer_close);
drawer.addDrawerListener(toggle);
toggle.syncState();
navigationView = findViewById(R.id.nav_view);
BottomNavigationView navView = findViewById(R.id.bot_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_find_food, R.id.navigation_favorites, R.id.navigation_map, R.id.navigation_receipts, R.id.navigation_settings)
.build();
navController = Navigation.findNavController(this, R.id.nav_host_fragment);
NavigationUI.setupActionBarWithNavController(this, navController, appBarConfiguration);
NavigationUI.setupWithNavController(navView, navController);
View headerView = navigationView.getHeaderView(0);
TextView name = (TextView)headerView.findViewById(R.id.username);
CircleImageView user_image = (CircleImageView)headerView.findViewById(R.id.user_image);
navigationView.setNavigationItemSelectedListener(new NavigationView.OnNavigationItemSelectedListener() {
#Override
public boolean onNavigationItemSelected(#NonNull MenuItem menuItem) {
int id=menuItem.getItemId();
Toast.makeText(getApplicationContext(), id, Toast.LENGTH_SHORT).show();
//it's possible to do more actions on several items, if there is a large amount of items I prefer switch(){case} instead of if()
if (id==R.id.navigation_settings){
Toast.makeText(getApplicationContext(), "Settings", Toast.LENGTH_SHORT).show();
}
//This is for maintaining the behavior of the Navigation view
NavigationUI.onNavDestinationSelected(menuItem, navController);
//This is for closing the drawer after acting on it
drawer.closeDrawer(GravityCompat.START);
return true;
}
});
name.setText(Prevalent.currentUser.getName());
navigationView.setNavigationItemSelectedListener(this);
}
#Override
public boolean onSupportNavigateUp() {
NavController navController=Navigation.findNavController(this, R.id.nav_host_fragment);
return NavigationUI.navigateUp(navController, appBarConfiguration)
|| super.onSupportNavigateUp();
}
#Override
public void onBackPressed()
{
if(drawer.isDrawerOpen(GravityCompat.START))
{
drawer.closeDrawer(GravityCompat.START);
}
else{
super.onBackPressed();
}
}
#Override
public boolean onOptionsItemSelected(MenuItem item) {
// Handle item selection
switch (item.getItemId()) {
case R.id.navigation_settings:
settingsIntent = new Intent(this, SettingsActivity.class);
startActivity(settingsIntent);
default:
return super.onOptionsItemSelected(item);
}
}
#Override
public boolean onNavigationItemSelected(#NonNull MenuItem item) {
switch (item.getItemId()) {
case R.id.navigation_find_food:
getSupportFragmentManager().beginTransaction().replace(R.id.nav_host_fragment, new FindFoodFragment()).commit();
break;
case R.id.navigation_favorites:
getSupportFragmentManager().beginTransaction().replace(R.id.nav_host_fragment, new com.tt.lateoclock.ui.favorites.FavoritesFragment()).commit();
break;
case R.id.navigation_receipts:
getSupportFragmentManager().beginTransaction().replace(R.id.nav_host_fragment, new com.tt.lateoclock.ui.receipts.ReceiptsFragment()).commit();
break;
case R.id.navigation_settings:
Toast.makeText(this, "Settings selected", Toast.LENGTH_SHORT).show();
Intent settingsIntent = new Intent(this, SettingsActivity.class);
startActivity(settingsIntent);
Toast.makeText(this, "Settings selected", Toast.LENGTH_SHORT).show();
return true;
}
return true;
}
}
activity_navigation.xml
<?xml version="1.0" encoding="utf-8"?>
<androidx.drawerlayout.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/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".NavigationActivity">
<com.google.android.material.navigation.NavigationView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"
android:id="#+id/nav_view"
app:headerLayout="#layout/nav_header"
app:menu="#menu/drawer_menu"/>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<fragment
android:id="#+id/nav_host_fragment"
android:name="androidx.navigation.fragment.NavHostFragment"
android:layout_marginTop="?android:attr/actionBarSize"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:defaultNavHost="true"
app:navGraph="#navigation/mobile_navigation" />
<androidx.appcompat.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#color/colorPrimaryDark"
android:elevation="4dp"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"
/>
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="#+id/bot_nav_view"
android:layout_width="match_parent"
android:layout_height="196dp"
android:layout_below="#id/nav_host_fragment"
android:layout_marginTop="-100dp"
android:layout_gravity="bottom"
android:background="?android:attr/windowBackground"
app:menu="#menu/bottom_nav_menu" >
</com.google.android.material.bottomnavigation.BottomNavigationView>
</RelativeLayout>
</androidx.drawerlayout.widget.DrawerLayout>
bottom_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_find_food"
android:icon="#drawable/ic_local_dining_black_24dp"
android:title="#string/title_find_food" />
<item
android:id="#+id/navigation_favorites"
android:icon="#drawable/ic_favorite_black_24dp"
android:title="#string/title_favorites" />
<item
android:id="#+id/navigation_map"
android:icon="#drawable/ic_map_black_24dp"
android:title="#string/title_map" />
<item
android:id="#+id/navigation_receipts"
android:icon="#drawable/ic_receipt_black_24dp"
android:title="#string/title_receipts" />
</menu>
drawer_menu.xml
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
<item android:id="#+id/nav_message"
android:title="Message"
android:icon="#drawable/ic_message"/>
<item android:id="#+id/nav_profile"
android:title="Profile"
android:icon="#drawable/ic_profile"/>
<item android:id="#+id/navigation_settings"
android:title="Settings"
android:icon="#drawable/ic_settings_black_24dp"
android:enabled="true"/>
</menu>
mobile_navigation.xml
<?xml version="1.0" encoding="utf-8"?>
<navigation 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/mobile_navigation"
app:startDestination="#+id/navigation_find_food">
<fragment
android:id="#+id/navigation_find_food"
android:name="com.tt.lateoclock.ui.findFood.FindFoodFragment"
android:label="#string/title_find_food"
tools:layout="#layout/fragment_find_food" />
<fragment
android:id="#+id/navigation_favorites"
android:name="com.tt.lateoclock.ui.favorites.FavoritesFragment"
android:label="#string/title_favorites"
tools:layout="#layout/fragment_favorites" />
<fragment
android:id="#+id/navigation_map"
android:name="com.tt.lateoclock.ui.map.MapFragment"
android:label="#string/title_map"
tools:layout="#layout/fragment_map" />
<fragment
android:id="#+id/navigation_receipts"
android:name="com.tt.lateoclock.ui.receipts.ReceiptsFragment"
android:label="#string/title_receipts"
tools:layout="#layout/fragment_receipts" />
</navigation>
Just change the activity_navigation.xml to
<?xml version="1.0" encoding="utf-8"?>
<androidx.drawerlayout.widget.DrawerLayout
...>
<RelativeLayout...>
<com.google.android.material.navigation.NavigationView
android:layout_gravity="start"
.../>
</androidx.drawerlayout.widget.DrawerLayout>
Also you have to handle the click on the settings item with navigationView.setNavigationItemSelectedListener.
About the DrawerLayout check the doc:
Note: When using NavigationUI, the top app bar helpers automatically transition between the drawer icon and the Up icon as the current destination changes. You don't need to use ActionBarDrawerToggle.
In your code remove the code about the ActionBarDrawerToggle and use:
AppBarConfiguration appBarConfiguration =
new AppBarConfiguration.Builder(...........)
.setDrawerLayout(drawerLayout)
.build();
You can add an <activity> destination to your navigation graph for starting another activity:
<activity
android:id="#+id/navigation_settings"
android:name="com.your.package.SettingsActivity" />
Then, the default behavior of setupWithNavController() / onNavDestinationSelected() will start your activity for you. You wouldn't need to write any custom code or manual calls to setNavigationItemSelectedListener to get this behavior.
You should also strongly consider adding menuCategory="secondary" to your navigation_settings menu item as per the onNavDestinationSelected() documentation to avoid your current destination from being popped off the back stack.
Here your Setting activity is not a part of the NavigationGraph (i.e. not a fragment it's a separate activity).
And when you hit the drawer burger and choose the Setting, it won't go to the Setting as you didn't launch the intent on the OnNavigationItemSelectedListener of the NavigationView
To fix that:
navigationView.setNavigationItemSelectedListener(new NavigationView.OnNavigationItemSelectedListener() {
#Override
public boolean onNavigationItemSelected(#NonNull MenuItem menuItem) {
int id=menuItem.getItemId();
Toast.makeText(getApplicationContext(), id, Toast.LENGTH_SHORT).show();
//it's possible to do more actions on several items, if there is a large amount of items I prefer switch(){case} instead of if()
if (id==R.id.navigation_settings){
Toast.makeText(getApplicationContext(), "Settings", Toast.LENGTH_SHORT).show();
Intent settingsIntent = new Intent(NavigationActivity.this, SettingsActivity.class); // <<< Here is the change
startActivity(settingsIntent); // <<< Here is the change
}
//This is for maintaining the behavior of the Navigation view
NavigationUI.onNavDestinationSelected(menuItem, navController);
//This is for closing the drawer after acting on it
drawer.closeDrawer(GravityCompat.START);
return true;
}
});
Update
Replace
navigationView.setNavigationItemSelectedListener(this);
With
navView.setNavigationItemSelectedListener(this);
Add the OnClick method in the menu item
<item
android:id="#+id/nav_whats_app"
android:icon="#drawable/ic_menu_settings"
android:title="#string/menu_settings"
android:onClick="onOpenSettings" />
Then add the method in the activity like this
//Kotlin Android
fun onOpenSettings(item: MenuItem) {
//... open settings here
}
Java Code
//Java Android
void onOpenSettings(MenuItem item) {
//... open settings here
}
To close any Navigation drawer, just call
val drawerLayout: DrawerLayout = findViewById(R.id.drawer_layout)
if (drawerLayout.isDrawerOpen(GravityCompat.START)) {
drawerLayout.closeDrawer(GravityCompat.START)
}
I'm trying to make a menu with two items, "Exit" and "Settings", where the "Exit" item is located on the actionbar, while the "Settings" item is located in the overflow menu.
However when I click on the menu icon, the overflow menu overlaps the "Exit" item. Is there anyway I can prevent this behaviour?
This is what's currently happening
This is what I'm trying to achive
Menue.XML
<menu xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:android="http://schemas.android.com/apk/res/android">
<group android:checkableBehavior="single">
<item android:title="#string/setting"
android:id="#+id/setting"
android:orderInCategory="2"
app:showAsAction="never"
/>
<item android:title="#string/exit"
android:id="#+id/exit"
android:orderInCategory="1"
app:showAsAction="withText|ifRoom"
android:icon="#drawable/exit"
/>
</group>
</menu>
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="com.example.meunueexample.MainActivity">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Hello World!"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</RelativeLayout>
Main_Activity.Java
package com.example.meunueexample;
import android.app.*;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.Menu;
import android.view.MenuItem;
public class MainActivity extends AppCompatActivity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
}
#Override
public boolean onCreateOptionsMenu(Menu menu) { // it wil inflate the menue in the action bar
getMenuInflater().inflate(R.menu.main, menu);
return true;
}
#Override
public boolean onOptionsItemSelected(MenuItem item) { // here we will get the selected item form group option
int id = item.getItemId(); // will get id of selected item these IDs are not user defined
if (id == R.id.setting) {
android.app.DialogFragment myfragment= new DialogFragment(); // made object of dialog fragment
myfragment.show(getFragmentManager() , "thedialog"); // thedialog is object created in DialogFragment class
return true;
} else if (id == R.id.exit) {
finish();
return true;
}
return super.onOptionsItemSelected(item);
}
}
Dialog_Fragment.Java
package com.example.meunueexample;
import android.app.AlertDialog;
import android.app.Dialog;
import android.content.DialogInterface;
import android.os.Bundle;
import android.widget.Toast;
/**
* Created by AQ on 9/10/2017.
*/
public class DialogFragment extends android.app.DialogFragment {
#Override
public Dialog onCreateDialog(Bundle savedInstanceState) { // override this method to ake dialog box
AlertDialog.Builder thedialog = new AlertDialog.Builder(getActivity()); // jiss activity ka oper is na show hona hy
thedialog.setTitle("Sample Dialog");
thedialog.setMessage("Hlw AQ");
thedialog.setPositiveButton("OK", new DialogInterface.OnClickListener() { // on click listener on button clicked
#Override
public void onClick(DialogInterface dialog, int which) {
Toast.makeText(getActivity(), "Clicked OK", Toast.LENGTH_SHORT).show();
}
}); // place semicolon there
thedialog.setNegativeButton("Cancel", new DialogInterface.OnClickListener() { // on click listener on button clicked
#Override
public void onClick(DialogInterface dialog, int which) {
Toast.makeText(getActivity(), "Clicked Cancel", Toast.LENGTH_SHORT).show();
}
}); // place semicolon there
return thedialog.create();
} // may change abndroid version from android manifest and from build.gradle
}
You can change this behaviour by creating a style with a vertical offset, like so:
<style name="OverflowMenu" parent="Widget.AppCompat.PopupMenu.Overflow">
<!-- Required for pre-Lollipop. -->
<item name="overlapAnchor">false</item>
<item name="android:dropDownVerticalOffset">-4.0dip</item>
<!-- Required for Lollipop. -->
<item name="android:overlapAnchor">false</item>
<item name="android:dropDownVerticalOffset">4.0dip</item>
</style>
You can then apply this style in your theme:
<item name="actionOverflowMenuStyle">#style/OverflowMenu</item>
I'm not really new to programming but a complete fresh noob regarding android and java.
I recently made the decision to programm an Android App using this tutorial.
I got till the actionbar and can even display some actions like search and settings in the overflow. What I cant manage to do is to let an action appear on the actionbar(with or without icon).
I managed to it once with this tutorial but I somehow cant repeat it on my actual "Tutorialapp".
Here is my code:
main.xml:
<?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"
xmlns:tools="http://schemas.android.com/tools"
tools:context="com.example.newapp.MainActivity" >
<item
android:id="#+id/action_settings"
android:orderInCategory="100"
android:title="#string/action_settings"
app:showAsAction="never"/>
<item
android:id="#+id/action_search"
android:orderInCategory="1"
android:icon="#drawable/ic_action_search"
android:title="#string/action_search"
android:showAsAction="always"/>
</menu>
MainActivity.java:
package com.example.newapp;
import android.support.v7.app.ActionBarActivity;
import android.content.Intent;
import android.os.Bundle;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.widget.EditText;
import android.widget.Toast;
public class MainActivity extends ActionBarActivity {
public final static String EXTRA_MESSAGE = "com.example.newapp.MESSAGE";
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
}
#Override
public boolean onCreateOptionsMenu(Menu menu) {
// Inflate the menu; this adds items to the action bar if it is present.
getMenuInflater().inflate(R.menu.main, menu);
return true;
}
#Override
public boolean onOptionsItemSelected(MenuItem item) {
int id = item.getItemId();
if (id == R.id.action_settings) {
return true;
}
switch (item.getItemId()) {
case R.id.action_search:
openSearch();
return true;
default:
return super.onOptionsItemSelected(item);
}
}
private void openSearch() {
Toast.makeText(this, "This is a Search Button", Toast.LENGTH_SHORT).show();
}
public void sendMessage (View view){
Intent intent = new Intent(this, DisplayMessageActivity.class);
EditText editText = (EditText) findViewById(R.id.edit_message);
String message = editText.getText().toString();
intent.putExtra(EXTRA_MESSAGE, message);
startActivity(intent);
}
}
try swapping the menu items:
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android" >
<item
android:id="#+id/action_search"
android:icon="#drawable/ic_action_search"
android:title="#string/action_search"
android:showAsAction="always"/>
<item
android:id="#+id/action_settings"
android:orderInCategory="101"
android:title="#string/action_settings"
app:showAsAction="never"/>
</menu>
I dont know why, but you need to specify in java code the action always. I had the same problem, and I solved it like that:
#Override
public boolean onCreateOptionsMenu(Menu menu) {
// Inflate the menu; this adds items to the action bar if it is present.
getMenuInflater().inflate(R.menu.main, menu);
menu.findItem(R.id.actionSearch).setShowAsAction(MenuItem.SHOW_AS_ACTION_ALWAYS);
return true;
}
Hope it solve your problem. :D!! Good Luck!
I just start with Android. Want to add action bar following the tutorial. I was added res/menu/main_activity_actions.xml:
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:NecoSeparator="http://schemas.android.com/apk/res-auto" >
<!-- Search, should appear as action button -->
<item android:id="#+id/action_search"
android:icon="#drawable/ic_action_search"
android:title="#string/action_search"
NecoSeparator:showAsAction="ifRoom" />
<!-- Settings, should always be in the overflow -->
<item android:id="#+id/action_settings"
android:title="#string/action_settings"
android:showAsAction="never" />
In MainActivity.java i do:
public boolean onCreateOptionsMenu(Menu menu) {
// Inflate the menu items for use in the action bar
MenuInflater inflater = getMenuInflater();
inflater.inflate(R.menu.main_activity_actions, menu);
return super.onCreateOptionsMenu(menu);
}
But Eclipse says that cant find : R.menu.main_activity_actions.
What's wrong with this code? I have to do something more with this xml file?
UPDATE
MainActivity.java
package com.example.necoseparator;
import android.os.Bundle;
import android.app.Activity;
import android.content.Intent;
import android.view.Menu;
import android.view.MenuInflater;
import android.view.MenuItem;
import android.view.View;
import android.widget.EditText;
public class MainActivity extends Activity {
public final static String EXTRA_MESSAGE = "com.example.myfirstapp.MESSAGE";
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
}
#Override
public boolean onCreateOptionsMenu(Menu menu) {
// Inflate the menu items for use in the action bar
MenuInflater inflater = getMenuInflater();
inflater.inflate(R.menu.main_activity_actions, menu);
return super.onCreateOptionsMenu(menu);
}
#Override
public boolean onOptionsItemSelected(MenuItem item) {
// Handle presses on the action bar items
switch (item.getItemId()) {
case R.id.action_search:
openSearch();
return true;
case R.id.action_settings:
openSettings();
return true;
default:
return super.onOptionsItemSelected(item);
}
}
public void sendMessage(View view) {
Intent intent = new Intent(this, DisplayMessageActivity.class);
EditText editText = (EditText) findViewById(R.id.edit_message);
String message = editText.getText().toString();
intent.putExtra(EXTRA_MESSAGE, message);
startActivity(intent);
}
}
I Think main problem is to saving your menu layout, if you have an error in file its might happened. please change your menu file with my code and save that and import R file (make sure that is not android.R and its must be YourPackageName.R) then clean your project and run.
<menu xmlns:android="http://schemas.android.com/apk/res/android" >
<item
android:id="#+id/action_settings"
android:orderInCategory="100"
android:showAsAction="never"
android:title="filtered"
/>
<item
android:id="#+id/menu_load"
android:icon="#drawable/ic_luncher"
android:orderInCategory="200"
android:showAsAction="always"
android:title="update"/>
</menu>
Remove this line xmlns:NecoSeparator="http://schemas.android.com/apk/res-auto and try again
<!-- Settings, should always be in the overflow -->
<item android:id="#+id/action_settings"
android:title="#string/action_settings"
android:showAsAction="never" />
</menu>
You can use Toolbar
toolbar = (Toolbar) findViewById(R.id.toolbar1);
setSupportActionBar(toolbar);
and add list of menus
I have been working on making my app change background color once the user clicks on Menu but I don't understand why it doesn't work. I don't have any warnings or errors!
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"
android:id="#+id/utilayout"
tools:context=".MainActivity"
>
<TextView
android:id="#+id/hello1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/hello_world" />
<ImageView
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/hello1"
android:layout_centerHorizontal="true"
android:layout_marginTop="80dp"
android:src="#drawable/ic_launcher" android:contentDescription="#string/hello_world"/>
My MainActivity.java:
package com.example.menu;
import android.os.Bundle;
import android.app.Activity;
import android.view.Menu;
import android.view.MenuItem;
import android.widget.RelativeLayout;
import android.widget.TextView;
public class MainActivity extends Activity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
}
#Override
public boolean onCreateOptionsMenu(Menu menu) {
// Inflate the menu; this adds items to the action bar if it is present.
getMenuInflater().inflate(R.menu.main, menu);
return true;
}
public boolean onOptionsItemsSelected(MenuItem item)
{
RelativeLayout bkgr = (RelativeLayout) findViewById(R.id.utilayout);
switch(item.getItemId())
{
case R.id.action_black:
bkgr.setBackgroundResource(R.color.black);
return true;
case R.id.action_red:
bkgr.setBackgroundResource(R.color.red);
return true;
case R.id.action_hello:
TextView tv = (TextView) findViewById(R.id.hello1);
tv.setText("What up people?");
return true;
default: return super.onOptionsItemSelected(item);
}
}
}
main.xml (in menu)
<menu xmlns:android="http://schemas.android.com/apk/res/android" >
<item
android:id="#+id/action_red"
android:orderInCategory="100"
android:showAsAction="never"
android:title="#string/action_red"/>
<item
android:id="#+id/action_black"
android:orderInCategory="200"
android:showAsAction="never"
android:title="#string/action_black"/>
<item
android:id="#+id/action_hello"
android:orderInCategory="300"
android:showAsAction="never"
android:title="#string/hello"/>
Replace this code with your existing one. and your app will run fine
MainActivity.java:
#Override
public boolean onOptionsItemSelected(MenuItem item) {
RelativeLayout bkgr = (RelativeLayout) findViewById(R.id.utilayout);
switch (item.getItemId()) {
case R.id.action_black:
bkgr.setBackgroundResource(R.color.black);
return true;
case R.id.action_red:
bkgr.setBackgroundResource(R.color.red);
return true;
case R.id.action_hello:
TextView tv = (TextView) findViewById(R.id.hello1);
tv.setText("What up people?");
return true;
}
return super.onOptionsItemSelected(item);
}
main.xml (in menu)
<item
android:id="#+id/action_red"
android:orderInCategory="100"
android:showAsAction="always"
android:title="red action"/>
<item
android:id="#+id/action_black"
android:orderInCategory="200"
android:showAsAction="always"
android:title="black action"/>
<item
android:id="#+id/action_hello"
android:orderInCategory="300"
android:showAsAction="always"
android:title="hello"/>
</menu>
Change 'return true' to 'break'
Edit:
switch(item.getItemId())
{
case R.id.action_black:
bkgr.setBackgroundResource(R.color.black);
break;
case R.id.action_red:
bkgr.setBackgroundResource(R.color.red);
break;
case R.id.action_hello:
TextView tv = (TextView) findViewById(R.id.hello1);
tv.setText("What up people?");
break;
default:
break;
return super.onOptionsItemSelected(item);
}