Develop Reference

Android: sliding drawer content overlapping the whole screen

I have an application that uses a sliding drawer. I had to make some changes, the sliding drawer content was a simple relative layout but I had to change it to include a fragment.
this is the slider layout before the changes:
<SlidingDrawer
android:id="#+id/drawer"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_alignParentTop="true"
android:orientation="horizontal"
android:handle="#+id/handle"
android:rotation="180"
android:content="#+id/content">
<ImageView
android:id="#id/handle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/handle"
android:rotation="180"
/>
<RelativeLayout
android:id="#id/content"
android:background="#drawable/border"
android:layout_width="140dip"
android:layout_height="fill_parent"
android:orientation="vertical"
android:rotation="180"
android:focusable="true"
android:focusableInTouchMode="true">
<EditText
android:drawableLeft="#android:drawable/ic_menu_search"
android:layout_width="fill_parent"
android:layout_height="50dp"
android:id="#+id/editInp"
android:layout_marginLeft="20dip"
android:imeOptions="actionDone"
android:layout_marginRight="20dip"
android:layout_marginTop="15dip"
android:hint=""
android:textColor="#color/themeapp"
android:background="#drawable/layout_corner_white"
android:singleLine="true"
android:inputType="textNoSuggestions"/>
<ImageView
android:id="#+id/clear_button"
android:layout_width="35dp"
android:layout_height="35dp"
android:layout_marginTop="23dip"
android:layout_alignRight="#id/editInp"
android:src="#android:drawable/ic_menu_close_clear_cancel"/>
<RelativeLayout
android:id="#+id/progress_conteiner"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_above="#+id/footer1"
android:layout_below="#+id/header1"
android:visibility="gone">
<ProgressBar
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
style="?android:attr/progressBarStyle"/>
</RelativeLayout>
<ExpandableListView
android:id="#+id/list"
android:layout_below="#+id/editInp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingTop="20dip"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true"
android:divider="#color/themeapp"
android:dividerHeight="1dp"
android:indicatorRight="300dp" />
</RelativeLayout>
</SlidingDrawer>
after the changes it looks like this:
<SlidingDrawer
android:id="#+id/drawer"
android:layout_width="140dp"
android:layout_height="fill_parent"
android:layout_alignParentTop="true"
android:orientation="horizontal"
android:handle="#id/handle"
android:rotation="180"
android:content="#id/content_frame">
<ImageView
android:id="#+id/handle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/handle"
android:rotation="180"
/>
<FrameLayout
android:id="#+id/content_frame"
android:layout_width="140dp"
android:layout_height="fill_parent" >
</FrameLayout>
</SlidingDrawer>
java code to inflate the fragment:
getActivity().getSupportFragmentManager().beginTransaction().add(R.id.content_frame, new FragmentFleetListMap(this)).commit();
the previous slider content, has been moved (unchanged) to a separate layout file to be used in the newly created fragment.
before, the slider worked weel, but now I see the fragment content overlapped to the activity content (see screeenshot below), is also not limited to the slider space but takes up the whole screen
as you can see in the screenshot the slider is open and it takes the correct portion on the screen (see the position of the handler [the little orange rectangle in the middle of the right side), so I think the problem is actually that the fragment content is not being positioned inside the slider
can anybody help me with this?

looks like this line:
getActivity().getSupportFragmentManager().beginTransaction().add(R.id.content_frame, new FragmentFleetListMap(this)).commit();
was "adding" my fragment containing the list over the mapfragment instead of the frameLayout. changing it to:
getChildFragmentManager().beginTransaction().add(R.id.content_frame, new FragmentFleetListMap(this)).commit();
solved the problem

Android ListView with CardView: Last Card not fully displayed when scrolling

I have created a ListView to which I've added CardView.
As you can see in the image, when I start scrolling, the last Card in the ListView is not completely displayed. It scrolls up but it does not come above Android's navigation bar at the bottom. I've been testing on a HTC One M8.
Here is the ListView:
<?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="fill_parent"
android:orientation="vertical">
<ListView
android:id="#+id/wanna_list"
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:divider="#null"/>
</LinearLayout>
And here is the CardView that I inflate and set into the adapter of the listview:
<?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="wrap_content" >
<android.support.v7.widget.CardView
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="200dp"
android:id="#+id/cv"
android:foreground="?android:attr/selectableItemBackground"
android:clickable="true"
card_view:cardCornerRadius="6dp"
card_view:cardUseCompatPadding="true"
card_view:cardElevation="2dp">
<!-- compat padding is required if using AppCompat -->
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="16dp" >
<ImageView
android:layout_width="100dp"
android:layout_height="100dp"
android:id="#+id/thumbnail"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_marginRight="16dp"
android:src="#drawable/india"
android:scaleType="centerCrop" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/firstLine"
android:layout_toRightOf="#+id/thumbnail"
android:layout_alignParentTop="false"
android:textSize="20sp"
android:text="Tennis with Peter"
android:layout_alignTop="#+id/thumbnail" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/secondLine"
android:layout_below="#+id/firstLine"
android:text="10 Oct at 7pm"
android:layout_alignLeft="#+id/firstLine" />
<Button
android:layout_width="180dp"
android:layout_height="wrap_content"
android:text="YES"
android:id="#+id/button3"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:layout_alignLeft="#+id/thumbnail" />
<Button
android:layout_width="60dp"
android:layout_height="wrap_content"
android:text="NO"
android:id="#+id/button4"
android:layout_toRightOf="#+id/button3"
android:layout_alignBottom="#+id/button3"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="false" />
</RelativeLayout>
</android.support.v7.widget.CardView>
</LinearLayout>
I have also tried my card view layout without wrapping it in a LinearLayout and it still does not work.
Is there a setting in the layout xml that will take care of this?
Thanks in advance.

android:layout_marginBotton=" "
add margin bottom should try once.

So adding a margin to the bottom of listView worked, as below:
<ListView
android:id="#+id/wanna_list"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:divider="#null"
android:layout_marginBottom="80dp" />
Am surprised this is the only way to get it to work though. I would have assumed the Android framework took care of these things.

Is the ListView in a Fragment ? As far as I know, this is possible when you have used a Toolbar such as :
<android.support.v7.widget.Toolbar
...
app:layout_scrollFlags="scroll"
...
>
</android.support.v7.widget.Toolbar>
then change the attribute to:
app:layout_scrollFlags="enterAlwaysCollapsed"
Adding margin at the bottom of ListView is sort of a hack. I have given a probable cause for this. If this is the case, then you won't need to add the margin in ListView. There is always a reason behind the UI behavior. I hope this helps.

Add header Image in navigation drawer on android studio sample navigation drawer

i need to add header image like this Post :
can I add an image header in navigation drawer layout
but, im using android studio sample navigation drawer for doing this.
it is good or bad for design this ?
and the better way or Compact way for doing this ?
any suggestion ?
thanks.

Can I add an Image Header in Navigation Drawer Layout?
Yes you can add with no problems.
If you use android studio navigation drawer or some thing else every thing are same. Some additional methods will be present and you need to check the methods required by you and delete other methods. You may also need to add few methods.
As per the latest android, best way of designing navigation drawer is by using recycler view and by using material design.
There are lot of materials in google for doing this, one of the finest tutorials I prefer is in the link given below you can have a look:
https://www.youtube.com/watch?v=zWpEh9k8i7Q&list=PLonJJ3BVjZW6CtAMbJz1XD8ELUs1KXaTD&index=6
Hope it helps.

In the menudrawer activity setcontentview(layout).Inside this layout
try to add an imageview.My sample xml is as folllows
<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">
<!-- As the main content view, the view below consumes the entire
space available using match_parent in both dimensions. -->
<FrameLayout
android:id="#+id/content_frame"
android:layout_width="match_parent"
android:background="#android:color/transparent"
android:layout_height="match_parent" />
<!-- android:layout_gravity="start" tells DrawerLayout to treat
this as a sliding drawer on the left side for left-to-right
languages and on the right side for right-to-left languages.
The drawer is given a fixed width in dp and extends the full height of
the container. A solid background is used for contrast
with the content view. -->
<LinearLayout
android:layout_height="match_parent"
android:layout_width="120dp"
android:weightSum="7"
android:layout_gravity="start"
android:id="#+id/parentlayoutt"
android:choiceMode="singleChoice"
android:orientation="vertical"
>
<ImageView
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="3"
android:id="#+id/headerimage"
android:src="#drawable/yourimage"
/>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:id="#+id/parentmenuone"
android:soundEffectsEnabled="true"
android:descendantFocusability="blocksDescendants"
android:background="#color/pure_white"
>
<ImageButton
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:src="#drawable/birdwhite"
android:background="#color/white"
android:id="#+id/sidejive1"
android:clickable="false"
android:layout_centerInParent="true"
/>
<TextView
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_centerHorizontal="true"
android:layout_below="#+id/sidejive1"
android:id="#+id/title1"
android:clickable="false"
android:textColor="#color/violetbg"
android:text="#string/createmenu"
/>
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:descendantFocusability="blocksDescendants"
android:id="#+id/parentmenutwo"
android:background="#drawable/whitebox"
>
<ImageButton
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:src="#drawable/profilewhite"
android:background="#color/white"
android:id="#+id/sidejive2"
android:clickable="false"
android:layout_centerInParent="true"
/>
<TextView
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_centerHorizontal="true"
android:layout_below="#+id/sidejive2"
android:id="#+id/title2"
android:clickable="false"
android:textColor="#color/violetbg"
android:text="#string/Accountmenu"
/>
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:descendantFocusability="blocksDescendants"
android:id="#+id/parentmenuthree"
android:background="#drawable/whitebox"
>
<ImageButton
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:src="#drawable/homewhite"
android:background="#color/white"
android:id="#+id/sidejive3"
android:clickable="false"
android:layout_centerInParent="true"
/>
<TextView
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_centerHorizontal="true"
android:layout_below="#+id/sidejive3"
android:id="#+id/title3"
android:textColor="#color/violetbg"
android:text="#string/Dashboardmenu"
android:clickable="false"
/>
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:id="#+id/parentmenufour"
android:descendantFocusability="blocksDescendants"
android:background="#drawable/whitebox"
>
<ImageButton
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:src="#drawable/examplewhite"
android:background="#color/white"
android:id="#+id/sidejive4"
android:clickable="false"
android:layout_centerInParent="true"
/>
<TextView
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_centerHorizontal="true"
android:layout_below="#+id/sidejive4"
android:id="#+id/title4"
android:textColor="#color/violetbg"
android:text="#string/Examplemenu"
android:clickable="false"
/>
</RelativeLayout>
</LinearLayout>
</android.support.v4.widget.DrawerLayout>

Navigation drawer - items overlapping in horizontal orientation

In my Nav Drawer, I have a ListView and below that some ImageButtons. To show the Listview on top and rest of the views at the bottom of the screen, I used relative layout as below.
In this scenario, when I rotate my phone to horizontal orientation (e.g. not enough length to show ListView and others), the ImageButtons overlap the ListView (like floating DIVs in HTML).
I tried using LinearLayout with layout_gravity = "bottom" for the container of ImageButtons, but then the buttons were placed adjacent to the Listview, rather than at the bottom of the scren.
Please guide me how to implement this correctly.
<!-- Framelayout to display Fragments -->
<FrameLayout
android:id="#+id/frame_container"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<RelativeLayout
android:id="#+id/drawer"
android:layout_width="240dp"
android:layout_height="match_parent"
android:layout_gravity="start">
<ListView
android:id="#+id/list_slidermenu"
android:layout_width="240dp"
android:layout_height="wrap_content"
android:layout_gravity="start" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true" >
<LinearLayout
android:id="#+id/extrabuttons"
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<ImageButton
android:id="#+id/credit"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/information" />
<ImageButton
android:id="#+id/exit"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_exit" />
</LinearLayout>
<TextView
android:id="#+id/ad"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/extrabuttons"
android:gravity="start"
android:text="#string/ad_tag" />
</RelativeLayout>
</RelativeLayout>
This is what it should be looked like & how it is looked like in vertical mode
This is how it is looked like in horizontal mode

The layout components are overlapped because you have used Relative layout as parent.Try to use Linear layout with vertical orientation, instead of Relative layout.

Then Try to do this
<LinearLayout
android:id="#+id/drawer"
android:layout_width="240dp"
android:layout_height="match_parent"
android:layout_gravity="start"
android:orientation="vertical" >
<ListView
android:id="#+id/list_slidermenu"
android:layout_width="240dp"
android:layout_height="0dp"
android:layout_gravity="start"
android:layout_weight="6" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1" >
<LinearLayout
android:id="#+id/extrabuttons"
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<ImageButton
android:id="#+id/credit"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_launcher" />
<ImageButton
android:id="#+id/exit"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_launcher" />
</LinearLayout>
<TextView
android:id="#+id/ad"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/extrabuttons"
android:gravity="start"
android:text="string/ad_tag" />
</RelativeLayout>
</LinearLayout>

I know my answer is bit late. I will suggest to make seperate xml layout and add this layout to listview with 'addFooterView' method. It will bound that xml always in last of that list view. I hope it will help you.

Resizing the view in android

I am using the sliding menu in my application
After clicking on the setting icon I go the following result
The content in the first layout is wrapping, instead I want to hide that part of view
Xml file
<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:background="#drawable/menu_bg"
tools:context=".PrincipalActivity" >
<include layout="#layout/actionbar_menu" android:id="#+id/actionBarMenu"/>
//listview for displaying menu
<ListView
android:id="#+id/listMenu"
android:layout_below="#+id/actionBarMenu"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:divider="#282828"
android:dividerHeight="1dip"
android:background="#3F3F3F"
android:fadingEdge="none"
android:listSelector="#drawable/list_selector">
</ListView>
//this is main layout which is visible first time when application starts
<RelativeLayout
android:id="#+id/layoutToMove"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_below="#+id/actionBar"
android:background="#282828">
<include layout="#layout/actionbar_layout" android:id="#+id/actionBar"/>
<ImageButton
android:id="#+id/menuButton"
android:layout_width="48dp"
android:layout_height="48dp"
android:layout_alignBottom="#+id/actionBar"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:onClick="openCloseMenu"
android:src="#drawable/menu"
android:background="#android:color/transparent" />
<TextView android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="asdkjasdksajdkasjdkasjdkasdddddddddddddddddddddddddddddd"
android:textColor="#fff"
android:layout_centerVertical="true"/>
<Button
android:id="#+id/separator"
android:layout_width="1dp"
android:layout_height="50dp"
android:layout_toRightOf="#+id/menuButton"
android:background="#drawable/custom_button_black" />
</RelativeLayout>
Any kind of help will be greatly appreciated

You should consider using jfeinstein10's SlidingMenu. It is quite good and is widely used by many popular Android apps such as Foursquare Rdio, Falcon Pro, ...etc