Displaying grid-layout in Navigation Drawer Layout? - android

I am beginner to android. I want to display a home page with four buttons and Navigation Drawer menu. I used GridLayout to display the four buttons. I don't know where to place the GridLayout code in activity_main.xml. Whether I want to use LinearLayout or what to do? Please help me.
activity.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<android.support.v4.widget.DrawerLayout
android:id="#+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="200dp"
android:fitsSystemWindows="true"
tools:openDrawer="start">
<include
layout="#layout/app_bar_main"
android:layout_width="wrap_content"
android:layout_height="200dp" />
<android.support.design.widget.NavigationView
android:id="#+id/nav_view"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"
android:fitsSystemWindows="true"
app:headerLayout="#layout/nav_header_main"
app:menu="#menu/activity_main_drawer" />
<GridLayout
android:id="#+id/GridLayout2"
android:layout_marginTop="200dp"
android:layout_width="360dp"
android:layout_height="500dp"
android:columnCount="2"
android:rowCount="2"
android:orientation="horizontal">
<Button
android:id="#+id/orgnicshopbutton"
android:text="#string/orgnanicshops" />
<Button
android:id="#+id/newseedsbutton"
android:text="#string/new_seeds" />
<Button
android:id="#+id/tobenotedbutton"
android:text="#string/to_be_noted" />
<Button
android:id="#+id/contactbutton"
android:text="#string/contact" />
</GridLayout>
</android.support.v4.widget.DrawerLayout>
</LinearLayout>
I attached all buttons and GridLayout in MainAcitvity.java.
MainActivity.java
public class MainActivity extends AppCompatActivity
implements NavigationView.OnNavigationItemSelectedListener {
Button organicbtn,newseedsbtn,tobenotedbtn,contactsbtn;
DrawerLayout drawer;
ActionBarDrawerToggle toggle;
GridLayout gridLayout;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
organicbtn=(Button)findViewById(R.id.orgnicshopbutton);
newseedsbtn=(Button)findViewById(R.id.newseedsbutton);
tobenotedbtn=(Button)findViewById(R.id.tobenotedbutton);
contactsbtn=(Button)findViewById(R.id.contactbutton);
gridLayout=(GridLayout)findViewById(R.id.GridLayout2);
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
FloatingActionButton fab = (FloatingActionButton) findViewById(R.id.fab);
fab.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View view) {
Snackbar.make(view, "Replace with your own action", Snackbar.LENGTH_LONG)
.setAction("Action", null).show();
}
});
drawer = (DrawerLayout) findViewById(R.id.drawer_layout);
toggle = new ActionBarDrawerToggle(
this, drawer, toolbar, R.string.navigation_drawer_open, R.string.navigation_drawer_close);
drawer.setDrawerListener(toggle);
toggle.syncState();
NavigationView navigationView = (NavigationView) findViewById(R.id.nav_view);
navigationView.setNavigationItemSelectedListener(this);
}
DrawerLayout drawer = (DrawerLayout) findViewById(R.id.drawer_layout);
drawer.closeDrawer(GravityCompat.START);
return true;
}

Have a look at Creating a NavigationDrawer in the android documentation. The DrawerLayout should have two child views. The first one is used for the regular content of the screen - in here you should put your buttons. The second one is used for the navigation drawer.
In pseudo xml it would look something like so:
<DrawerLayout>
<!-- main content -->
<GridLayout>
<Button>
<Button>
...
</GridLayout>
<!-- this goes into the navigation drawer -->
<LinearLayout>
<Button> <!-- nav button -->
<Button> <!-- another nav button -->
</LinearLayout>
</DrawerLayout>

Related

Default Nagivatinal Drawer Layout of Android Studio

I am trying to figure out how to call the navigation layout of android studio to all the activities.
The Navigation Bar works absolutely fine with first activity. I am not sure how to call the same navigation layout to the second activity.
Code of my Second activity:
public class Screen2 extends Activity {
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.secondscreen);
}
}
Suppose this is the layout of you MainActivity
<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:fitsSystemWindows="true"
tools:openDrawer="start">
<include
layout="#layout/app_bar_main"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<android.support.design.widget.NavigationView
android:id="#+id/nav_view"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"
android:fitsSystemWindows="true"
app:headerLayout="#layout/nav_header_main"
app:menu="#menu/activity_main_drawer" />
</android.support.v4.widget.DrawerLayout>
Now you want same navigation drawer to other activity i.e Main2Activity add this to other activity
<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:fitsSystemWindows="true"
tools:openDrawer="start">
<include
layout="#layout/app_bar_main"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<android.support.design.widget.NavigationView
android:id="#+id/nav_view"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"
android:fitsSystemWindows="true"
app:headerLayout="#layout/nav_header_main"
app:menu="#menu/activity_main_drawer" />
</android.support.v4.widget.DrawerLayout>
And if your first item of navigation drawer points to mainActivity then in onCreate() of main activity use this
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
FloatingActionButton fab = (FloatingActionButton) findViewById(R.id.fab);
fab.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View view) {
Snackbar.make(view, "Replace with your own action", Snackbar.LENGTH_LONG)
.setAction("Action", null).show();
}
});
DrawerLayout drawer = (DrawerLayout) findViewById(R.id.drawer_layout);
ActionBarDrawerToggle toggle = new ActionBarDrawerToggle(
this, drawer, toolbar, R.string.navigation_drawer_open, R.string.navigation_drawer_close);
drawer.setDrawerListener(toggle);
toggle.syncState();
NavigationView navigationView = (NavigationView) findViewById(R.id.nav_view);
navigationView.setNavigationItemSelectedListener(this);
navigationView.getMenu().getItem(0).setChecked(true);
}
And in 2nd activity just call the same code with only difference in the item you want to be selected as
navigationView.getMenu().getItem(1).setChecked(true);///Change 1 as per your choice of child
Hope this helps you.
The best way to do this is to create a parent class for all the activities which require the navigation drawer.
All the activities will extend this class and you will have the navigation drawer in all the activities.
You can then inflate the main content layout with custom views inside the oncreate methods of the activities.
It is better to use fragments than different activities with drawer.

make a navigation drawer with right gravity

i'm trying to make an app with navigaton bar...
this is my activity 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:fitsSystemWindows="true"
android:layout_gravity="right"
tools:openDrawer="right">
<include
layout="#layout/app_bar_navigation"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<android.support.design.widget.NavigationView
android:id="#+id/nav_view"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="right"
android:fitsSystemWindows="true"
app:headerLayout="#layout/nav_header_navigation"
app:menu="#menu/activity_navigation_drawer" />
</android.support.v4.widget.DrawerLayout>
and this is coordinator layout witch contains toolbar:
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
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:background="?attr/colorPrimary"
app:popupTheme="#style/AppTheme.PopupOverlay" />
</android.support.design.widget.AppBarLayout>
<include layout="#layout/content_navigation" />
<android.support.design.widget.FloatingActionButton
android:id="#+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|start"
android:layout_margin="#dimen/fab_margin"
android:src="#android:drawable/ic_dialog_email" />
</android.support.design.widget.CoordinatorLayout>
navigation works fine but when clicking on ActionBarDrawerToggle this error comes up and app cashes:
java.lang.IllegalArgumentException: No drawer view found with gravity LEFT
and for action of toggle button :
DrawerLayout drawer = (DrawerLayout) findViewById(R.id.drawer_layout);
ActionBarDrawerToggle toggle = new ActionBarDrawerToggle(
this, drawer, toolbar, R.string.navigation_drawer_open, R.string.navigation_drawer_close);
drawer.setDrawerListener(toggle);
toggle.syncState();
and im getting this notification :
method invocation drawer.setDrawerListener(toggle) may produce java.lang.NullPointerExeption
According to documentation
To use a DrawerLayout, position your primary content view as the first
child with a width and height of match_parent. Add drawers as child
views after the main content view and set the layout_gravity
appropriately. Drawers commonly use match_parent for height with a
fixed width.
When you use include the following view
<include
layout="#layout/app_bar_navigation"
android:layout_width="match_parent"
android:layout_height="match_parent" />
You are actually including 2 views, which makes up a total of 3 views.
Enclose your layout within a LinearLayout to combine the 2 views inside into 1.
<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/AppTheme.AppBarOverlay">
<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>
<include layout="#layout/content_navigation" />
<android.support.design.widget.FloatingActionButton
android:id="#+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|start"
android:layout_margin="#dimen/fab_margin"
android:src="#android:drawable/ic_dialog_email" />
</android.support.design.widget.CoordinatorLayout>
</LinearLayout>
i made this changes to my code and it works good:
final DrawerLayout drawer = (DrawerLayout) findViewById(R.id.drawer_layout);
ActionBarDrawerToggle toggle = new ActionBarDrawerToggle(
this, drawer, toolbar, R.string.navigation_drawer_open, R.string.navigation_drawer_close){
#Override
public void onDrawerOpened(View drawerView) {
super.onDrawerOpened(drawerView);
}
#Override
public void onDrawerClosed(View drawerView) {
super.onDrawerClosed(drawerView);
}
};
drawer.setDrawerListener(toggle);
toggle.syncState();
toolbar.setNavigationOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
if (drawer.isDrawerOpen(GravityCompat.END)) {
drawer.closeDrawer(GravityCompat.END);
} else {
drawer.openDrawer(GravityCompat.END);
}
}
});
instead of this:
DrawerLayout drawer = (DrawerLayout) findViewById(R.id.drawer_layout);
ActionBarDrawerToggle toggle = new ActionBarDrawerToggle(
this, drawer, toolbar, R.string.navigation_drawer_open, R.string.navigation_drawer_close);
drawer.setDrawerListener(toggle);
toggle.syncState();

Action Bar (Toolbar) Icon

I have navigation drawer, in order to show it over Action bar, I made custom Toolbar View and set it as Action Bar. And now I have arrow icon which I can't change.
This is part of my Base Activity, I tried those methods, nothing changes:
protected void onCreateDrawer()
{
// R.id.drawer_layout should be in every activity with exactly the same id.
drawerLayout = (DrawerLayout) findViewById(R.id.drawer_layout);
Toolbar toolbar = (Toolbar) findViewById(R.id.tool_bar);
setSupportActionBar(toolbar);
drawerToggle = new ActionBarDrawerToggle((Activity) this, drawerLayout, R.drawable.ic_drawer, 0, 0)
{
public void onDrawerClosed(View view)
{
getSupportActionBar().setTitle(R.string.app_name);
}
public void onDrawerOpened(View drawerView)
{
getSupportActionBar().setTitle("Aaaaaaaaaaa");
}
};
drawerLayout.setDrawerListener(drawerToggle);
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
getSupportActionBar().setHomeButtonEnabled(true);
getSupportActionBar().setDisplayUseLogoEnabled(true);
getSupportActionBar().setLogo(R.drawable.ic_drawer);
getSupportActionBar().setDisplayShowTitleEnabled(true);
part of XML of MainActivity where I have Toolbar, and all content of Activity set in frame layout:
<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="false">
<!-- The main content view -->
<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/tool_bar"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:minHeight="?attr/actionBarSize"
android:background="?attr/colorPrimary" />
<FrameLayout
android:id="#+id/frame_container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="?attr/actionBarSize">
Navigation Drawer over Action bar works great, but, I can not change any of icon on Toolbar.
I set icon on toolbar before adding it like Action Bar and it works great, but no way that I can set title or something else with ActionBar/Toolbar.
Screenshot:
Use toolbar.setTitle("Aaaaaaaaa") instead of
getSupportActionBar().setTitle("Aaaaaaaa");
Try like this.
<android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/custom_actionbar"
style="#style/ToolBarStyle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/transparent"
android:minHeight="#dimen/abc_action_bar_default_height_material">
<TextView
android:id="#+id/toolbar_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:gravity="center"
android:textAllCaps="true"
android:textColor="#ffffff"
android:textSize="18sp"
android:textStyle="bold" />
</android.support.v7.widget.Toolbar>
In Base Activity set your title to textview
Toolbar mToolbar =(Toolbar) findViewById(R.id.metro_toolbar_actionbar);
TextView mTitle = (TextView) mToolbar.findViewById(R.id.toolbar_title);
setSupportActionBar(mToolbar);
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
getSupportActionBar().setDisplayShowTitleEnabled(false);
mTitle.setText("Your text");

Changing Text from header xml

I have an activity in which upon loading I want to update a textfield. That textfield is stored in a header for that activity's layout in an external XML file. When trying to set text pointed at that XML file, I get a nullpointer exception.
Here is the activity in which I am using:
public class NavDrawerMain extends AppCompatActivity
implements NavigationView.OnNavigationItemSelectedListener {
//JAC - need to add big search box right at the top of the drawer
//stuff for the user Timeline
private CustomAdapter timelineAdapter;
private ListView timelineList;
private PullToRefreshView mPullToRefreshView;
public static final int REFRESH_DELAY = 2000;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_nav_drawer_main);
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
FloatingActionButton fab = (FloatingActionButton) findViewById(R.id.fab);
fab.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View view) {
Snackbar.make(view, "Replace with your own action", Snackbar.LENGTH_LONG)
.setAction("Action", null).show();
}
});
DrawerLayout drawer = (DrawerLayout) findViewById(R.id.drawer_layout);
ActionBarDrawerToggle toggle = new ActionBarDrawerToggle(
this, drawer, toolbar, R.string.navigation_drawer_open, R.string.navigation_drawer_close);
drawer.setDrawerListener(toggle);
toggle.syncState();
NavigationView navigationView = (NavigationView) findViewById(R.id.nav_view);
navigationView.setNavigationItemSelectedListener(this);
TextView userName = (TextView) findViewById(R.id.drawerUserName);
userName.setText("test");
Here is the layout for that activity:
<RelativeLayout
android:layout_width="match_parent"
android:background="#e5e5e5"
android:layout_height="wrap_content">
<com.yalantis.phoenix.PullToRefreshView
android:id="#+id/pull_to_refresh"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ListView
android:id="#+id/timeListView"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:divider="#null"
android:dividerHeight="0dp"/>
</com.yalantis.phoenix.PullToRefreshView>
</RelativeLayout>
<include layout="#layout/app_bar_nav_drawer_main" android:layout_width="match_parent"
android:layout_height="match_parent" />
<android.support.design.widget.NavigationView android:id="#+id/nav_view"
android:layout_width="wrap_content" android:layout_height="match_parent"
android:layout_gravity="start" android:fitsSystemWindows="true"
app:headerLayout="#layout/nav_header_nav_drawer_main"
app:menu="#menu/activity_nav_drawer_main_drawer" />
and lastly here is the external xml file that houses the TextView that I want to change. This file is the header of the activity's xml file
<?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="#dimen/nav_header_height"
android:background="#drawable/side_nav_bar"
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
android:theme="#style/ThemeOverlay.AppCompat.Dark" android:orientation="vertical"
android:gravity="bottom">
android:id="+id/RelativeLayout1"
<ImageView android:layout_width="wrap_content" android:layout_height="wrap_content"
android:paddingTop="#dimen/nav_header_vertical_spacing"
android:src="#android:drawable/sym_def_app_icon" android:id="#+id/imageView" />
<TextView android:layout_width="match_parent" android:layout_height="wrap_content"
android:paddingTop="#dimen/nav_header_vertical_spacing" android:text="Android Studio"
android:textAppearance="#style/TextAppearance.AppCompat.Body1" />
<TextView android:layout_width="wrap_content" android:layout_height="wrap_content"
android:text="android.studio#android.com" android:id="#+id/drawerUserName" />
the textviews id is drawerUserName. I had read somewhere that I need to inflate the layout but haven't been able to figure it out.
In your activity inflate header_layout like this
View headerView = LayoutInflater.from(this).inflate(R.layout.header_layout, null);
TextView userName = (TextView) headerView.findViewById(R.id.drawerUserName);
userName.setText("test");
Now add it as a HeaderView to NavigationView
navigationView.addHeaderView(headerView);
And that should be it!
For smiliar question check;
NavigationView how to handle dynamic header content

Android Navigation Drawer - scrim color over menu

I have problem with scrim color overlaying not only main content but also the menu.
This is my layout:
<android.support.v4.widget.DrawerLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<!-- The main content view -->
<FrameLayout
android:id="#+id/content_frame"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<!-- The navigation drawer -->
<FrameLayout android:id="#+id/left_drawer"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="start"/>
</android.support.v4.widget.DrawerLayout>
Initialization code:
public class Launch extends SherlockFragmentActivity {
private ActionBarDrawerToggle mDrawerToggle;
private DrawerLayout mDrawerLayout;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_launch);
// menu fragment
ListFragment menu = new com.sayler.inz.Menu();
FragmentManager fm = getSupportFragmentManager();
fm.beginTransaction().replace(R.id.left_drawer, menu).commit();
mDrawerLayout = (DrawerLayout) findViewById(R.id.drawer_layout);
mDrawerLayout.setDrawerShadow(R.drawable.drawer_shadow,
GravityCompat.START);
mDrawerLayout.setScrimColor(Color.GREEN);
Screens:
With no scrim color and with green:
http://www.sarigato.com/android/no_color.png
http://www.sarigato.com/android/green.png
I think it's because your left_drawer has no background:
<!-- The navigation drawer -->
<FrameLayout android:id="#+id/left_drawer"
android:layout_width="match_parent"
android:background="#efefef"
android:layout_height="match_parent"
android:layout_gravity="start"/>

Categories

Resources