I'm trying to set the background of the listview inside the drawer layout to be transparent like google's camera app.
What happens is whenever I set the background of the listview to be transparent its items disappears
<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/activity_main_drawer_layout_container"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<ListView
android:id="#+id/activity_main_navigation_list"
android:layout_width="240dp"
android:layout_height="match_parent"
android:layout_gravity="start"
android:choiceMode="singleChoice"
android:background="#android:color/transparent"
android:divider="#android:color/transparent"
android:dividerHeight="0dp" />
</android.support.v4.widget.DrawerLayout>
I tried to set it to a transparent image it didn't work either it doesn't work with any transparency added to the color of it's background.
This works:
android:background="#232321"
This doesn't
android:background="#fb232321"
Any idea how can I fix this problem
Try using android:background="#color/transparent" on DrawerLayout view and not on the listView. Also, you can use background transparent on childView of your ListView
So the I solved my problem by wrapping the listview with a Relativelayout it works with other layouts as well.
<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/activity_main_drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#android:color/black">
<FrameLayout
android:id="#+id/activity_main_frame_container"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"
android:background="#android:color/transparent"
android:focusableInTouchMode="true">
<ListView
android:id="#+id/activity_main_navigation_list"
android:layout_width="240dp"
android:layout_height="match_parent"
android:choiceMode="singleChoice"
android:clickable="true"
android:divider="#android:color/transparent"
android:dividerHeight="1dp"
android:focusable="true" />
</RelativeLayout>
use #00000000 for black transparency
Related
I am using drawer layout and Listview is using as drawer.
My emulator just showing Listview as width set to match parent even it's set to 240dp.
<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/drawer Layout"
android:background="#000000">
<ListView
android:layout_width="240dp"
android:layout_height="match_parent"
android:id="#+id/drawerList"
android:background="#color/colorAccent"/>
<FrameLayout
android:layout_width="250dp"
android:layout_height="match_parent"
android:id="#+id/fragmentContainer"
android:background="#ffffff"
android:choiceMode="singleChoice"
android:dividerHeight="0dp"
android:divider="#android:color/transparent"/>
</android.support.v4.widget.DrawerLayout>
Drawer layouts are usually hidden outside of the screen until you open them. Try opening the drawer by swiping from the side.
You must use NavigationView inside DrawerLayout and limit width in NavigationView.
Example layout structure is like that , there is 2 different usage of NavigationView :
<?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/drawer"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true">
<!-- you can add extra views in DrawerLayout -->
<include layout="#layout/content_home"/>
<android.support.design.widget.NavigationView
android:id="#+id/navigation_view"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
android:layout_gravity="start"
app:menu="#menu/homepage_leftdrawer"/>
<!-- you can use listview, recyclerview etc in navigationview -->
<android.support.design.widget.NavigationView
android:id="#+id/navigation_view2"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:fitsSystemWindows="false"
app:headerLayout="#layout/homepage_right_header"
android:layout_gravity="end">
<ListView
android:id="#+id/list_slidermenu"
android:layout_width="240dp"
android:layout_height="match_parent"
android:layout_gravity="end"
android:choiceMode="singleChoice"
android:dividerHeight="1dp"
android:layout_marginTop="80dp" />
</android.support.design.widget.NavigationView>
</android.support.v4.widget.DrawerLayout>
I am new to android so I am trying to make a simple application. Everything is fine until I try to add a progress bar.
(Sorry for showing the images with a hyperlink as I don't have enough reputation to post images)
How it looks like:
screenshot here
What I wanted to have is something like:
draft layout here
main_activity before adding a progress bar:
<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">
<TextView
android:id="#+id/credit_label"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingLeft="24dp"
android:paddingTop="8dp"
android:paddingBottom="8dp"
android:text="#string/credit" >
</TextView>
<FrameLayout
android:id="#+id/content_frame"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<ListView
android:id="#+id/left_drawer"
android:layout_width="240dp"
android:layout_height="match_parent"
android:layout_gravity="start"
android:choiceMode="singleChoice"
android:divider="#android:color/transparent"
android:dividerHeight="0dp"/>
(The closing tag for DrawerLayout is at the end but I don't know why it is not showing up if I start a new line with it)
Then I want to add a progress bar under the textView which acts as a label. After I insert a ProgressBar element in main_activity.xml, a progress bar appeared in the middle of the screen but that's not what I exactly wanted.
Afterwards I tried to use a LinearLayout element to wrap up the TextView and ProgressBar, trying to arrange and display them accordingly, with the xml file shown below:
<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">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:id="#+id/credit_label"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingLeft="24dp"
android:paddingTop="8dp"
android:paddingBottom="8dp"
android:text="#string/credit" >
</TextView>
<ProgressBar
style="?android:attr/progressBarStyleHorizontal"
android:id="#+id/credit_progress"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingBottom="80dp" />
</LinearLayout>
<FrameLayout
android:id="#+id/content_frame"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<ListView
android:id="#+id/left_drawer"
android:layout_width="240dp"
android:layout_height="match_parent"
android:layout_gravity="start"
android:choiceMode="singleChoice"
android:divider="#android:color/transparent"
android:dividerHeight="0dp"/>
But the progress bar is not showing up, it turns out that only the TextView label is showing up. Upon interchanging the order of the TextView and ProgressBar elements, an error will occur stating that I am casting PorgressBar to TextView, but I don't know how this happenes with the following line of code:
TextView credit = (TextView) findViewById(R.id.credit_label);
I read another topic (here) in stackoverflow, stating that there can only be 3 elements in the drawerlayout, I tried to use the LinearLayout to wrap up all stuffs except the left_drawer list, so I tried the following version:
<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">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:id="#+id/credit_label"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingLeft="24dp"
android:paddingTop="8dp"
android:paddingBottom="8dp"
android:text="#string/credit" >
</TextView>
<ProgressBar
style="?android:attr/progressBarStyleHorizontal"
android:id="#+id/credit_progress"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingBottom="80dp" />
<FrameLayout
android:id="#+id/content_frame"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
<ListView
android:id="#+id/left_drawer"
android:layout_width="240dp"
android:layout_height="match_parent"
android:layout_gravity="start"
android:choiceMode="singleChoice"
android:divider="#android:color/transparent"
android:dividerHeight="0dp"/>
This time it didn't stop unop starting the application, but the FrameLayout consists of the fragment displaying the expandable list will shows nothing (white blank in that place). I am very frustrated and I don't know what the problems are, hence finally came here and hope to get some help. Thanks a lot!
I am trying to get a shadow effect at the end of my ListView which is placed inside a DrawerLayout. I have a png image for the shadow effect. I just want to know how to place it. I tried creating a view and placing this image as a background image, but the wholw layout gets the shadow. My xml file is below and please guide me step by step what to do.
<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">
<FrameLayout
android:id="#+id/content_frame"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<ListView
android:id="#+id/left_drawer"
android:layout_width="240dp"
android:visibility="visible"
android:layout_height="match_parent"
android:layout_gravity="start"
android:choiceMode="singleChoice"
android:divider="#android:color/transparent"
android:dividerHeight="0dp"
android:background="#android:color/black"/>
<View
android:id="#+id/vieworange"
android:layout_width="10dp"
android:layout_height="match_parent"
android:background="#drawable/menushade"
android:visibility="visible" />
You can add
list.addFooterView(footerView);
and insert shadow image in footer view for details link!
You just need to place that PNG shadow image as a background of your listview. i.e.
<ListView
android:id="#+id/listView1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/profile_background"
/>
I am using a progress bar inside drawer layout. When I start the app the progress bar is always aligned to top left corner of screen. I tried to set android:layout_gravity property but still It is shown in top left corner. Below is my xml layout file.
<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"
tools:context=".MainActivity">
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent" >
<ProgressBar
android:id="#+id/progressBar1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:visibility="gone"
style="?android:attr/progressBarStyleLarge" />
<ListView
android:id="#+id/mainListView"
android:layout_width="match_parent"
android:layout_height="match_parent"
/>
</FrameLayout>
<ListView android:id="#+id/left_drawer"
android:layout_width="240dp"
android:layout_height="match_parent"
android:layout_gravity="start"
android:dividerHeight="0dp"
android:background="#FFF"/>
</android.support.v4.widget.DrawerLayout>
use android:gravity="<whatever>" on the FrameLayout, since you only have the progressbar inside it.
Also, your drawer is going to be the listview because that's what has the layout_gravity="start" property set. If you want the progress bar to be within the left-drawer you can wrap the progress bar and listview into a container and set the layout_gravity="start" on that.
without further explanation, that's all i can aid with.
It's work for me. In FrameLayout set
android:layout_centerInParent="true"
Please try this code, This code is work for me.
ProgressBarView.xml
<?xml version="1.0" encoding="utf-8"?>
<ProgressBar xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/progressBar"
android:layout_gravity="center"
android:orientation="vertical">
</ProgressBar>
Now include this layout into NavigationView,
<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">
<include layout="#layout/progress_bar"/>
</android.support.design.widget.NavigationView>
Preview in Studio
I would like to have for example a LinearLayout or a RelativeLayout sliding from the left of the screen instead of a lone ListView.
I tried to use à LinearLayout with android:layout_gravity="start" and i had this error at runtime:
ClassCastException: android.widget.LinearLayout$LayoutParams cannot
be cast to android.support.v4.widget.DrawerLayout$LayoutParams
here's the layout file:
<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"
android:background="#android:color/white"
>
<FrameLayout
android:id="#+id/content_frame"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<LinearLayout
android:layout_width="320dp"
android:layout_height="match_parent"
android:layout_gravity="start"
android:orientation="vertical">
<ImageView
android:id="#+id/ivwLogo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/video_icon"
/>
<ListView
android:id="#+id/left_drawer"
android:layout_width="320dp"
android:layout_height="match_parent"
android:choiceMode="singleChoice"
android:divider="#android:color/transparent"
android:dividerHeight="0dp"
android:background="#android:color/white"
/>
</LinearLayout>
</android.support.v4.widget.DrawerLayout>
Thanks
This will work if you move both the android:id="#+id/left_drawer" (or create a new id) and set the gravity.
The id move (or new one) is so the reference is correct so you call closeDrawer() on it and not the child views.
But most importantly, the DrawerLayout requires that element to have a android:layout_gravity set on it, as you mentioned.
Finally, you need to call close closeDrawer() on the base view, the one with the required gravity.
Example:
<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"
android:background="#android:color/white">
<FrameLayout
android:id="#+id/content_frame"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<LinearLayout
android:id="#+id/left_drawer"
android:layout_width="320dp"
android:layout_height="match_parent"
android:layout_gravity="start"
android:orientation="vertical">
<ImageView
android:id="#+id/ivwLogo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/video_icon" />
<ListView
android:id="#+id/left_drawer_child"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:choiceMode="singleChoice"
android:divider="#android:color/transparent"
android:dividerHeight="0dp"
android:background="#android:color/white" />
</LinearLayout>
</android.support.v4.widget.DrawerLayout>
In code:
DrawerLayout mDrawer = (DrawerLayout) findViewById(R.id.drawer_layout)
LinearLayout mDrawerLinear = (LinearLayout) findViewById(R.id.left_drawer);
ListView mDrawerListChild = (ListView) findViewById(R.id.left_drawer_child);
...
mDrawer.closeDrawer(mDrawerLinear);
(This is basically what #Karakuri posted, but with a more complete explanation and example.)
Yes it is possible to have any view as the sliding part of a drawer layout. I prefer declaring a FrameLayout as the drawer and replacing it with my fragment, and it runs just fine.
The error you are getting is probably due to some other reason in the Java part of your implementation.
Make sure you pass correct object (your LinearLayout called mDrawerLinear) for methods like isDrawerOpen, closeDrawer etc. This line solved my ClassCastException:
boolean drawerOpen = mDrawerLayout.isDrawerOpen(mDrawerLinear);
Try moving android:id="#+id/left_drawer" to the LinearLayout instead of the ListView