I have a menu with fragment (the screen of each menu's item). I need to align this items in center vertically.
There's my code:
activity_maps.xml (the screen of 'map' item)
<?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="match_parent">
<fragment xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/map"
tools:context=".HomeFragment"
android:name="com.google.android.gms.maps.SupportMapFragment"/>
</RelativeLayout>
and the menu_item.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_centerVertical="true"
android:layout_gravity="center_vertical"
android:orientation="vertical"
android:background="#drawable/list_selector">
<ImageView
android:id="#+id/icon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_marginLeft="12dp"
android:layout_marginRight="12dp"
android:layout_marginTop="200dp"
android:contentDescription="#string/desc_list_item_icon"
android:src="#drawable/ic_home"
android:gravity="center_vertical"
android:layout_centerVertical="true" />
</RelativeLayout>
There's the activity_main with the menu which has some menu_itens.xml inside a listView
<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_centerVertical="true"
android:layout_gravity="center_vertical"
android:orientation="vertical"
android:layout_height="match_parent">
<!-- Framelayout to display Fragments -->
<FrameLayout
android:id="#+id/frame_container"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<!-- Listview to display slider menu -->
<ListView
android:id="#+id/list_slidermenu"
android:layout_width="240dp"
android:layout_height="match_parent"
android:layout_gravity="start"
android:choiceMode="singleChoice"
android:divider="#color/list_divider"
android:dividerHeight="1dp"
android:listSelector="#drawable/list_selector"
android:background="#color/list_background"/>
Edit: print link
http://s12.postimg.org/3ysbeaarx/Screenshot_2015_03_06_10_35_53.png
you can use this LinearLayout instead of ListView
<LinearLayout
android:layout_width="240dp"
android:layout_height="fill_parent"
android:orientation="vertical">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_weight="1"/>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:layout_gravity="center_horizontal"/>
</LinearLayout>
or u can redesign as u like with any layout
Related
Main activity layout (removed the irrelevant elements):
<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:background="#android:color/black"
<RelativeLayout
android:id="#+id/layout_relative_in_drawer"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#android:color/black" >
// some more elements ...
</RelativeLayout>
<ListView
android:id="#+id/drawer_main"
android:layout_width="120dp"
android:layout_height="match_parent"
android:layout_gravity="start"
android:background="#80000000"
android:choiceMode="singleChoice"
android:divider="#android:color/transparent"
android:dividerHeight="10dp" />
</android.support.v4.widget.DrawerLayout>
drawer_item.xml:
<?xml version="1.0" encoding="utf-8"?>
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/drawerItemTextView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:layout_gravity="center"
android:textColor="#android:color/white" >
</TextView>
The list items are aligned to the center horizontally now, but not vertically.
What should i modify to center them vertically?
Change your drawer item to this:
<?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="horizontal" >
<TextView
android:id="#+id/frag1_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="10dp"
android:textAppearance="?android:attr/textAppearanceLarge" />
</LinearLayout>
then try, it is working for me.
<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.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="#ffffff" >
<FrameLayout
android:id="#+id/content_frame"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#eeeeee" >
</FrameLayout>
<ListView
android:id="#+id/left_drawer"
android:layout_width="240dp"
android:layout_height="match_parent"
android:layout_gravity="start"
android:background="#333333"
android:choiceMode="singleChoice"
android:divider="#android:color/darker_gray"
android:dividerHeight="1dp" />
</android.support.v4.widget.DrawerLayout>
<?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="50dp"
android:orientation="horizontal" >
<TextView
android:id="#+id/text"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center|left"
android:padding="5dp"
android:text="Medium Text"
android:textColor="#FB9200" />
</LinearLayout>
drawer_item.xml:
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:text="a" />
</RelativeLayout>
Probably you should change the gravity of items to:
android:gravity="center|center_vertical"
I recently added a Navigation Drawer to my Android layout. The Drawer itself is working fine, however the old layout is not displaying at all (the elements are there, but not visable).
I have tried to play around with the positioning of the elements, but nothing seems to work.
This is my Layout:
<!-- 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" android:background="#FFFFFF">
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:background="#FFFFFF"
android:id="#+id/displayframe"
>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/Content"/>
<Spinner
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_alignParentTop="true"
android:background="#AAAAAA"
android:id="#+id/spinner"
android:layout_margin="15dp"/>
<ListView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/listview"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#1399cb"
android:layout_weight="1"
/>
<ProgressBar
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/progressBar2"
android:background="#1399cb"
android:layout_gravity="center_horizontal" />
<RelativeLayout
android:id="#+id/footer"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:background="#1399cb"
android:gravity="center" >
</RelativeLayout>
</LinearLayout>
</FrameLayout>
<fragment android:id="#+id/navigation_drawer"
android:layout_width="#dimen/navigation_drawer_width"
android:layout_height="match_parent"
android:layout_gravity="start"
android:name="schoolbus.tracker.datavoice.schoolbusdrawer.NavigationDrawerFragment"
tools:layout="#layout/fragment_navigation_drawer"
/>
</android.support.v4.widget.DrawerLayout>
This is the navigation drawer fragment:
<ListView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools" android:layout_width="wrap_content"
android:layout_height="match_parent" android:choiceMode="singleChoice"
android:divider="#android:color/black" android:dividerHeight="0dp"
android:background="#cccc" tools:context=".NavigationDrawerFragment"
/>
and the layout I use to inflate it:
<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:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
android:paddingBottom="#dimen/activity_vertical_margin"
android:background="#1399cb"
tools:context=".MainActivity$PlaceholderFragment">
<ImageView android:id="#+id/icons" android:layout_height="40dp" android:layout_width="40dp"
android:contentDescription="" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text=""
android:id="#+id/textView4"
android:textColor="#FFFFFF"
android:layout_marginLeft="10dp"
android:layout_marginTop="6dp"
android:textSize="19dp"
android:layout_alignTop="#+id/icons"
android:layout_toRightOf="#+id/icons"
android:layout_toEndOf="#+id/icons" />
</RelativeLayout>
Thank you in advance.
Why don't go like this:
main activity 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 -->
<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"
android:background="#111"/>
</android.support.v4.widget.DrawerLayout>
Drawer
then in your activity just add fragment to content_frame and that's it:
getFragmentManager().beginTransaction()
.replace(R.id.content_frame, fragmentToShow)
.commit();
Actually you haven't closed your FrameLayout inside this layout file,nevertheless i can't see any mistake placed except for that.
EDITED: You must put your frameLayout inside the LinearLayout
<!-- As the main content view, the view below consumes the entire
space available using match_parent in both dimensions. -->
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:background="#FFFFFF"
android:id="#+id/displayframe">
<FrameLayout android:id="#+id/container" android:layout_width="match_parent"
android:layout_height="match_parent" android:background="#FFFFFF">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/Content"/>
<Spinner
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_alignParentTop="true"
android:background="#AAAAAA"
android:id="#+id/spinner"
android:layout_margin="15dp"/>
<ListView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/listview"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#1399cb"
android:layout_weight="1"
/>
<ProgressBar
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/progressBar2"
android:background="#1399cb"
android:layout_gravity="center_horizontal" />
<RelativeLayout
android:id="#+id/footer"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:background="#1399cb"
android:gravity="center" >
</RelativeLayout>
</FrameLayout>
</LinearLayout>
Also Is there any type of rendering problem when you compile it?
In my application I'm using navigation drawer. I want to decrease the height of the drawer. please help me.
XML:
<?xml version="1.0" encoding="utf-8"?>
<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">
<RelativeLayout
android:id="#+id/r1"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.v7.widget.Toolbar
android:id="#+id/my_awesome_toolbar"
android:layout_width="fill_parent"
android:layout_height="40dp"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:background="#drawable/background">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/logo"
android:layout_marginTop="7dp"
android:layout_gravity="center"/>
</android.support.v7.widget.Toolbar>
<FrameLayout
android:id="#+id/frame_content"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_below="#+id/my_awesome_toolbar"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"></FrameLayout>
</RelativeLayout>
<ListView
android:id="#+id/left_drawer"
android:layout_width="200dp"
android:layout_height="match_parent"
android:layout_gravity="start"
android:divider="#FFFFFF"
android:dividerHeight="4px"
android:background="#1e365a"
android:choiceMode="singleChoice" />
</android.support.v4.widget.DrawerLayout>
It totally covers the complete height of the screen. And even the drawer icon is not showing after it is clicked.
I have created a navigation drawer having a listview with icon and text. Now, I want to add a title above it and also another below it. Below are two xml I have used:
<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">
<!-- <fragment
android:id="#+id/badMap"
android:layout_width="match_parent"
android:layout_height="match_parent"
class="com.google.android.gms.maps.SupportMapFragment" /> -->
<FrameLayout
android:id="#+id/testFrame"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<android.support.v4.widget.DrawerLayout
android:id="#+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<!-- Framelayout to display Fragments -->
<FrameLayout
android:id="#+id/frame_container"
android:layout_width="match_parent"
android:layout_height="match_parent" >
</FrameLayout>
<!-- Listview to display slider menu -->
<ListView
android:id="#+id/list_slidermenu"
android:layout_width="200dp"
android:layout_height="wrap_content"
android:layout_gravity="start"
android:choiceMode="singleChoice"
android:divider="#color/list_divider"
android:dividerHeight="1dp"
android:listSelector="#drawable/list_selector"
android:background="#color/list_background"/>
</android.support.v4.widget.DrawerLayout>
</FrameLayout>
</RelativeLayout>
And:
<?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="40dp"
android:background="#drawable/list_selector">
<LinearLayout
android:id="#+id/itemLayout"
android:layout_width="fill_parent"
android:layout_height="55dp"
android:layout_alignParentLeft="true"
android:orientation="vertical"
android:layout_marginTop="0dp"
>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:minHeight="55dp"
>
<ImageView
android:id="#+id/drawerIcon"
android:layout_width="25dp"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_marginLeft="12dp"
android:layout_marginRight="12dp"
android:contentDescription="#string/desc_list_item_icon"
android:src="#drawable/high"
android:layout_centerVertical="true"
android:gravity="center" />
<TextView
android:id="#+id/drawerTitle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_toRightOf="#+id/drawerIcon"
android:gravity="center"
android:minHeight="?android:attr/listPreferredItemHeightSmall"
android:layout_centerVertical="true"
android:text="#string/drawerlistTitle"
android:textAppearance="?android:attr/textAppearanceListItemSmall"
android:textColor="#color/list_item_title" />
</LinearLayout>
<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:layout_marginBottom="1dp"
android:layout_marginTop="1dp"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:background="#DADADC"
></View>
</LinearLayout>
</RelativeLayout>
Any ideas on how to add a titles in this?
It's simple actually :-)
Instead of using a ListView as your drawer, you can wrap the ListView in a RelativeLayout for instance like this:
<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" >
<FrameLayout
android:id="#+id/testFrame"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<android.support.v4.widget.DrawerLayout
android:id="#+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<!-- Framelayout to display Fragments -->
<FrameLayout
android:id="#+id/frame_container"
android:layout_width="match_parent"
android:layout_height="match_parent" >
</FrameLayout>
<!-- Listview to display slider menu -->
<RelativeLayout
android:layout_width="200dp"
android:layout_height="match_parent"
android:orientation="vertical" >
<TextView
android:id="#+id/titleTextView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Title" />
<ListView
android:id="#+id/list_slidermenu"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/titleTextView"
android:layout_above="#+id/titleUnderListView"
android:layout_gravity="start"
android:background="#color/list_background"
android:choiceMode="singleChoice"
android:divider="#color/list_divider"
android:dividerHeight="1dp"
android:listSelector="#drawable/list_selector" />
<TextView
android:id="#+id/titleUnderListView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:text="SubTitle" />
</RelativeLayout>
</android.support.v4.widget.DrawerLayout>
</FrameLayout>
</RelativeLayout>
You can put whatever you like as the layout for the NavigationDrawer - the sky is the limit :-)
Another solution could be to add a header and footer to your current ListView, but then it wouldn't be fixed on top or the bottom.
i want to add icons at the action bar , in this layout
i have 2 layout , first one which hold ExpandableListView and second for details fragment ,
how can i do something like that ??
this is the main activity
<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" />
<ExpandableListView
android:id="#+id/left_drawer"
android:layout_width="240dp"
android:layout_height="match_parent"
android:choiceMode="singleChoice"
android:cacheColorHint="#00000000"
android:childDivider="#drawable/child_separator"
android:dividerHeight="0dp"
android:layout_gravity="right"
/>
</android.support.v4.widget.DrawerLayout>
Details Fragment
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/mainLyt"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/detailsText"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="center_horizontal|center_vertical"
android:layout_marginTop="20dip"
android:text="Defaulyyyyyyyyt Text"
android:textAppearance="?android:attr/textAppearanceLarge"
android:textSize="30dip" />
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#+id/bottomBar"
android:orientation="horizontal"
android:background="?android:attr/dividerVertical"
android:layout_alignParentBottom="true">
<Button
android:id="#+id/botton_matn"
android:background="?android:attr/selectableItemBackground"
android:text="المتون"
android:layout_gravity="center"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
/>
<Button
android:id="#+id/botton_rawe"
android:background="?android:attr/selectableItemBackground"
android:text="الراوي"
android:layout_gravity="center"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
/>
</LinearLayout>
</RelativeLayout>
You may try it with ActionBarSherlock. It is more simple.