I'm aiming to have a toolbar with text in the center of it and a menu icon on the far left, like so:
!-ICON-----TEXT-----------!
This is how I have attempted it:
<android.support.v7.widget.Toolbar
android:id="#+id/tool_bar_test"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
android:fitsSystemWindows="true">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Text Here"
android:textColor="#ffffff"
android:textSize="23sp"
android:layout_gravity="center" />
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:src="#drawable/hamburger2"
android:layout_gravity="left"/>
</RelativeLayout>
</android.support.v7.widget.Toolbar>
I found that without a RelativeLayout it displays ONLY the text. But as it stands, the toolbar looks like this:
!-TEXT-----ICON-----------!
For some reason it displays them in the wrong order. Even if I swap the layout_gravity of the 2 elements it displays the same thing.
Does anybody know why this could be happening?
Here is how I would accomplish this. Here is a link to all of the material icons. https://www.google.com/design/icons/ Make sure you are using their hamburger menu. Also if you are using Android Studio, you should have 4 different sizes for the hamburger menu within your mipmap folder. Also, Tooolbar titles are 22sp
Here is what the toolbar would look like with the example below:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent">
<RelativeLayout
android:id="#+id/toolbarContainer"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.v7.widget.Toolbar
android:id="#+id/tool_bar_test"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
android:fitsSystemWindows="true"
app:navigationIcon="#drawable/hamburger2" />
<TextView
android:layout_width="wrap_content"
android:layout_height="?attr/actionBarSize"
android:layout_centerHorizontal="true"
android:gravity="center_vertical"
android:text="Text Here"
android:textColor="#ffffff"
android:textSize="23sp" />
</RelativeLayout>
<!-- Rest of your Content -->
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/toolbarContainer">
</RelativeLayout>
</RelativeLayout>
First of all, you're setting the width of your views to match_parent, which makes them as wide as the parent RelativeLayout and drawn on top of each other regardless of their positioning. The text appears to the left, because it's left-aligned by default and the image is centered for the same reason. You should set it to wrap_content to make them only as wide as needed.
Secondly, android:layout_gravity does not really work well with a RelativeLayout, because gravity is applied on all its children at once after postioning. You can use android:layout_centerHorizontal="true" for centering instead.
Besides that, when using a RelativeLayout, if you populate yout TextView with a long text, it might stretch and overlap the image. Please consider using a LinearLayout:
<android.support.v7.widget.Toolbar
android:id="#+id/tool_bar_test"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
android:fitsSystemWindows="true"
xmlns:android="http://schemas.android.com/apk/res/android">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/hamburger2" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Text Here"
android:textColor="#ffffff"
android:textSize="23sp" />
</LinearLayout>
</android.support.v7.widget.Toolbar>
This way the text will be always displayed to the right of the image.
Related
I have some problem in my layout width edit-text
here are screenshots which describe my problem
1. normal layout (all views are inside the LinearLayout)
2. I want layout below when user input many text lines inside the Edit Text
3. But When user enter many text lines.. my layout looks like below.
I want the Edit Text should be stretched until only ImageView meets the bottom ViewGroup.
but, more entering text lines, more being increased the height of Edit Text so, i cannot see Image View.
i'd appreciate it if you give me any solution.
LinearLayout handles this sort of layouts great. You can use the attribute android:layout_weight="1" within a LinearLayout to set the priority of the space you want the object to take.
The official documentation describe it best:
developer.android.com
Take RelativeLayout as your parent layout
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="?actionBarSize"
android:orientation="vertical">
<EditText
android:id="#+id/editText1"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.9"
android:inputType="textMultiLine"
android:scrollbars="vertical"/>
<ImageView
android:id="#+id/imageView1"
android:layout_marginBottom="?actionBarSize"
android:layout_width="match_parent"
android:layout_weight="0.1"
android:layout_height="?actionBarSize" />
</LinearLayout>
<View
android:id="#+id/view1"
android:layout_width="match_parent"
android:layout_height="?actionBarSize"
android:layout_alignParentBottom="true" />
<?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">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_above="#id/bottomGroup"
android:orientation="vertical">
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
<RelativeLayout
android:id="#+id/bottomGroup"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true" />
</RelativeLayout>
Here's my xml using a LinearLayout. Both the Toolbar and the Button are at the top of the screen. However I want the Button centrally horizontal and centrally vertical. Also the Button is floated to the left and not in the center.
xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#color/colorVeryDark"
android:elevation="4dp"
android:theme="#style/ThemeOverlay.AppCompat.ActionBar" />
<Button
android:id="#+id/button2"
android:layout_width="200dp"
android:layout_height="wrap_content"
android:text="text"
android:textSize="22dp"
android:layout_gravity="center_vertical"
android:background="#color/colorPrimaryDark"
/>
</LinearLayout>
How would I do this?
Try this: use a RelativeLayout and use android:layout_centerInParent="true" for the Button
<?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">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#color/colorPrimaryDark"
android:elevation="4dp"
android:theme="#style/ThemeOverlay.AppCompat.ActionBar" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<Button
android:id="#+id/button2"
android:layout_width="200dp"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:background="#color/colorPrimaryDark"
android:text="text"
android:textSize="22dp" />
</RelativeLayout>
</LinearLayout>
Output:
Unfortunately LinearLayouts are not the best for this. FrameLayout, RelativeLayout or ConstraintLayout will give you the flexibility to do what you want.
try to use gravity
<Button
android:id="#+id/okbutton"
android:layout_width="wrap_content"
android:layout_height="300dp"
android:text="text"
android:gravity="center"
android:layout_gravity="center_horizontal"
android:textSize="50sp" />
Use a RelativeLayout then you add the code:
android:gravity="center"
android:layout_gravity="center_horizontal"
in your Button XML.
In alternative, you can use the "design" tool of AndroidStudio for layouts: you can add a button and then drag wherever you want in the preview.
However, there are tons of post like this: next time try to search better :D
Just use this line of code in your button xml design-
android:gravity="center"
For more ideas you can check this link-
Center a button in a Linear layout
Add these two lines in you Button
android:gravity="center"
android:layout_gravity="center_horizontal"
refer this image for proper understanding of use of gravity
I designed my layout for headerView and wanted to add an image icon on its right side,just like the photo.
The problem is that it will show the spaces like in the image, even if I delete the image layout,the spaces are still there.
I try to change the parent layout or child layout for their layout width, any parameter like math parent or wrap content or give a dp.
I tried the official demo to fix it , but it did not work.
Can anyone teach me how to do this?
My nav_heafer.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"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:background="#66CDAA"
android:orientation="horizontal">
<!--the left navigationView-->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="16dp">
<!--the left icon-->
<ImageView
android:id="#+id/imageView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="16dp"
app:srcCompat="#drawable/ic_grid_on_black_24dp" />
<!--the left textView-->
<TextView
android:id="#+id/logIn"
android:textColor="#android:color/background_light"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/pageLogIn"
android:background="?android:attr/selectableItemBackground"
android:clickable="true"/>
<!--the left button-->
<Button
android:id="#+id/logOut"
android:text="#string/logOut"
android:layout_width="65dp"
android:layout_height="wrap_content" />
</LinearLayout>
</LinearLayout>
<!--I just want a outstanding icon over here,on the right side of navigationView-->
<!--I try add the LinearLayout,but it shows strange-->
</LinearLayout>
[1]: https://i.stack.imgur.com/hQy1d.png
[2]: https://i.stack.imgur.com/E9jyu.png
My MainActivity xml:
<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/drawerLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="false"
tools:context="com.example.user.taiwandigestionsociety_v11.MainActivity">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#FFFFFF">
<android.support.v7.widget.Toolbar
android:id="#+id/toolBar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:theme="#style/ToolBarStyle"
app:layout_scrollFlags="scroll|enterAlways"
android:background="#color/colorPrimary">
</android.support.v7.widget.Toolbar>
<FrameLayout
android:id="#+id/mainFrame"
android:layout_gravity="end"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</android.support.design.widget.AppBarLayout>
<!--control navigationView width-->
<android.support.design.widget.NavigationView
android:id="#+id/nav_view"
android:layout_width="230dp"
android:layout_height="match_parent"
android:layout_gravity="start"
android:background="#android:color/white"
android:fitsSystemWindows="true"
app:headerLayout="#layout/nav_header"
app:menu="#menu/drawer_menu">
</android.support.design.widget.NavigationView>
</android.support.v4.widget.DrawerLayout>
all right, finally i understood your problem and solved.This should give you something like below.
so let's get started!
very first of all you want to remove the white background behind your icon, so set transparent background to your navigation view as shown below.
<android.support.design.widget.NavigationView
android:id="#+id/navigation_view"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"
<!-- it works as transparent background color -->
android:background="#android:color/transparent"
app:headerLayout="#layout/navigation_header_support" />
for your custom header, you should use relative layout as parent because you want your close icon to be at the most right side of your navigation panel. so we can align that close icon according to parent. this time set background color to your direct child of your relative parent layout, as i did for linear layout.
In order to fit the icon within relative layout, leave some margin from right for linear layout, so leftovers right margin space will be occupied by your icon. set the same width of your icon as much space you pushed your linear layout from right. Here i leave 32dp margin from right, and set the width of my icon to match it.
For proper position of that icon i used the following attributes. You should adjust yours.
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
The nav_header.xml
<?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">
<LinearLayout
android:paddingTop="64dp"
<!-- background color -->
android:background="#color/blue_2"
android:layout_marginRight="32dp"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:textColor="#android:color/white"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="#dimen/activity_horizontal_margin"
android:drawableLeft="#drawable/ic_pin_primary"
android:drawablePadding="#dimen/activity_horizontal_margin"
android:drawableStart="#drawable/ic_pin_primary"
android:gravity="center_vertical"
android:typeface="normal"
android:textSize="18sp"
android:text="Location"
android:textStyle="bold" />
<!-- Other items go here -->
</LinearLayout>
<ImageView
android:background="#color/blue_2"
android:layout_alignParentRight="true"
android:layout_marginTop="64dp"
android:layout_alignParentTop="true"
android:src="#drawable/ic_pencil"
android:layout_width="32dp"
android:layout_height="32dp" />
</RelativeLayout>
all right this is not an answer to your question. But you can improve your layout as well as performance. Then change your nav layout in your question according to this and update your question once again. then it could be more readable and easy to understand your problems. so anybody could find it easy to answer
Instead using a linear layout with orientation horizontal for icon and textView you can do instead as i shown below.
You current Implementation:
<LinearLayout
android:layout_marginTop="30dp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<ImageView
android:id="#+id/imageView9"
android:layout_marginLeft="10dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:srcCompat="#drawable/ic_grid_on_black_24dp" />
<TextView
android:id="#+id/newInformation"
android:textSize="15dp"
android:layout_marginLeft="10dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/newInformation"
android:textColor="#android:color/background_light"/>
</LinearLayout>
Now change that to something like this :
<TextView
android:id="#+id/person_address"
android:layout_width="match_parent"
android:layout_height="wrap_content"
<!-- this is where your icon goes -->
android:drawableLeft="#drawable/ic_grid_on_black_24dp"
android:drawableStart="#drawable/ic_grid_on_black_24dp"
<!-- your icon's padding -->
android:drawablePadding="#dimen/activity_horizontal_margin"
android:gravity="center_vertical" />
please change your layout into something like this, then i could try to answer your question.
I'm stuck with an issue and I have browsed the entire internet for a solution but nothing is working for me.
I have added an imageview inside my toolbar but it's slightly towards the right. It doesn't align centrally, it's shifted a bit towards the right. When i align the imageview to the left, there's an unknown padding/gap between the imageview and the left side of the toolbar. Following is my XML code:
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<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=".NavigationDrawerHomeScreen.BaseActivity">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/AppTheme.AppBarOverlay"
app:elevation="0dp">
<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/toolbar_home_activity"
android:layout_width="match_parent"
android:layout_height="45dp"
android:contentInsetLeft="0dp"
android:contentInsetStart="0dp"
android:contentInsetStartWithNavigation="0dp"
android:minHeight="?attr/actionBarSize"
app:contentInsetLeft="0dp"
app:contentInsetStart="0dp"
app:contentInsetStartWithNavigation="0dp">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="#+id/logo_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:src="#drawable/fixer_title_thick" />
</RelativeLayout>
<android.support.v7.widget.SearchView
android:id="#+id/search_home"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:showAsAction="ifRoom"
android:visibility="gone">
</android.support.v7.widget.SearchView>
</android.support.v7.widget.Toolbar>
</android.support.design.widget.AppBarLayout>
<FrameLayout
android:id="#+id/container_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:src="#drawable/home_bg" />
</FrameLayout>
<!--<TextView-->
<!--android:layout_width="wrap_content"-->
<!--android:layout_height="wrap_content"-->
<!--android:layout_centerInParent="true"-->
<!--android:text="this is base" />-->
</android.support.design.widget.CoordinatorLayout>
</RelativeLayout>
<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:background="#2A2929"
android:backgroundTint="#2A2929"
android:fitsSystemWindows="true"
app:headerLayout="#layout/nav_header_home_customer"
app:itemTextAppearance="#style/NavDrawerTextStyle"
app:itemTextColor="#fff"
app:menu="#menu/activity_home_customer_drawer">
<LinearLayout
android:id="#+id/footer"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_gravity="bottom"
android:clickable="true"
android:orientation="vertical">
<!-- any addition stuff you want in yoour footer layout -->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:layout_marginTop="50dp"
android:orientation="vertical">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Set Search Radius"
android:textColor="#color/white" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:clipChildren="false">
<com.crystal.crystalrangeseekbar.widgets.CrystalSeekbar
android:id="#+id/rangeSeekbar1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:bar_color="#color/blue"
app:left_thumb_color="#color/blue_dark" />
<TextView
android:id="#+id/textMin1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/rangeSeekbar1"
android:layout_marginBottom="10dp"
android:layout_marginLeft="10dp"
android:layout_marginStart="10dp"
android:layout_marginTop="5dp"
android:text="0"
android:textColor="#color/white"
android:textSize="16dp" />
<TextView
android:id="#+id/textMax1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_below="#id/rangeSeekbar1"
android:layout_marginEnd="10dp"
android:layout_marginRight="10dp"
android:layout_marginTop="5dp"
android:text="100"
android:textColor="#color/white"
android:textSize="16dp" />
</RelativeLayout>
</LinearLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="48dp"
android:background="#1E88E5">
<TextView
android:id="#+id/logout_footer"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_marginBottom="20dp"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
android:drawableLeft="#drawable/ic_logout_white_24dp"
android:drawablePadding="32dp"
android:text="Logout"
android:textColor="#fff"
android:textSize="18sp" />
</RelativeLayout>
</LinearLayout>
</android.support.design.widget.NavigationView>
The app:contentinset/android:contentinset solution works for some people but it doesnt work for me.
here's the image http://imgur.com/a/Vp2g6.
I had this same problem, and I tried a lot of things like setting
app:contentInsetStart ="0dp" ;
app:contentInsetStartWithNavigation = "0dp" ;
It didn't work. I even set them to a negative value, but it didn't work. I tried adding a right margin to my child view but it reduced the visible size of child view instead of occupying that left space. So probably child views are not allowed in this space.
So after spending some time I figured there are 2 ways to workaround this problem, one is preferred other I'd not prefer. First let me tell you the one I do not prefer:
Custom Implementation of the Up button: This problem only arises when in your Java Class for this layout you set this toolbar as your ActionBar and you
setDisplayHomeAsUpEnabled(true);
Without this command this problem doesn't exist. So if you don't use the default back button and implement one your own by putting an imageView and providing onClick implementation, this should work fine.
Make ChildViews as rather Siblings: The other method is using the property of toolbar of it being just another view.
I prefer this method because by using this method you can use the android's default up button. The only thing you need to do is - instead of defining child views inside the toolbar, make the child view and toolbar as siblings in a Linear or Relative Layout. This way you can reduce the left space only to "wrap_content" of the toolbar and utilise the left space in other child views. In my app, I even had an onClick functionality on the toolbar which can now be done by giving that functionality on the parent of both the layouts i.e. set the onClick on the LinearLayout.
Though I still don't know the exact reason why the left space exists or is there a way to disable it, but this is a pretty clean method to work around this.
I am trying to place a RelativeLayout within a Toolbar so that I can position views easily within the Toolbar. This Toolbar is used in standalone mode and has two menu items.
I have this in my layout 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"
tools:context=".MainActivity"
android:background="#ffffff">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="350dp"
android:elevation="3dp"
android:background="#ff17182b">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#f76865"
android:layout_gravity="center_horizontal">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Title"
android:textSize="17sp"
android:textStyle="bold"
android:textColor="#ffffff"
android:layout_alignParentTop="true"
android:layout_marginTop="10dp"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#FFD10202"
android:elevation="3dp"
android:text="Stopped"
android:textColor="#ffffff"
android:padding="2dp"
android:layout_marginTop="50dp"/>
</RelativeLayout>
</android.support.v7.widget.Toolbar>
http://i.imgur.com/XLZx7Ts.png is a link to a screenshot of the resulting UI
With the layout above, the RelativeLayout is positioned to the left and its right border stops just at the left border of the toolbar menu items. it is as if the menu items cover the area from the top of the screen to the end of the toolbar and won't allow placing of elements within that area
Please, I need to know if I am doing anything wrong or if there is a right way of positioning views within a toolbar