How to use ExapandableListview inside navigation drawer like Snapdeal
What I want is this
Result so far is this
Try below XML code that works fine
<LinearLayout 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"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:orientation="vertical"
<include
layout="#layout/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<!-- This DrawerLayout has two children at the root -->
<android.support.v4.widget.DrawerLayout
android:id="#+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<!-- This LinearLayout represents the contents of the screen -->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<!-- The main content view where fragments are loaded -->
<FrameLayout
android:id="#+id/flContent"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</LinearLayout>
<!-- The navigation drawer that comes from the left -->
<!-- Note that `android:layout_gravity` needs to be set to 'start' -->
<ExpandableListView
android:id="#+id/lvExp"
android:layout_height="match_parent"
android:layout_width="match_parent"
android:layout_gravity="start"/>
</android.support.v4.widget.DrawerLayout>
</LinearLayout>
Related
I want to use the CoordinatorLayout in one of my activities.
The layout of the activity contains a Toolbar in the top, a RecyclerView in the middle, and a RelativeLayout at the bottom (the footer).
I would like to hide the Toolbar and the footer when the user swipes up the RecyclerView.
What I achieved so far:
When I swipe up, the Toolbar hides, but the footer (which was hidden before) reappears. I want the Toolbar and footer to be linked somehow, so that they hide at the same time when the user swipes.
I've heard about Behaviors but I don't know how to create them (I'm just using the default one).
My activity 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">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<android.support.design.widget.CoordinatorLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.AppBarLayout
android:id="#+id/app_bar"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<!-- toolbar -->
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:background="?attr/colorPrimary"
android:layout_width="match_parent"
....
app:layout_scrollFlags="scroll|enterAlways">
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content">
....
</RelativeLayout>
</android.support.v7.widget.Toolbar>
</android.support.design.widget.AppBarLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_above="#+id/footer"
android:layout_alignParentTop="true">
<!-- content -->
<android.support.v7.widget.RecyclerView
android:id="#+id/recyclerview"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scrollbars="vertical" />
</RelativeLayout>
<!-- footer -->
<RelativeLayout
android:id="#+id/footer"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true">
....
</RelativeLayout>
</RelativeLayout>
</android.support.design.widget.CoordinatorLayout>
</LinearLayout>
<!-- The navigation drawer -->
<ListView android:id="#+id/right_drawer"
android:layout_width="#dimen/drawer_width"
android:layout_height="match_parent"
android:layout_gravity="end"
android:divider="#android:color/transparent"
android:dividerHeight="1dp"
android:background="?attr/drawerBackgroundColor"/>
</android.support.v4.widget.DrawerLayout>
I am developing an Android app. In my app, I am using drawer layout as main layout. There is a Frame Layout inside drawer layout for main content. main content is replaced with Fragment when an item form drawer is clicked. Fragment can contain listview, scroll,gridview or whatever.
What I want is a floating action button fixed at the right bottom of the screen. That must be in the main layout(DrawerLayout) because it will contain for all fragment replaced. I added a floating action button to main layout. But I cannot see it when I run my app.
This is the main layout XML:
<?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"
android:id="#+id/main_drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<!-- This LinearLayout represents the contents of the screen -->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<!-- The ActionBar displayed at the top -->
<include
layout="#layout/action_bar"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<!-- The main content view where fragments are loaded -->
<FrameLayout
android:background="#color/whitesmoke"
android:id="#+id/main_content"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<android.support.design.widget.FloatingActionButton
android:layout_gravity="bottom|end"
android:id="#+id/fb_office_btn"
android:src="#android:drawable/ic_menu_edit"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
<!-- The navigation drawer that comes from the left -->
<!-- Note that `android:layout_gravity` needs to be set to 'start' -->
<android.support.design.widget.NavigationView
app:itemIconTint="#drawable/drawer_item"
app:itemTextColor="#drawable/drawer_item"
android:id="#+id/left_nv_view"
app:headerLayout="#layout/header_view"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start" />
</android.support.v4.widget.DrawerLayout>
This is the screenshot:
As you can see above, there is not floating action button. How can I fix it?
Edit
When I change LinearLayout to RelativeLayout, the gridview of main content are showing like below. Action bar is gone away.
Try to change your LinearLayout to RelativeLayout
<android.support.v4.widget.DrawerLayout
...
>
...
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<!-- The ActionBar displayed at the top -->
<include
android:id="#+id/actionBar" // Add this
layout="#layout/action_bar"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<!-- The main content view where fragments are loaded -->
<FrameLayout
android:background="#color/whitesmoke"
android:id="#+id/main_content"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#id/actionBar" // Add this
/>
<android.support.design.widget.FloatingActionButton
android:layout_alignParentRight="true" // Add this
android:layout_alignParentBottom="true" // Add this
android:id="#+id/fb_office_btn"
android:src="#android:drawable/ic_menu_edit"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</RelativeLayout>
...
</android.support.v4.widget.DrawerLayout>
OR you can follow the Android Studio design
activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout
android:id="#+id/drawer_layout"
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:fitsSystemWindows="true"
tools:openDrawer="start">
<include
layout="#layout/app_bar_main" // include 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>
app_bar_main.xml
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:context=".ui.activities.MainActivity">
<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_main"/>
<android.support.design.widget.FloatingActionButton
android:id="#+id/feedback_fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|end"
android:layout_margin="#dimen/fab_margin"
android:src="#drawable/ic_fab_feedback"/>
</android.support.design.widget.CoordinatorLayout>
Change the id of some component like your app.
Hope this help
I am creating a navigation drawer. the drawer is not closing while i select the list item in the navigation drawer. Here is my code
<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"
tools:context=".MainActivity">
<include
layout="#layout/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
<!-- This DrawerLayout has two children at the root -->
<android.support.v4.widget.DrawerLayout
android:id="#+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<!-- This LinearLayout represents the contents of the screen -->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<!-- The main content view where fragments are loaded -->
<FrameLayout
android:id="#+id/flContent"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</LinearLayout>
<ListView
android:id="#+id/listViewNavDrawer"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="start"
android:layout_weight="40"
android:background="#android:color/white"
android:choiceMode="singleChoice"
android:divider="#android:color/transparent"
android:dividerHeight="0dp"
tools:context=".NavigationDrawerFragment"/>
</android.support.v4.widget.DrawerLayout>
</LinearLayout>
what is the problem with that ? While using NavigationView instead of ListView there is no problem. But I need a ListView for my app. what should I do?
You need to call a method to close the active drawer, like DrawerLayout.closeDrawers().
I just want to put my navigation drawer on the top of my app, right after the navigation drawer my sliding menu should be displayed. So I figured out to do this with "android:layout_marginTop="xdp"/>". When I don't do this my nav drawer and the sliding tabs will overlap each other.
So my question is how can I do this dynamically with xml e.g. how can I get the height of the navdrawer to set the correct size for the marginTop?
Here is my xml-layout:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<com.starpedia.marvin.swc_pedia.FragmentNavigationDrawer
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
android:orientation="vertical">
<!-- The ActionBar -->
<include
layout="#layout/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<!-- The main content view -->
<FrameLayout
android:id="#+id/flContent"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</LinearLayout>
<!-- The navigation drawer -->
<ListView
android:id="#+id/lvDrawer"
android:layout_width="240dp"
android:layout_height="match_parent"
android:layout_gravity="start"
android:choiceMode="singleChoice"
android:paddingTop="24dp"
android:divider="#android:color/darker_gray"
android:dividerHeight="0dp"
android:background="#android:color/background_light" />
<com.starpedia.marvin.swc_pedia.SlidingTabLayout
android:id="#+id/sliding_tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"/>
</com.starpedia.marvin.swc_pedia.FragmentNavigationDrawer>
<android.support.v4.view.ViewPager
android:id="#+id/viewpager"
android:layout_width="match_parent"
android:layout_height="0px"
android:layout_weight="1"
android:background="#android:color/white"/>
</LinearLayout>
and a picture of the current screen displayed.
Thanks for your help in advance.
I am implementing Material Design into my app that has a navigation drawer. Amongst all the differing implementations of the Nav. Drawer and Toolbar with Material Design (see this post); I have chosen to keep the app feel similar to the ICS/Halo design and have the Nav Drawer slide out under the Toolbar. The problem is that the Toolbar dims with the shadow like the rest of the activity when the nav drawer is open. How would I keep the Toolbar from darkening? If you see the image in the post I linked above I am after #6, 3 or 5, but my looks more like #9 now.
Example (from post above):
What I'm after (no shadow on Toolbar):
What I currently get (Toolbar darkens when nav drawer is open):
Here is the code for my main activity's XML:
<android.support.v4.widget.DrawerLayout
xmlns:android="http://schemas.android.com/apk/res/android"
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:context="com.funkhaus.navdrawer.app.MainActivity">
<!-- As the main content view, the view below consumes the entire
space available using match_parent in both dimensions. -->
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<!-- We use a Toolbar so that our drawer can be displayed
in front of the action bar; Added for Material Design -->
<android.support.v7.widget.Toolbar
android:id="#+id/my_awesome_toolbar"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:minHeight="?attr/actionBarSize"
android:background="?attr/colorPrimary" />
<FrameLayout
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="?attr/actionBarSize" />
</FrameLayout>
<fragment android:id="#+id/navigation_drawer"
android:layout_width="#dimen/navigation_drawer_width"
android:layout_height="match_parent"
android:layout_marginTop="?attr/actionBarSize"
android:fitsSystemWindows="true"
android:layout_gravity="start"
android:name="com.funkhaus.brewwerks.NavigationDrawerFragment" />
The notable part being that the <FrameLayout> whose ID is 'container' is where all my fragments are inflated, and its marginTop was set to the height of the Toolbar so its content would be below the Toolbar. Similarly, the Navigation Drawer fragment also has its marginTop set to the height of the Toolbar so it slides out below it.
Thanks to #alanv I fixed my issue.
My post above shows my activity_main.xml code; I simplified it to this, removing the Toolbar view and removing the marginTop formatting:
<android.support.v4.widget.DrawerLayout
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:fitsSystemWindows="true"
tools:context="com.funkhaus.navdrawer.app.MainActivity">
<!-- As the main content view, the view below consumes the entire
space available using match_parent in both dimensions. -->
<FrameLayout
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<fragment android:id="#+id/navigation_drawer"
android:layout_width="#dimen/navigation_drawer_width"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
android:layout_gravity="start"
android:name="com.funkhaus.brewwerks.NavigationDrawerFragment" />
</android.support.v4.widget.DrawerLayout>
I created a toolbar.xml, which I now setContentView() on in my main Activity that <include>'s the activity_main.xml above:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="match_parent"
android:layout_width="match_parent"
android:orientation="vertical">
<!-- We use a Toolbar so that our drawer can be displayed
in front of the action bar; Added for Material Design -->
<android.support.v7.widget.Toolbar
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/my_awesome_toolbar"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:minHeight="?attr/actionBarSize"
android:background="?attr/colorPrimary" />
<include android:id="#+id/drawer_layout" layout="#layout/activity_main" />
</LinearLayout>
Finally, in my Activity's onCreate() I setContentView() on the toolbar.xml:
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.toolbar);
// Rest of code here....
You do it in the same xml like this, This is for underlying toolbar navigation like play store app design
<FrameLayout 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.ccas.roadsideconnect.BaseFragmentActivity">
<android.support.v4.widget.DrawerLayout
android:id="#+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<FrameLayout
android:id="#+id/main_fragment_container"
android:layout_marginTop="?attr/actionBarSize"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<FrameLayout android:id="#+id/navigation_drawer"
android:layout_width="#dimen/navigation_drawer_width"
android:layout_height="match_parent"
android:layout_gravity="start"
tools:layout="#layout/fragment_navigation_drawer" />
</android.support.v4.widget.DrawerLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#drawable/img_actionbar_white_sm"
android:gravity="top"
android:minHeight="58.0dip"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"
app:theme="#style/ThemeOverlay.AppCompat.ActionBar"
/>
</LinearLayout>
</FrameLayout>
The below code is for overlying toolbar navigation like Gmail APP design.
<FrameLayout 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.ccas.roadsideconnect.BaseFragmentActivity">
<android.support.v4.widget.DrawerLayout
android:id="#+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<FrameLayout
android:id="#+id/main_fragment_container"
android:layout_marginTop="?attr/actionBarSize"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#drawable/img_actionbar_white_sm"
android:gravity="top"
android:minHeight="58.0dip"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"
app:theme="#style/ThemeOverlay.AppCompat.ActionBar"
/>
</LinearLayout>
<FrameLayout android:id="#+id/navigation_drawer"
android:layout_width="#dimen/navigation_drawer_width"
android:layout_height="match_parent"
android:layout_gravity="start"
tools:layout="#layout/fragment_navigation_drawer" />
</android.support.v4.widget.DrawerLayout>
</FrameLayout>