Develop Reference

SearchView search_plate not extending to full width

I have a SearchView in my toolbar that i created like this:
<RelativeLayout
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:id="#+id/root_layout"
tools:context=".ui.search.SearchActivity"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.AppBarLayout
android:id="#+id/profile_appbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/topbar_gradient"
android:theme="#style/AppTheme.Dark"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/topbar_gradient"
android:contentInsetEnd="0dp"
android:contentInsetLeft="-16dp"
android:contentInsetRight="0dp"
android:contentInsetStart="0dp"
android:fitsSystemWindows="true"
android:minHeight="?android:attr/actionBarSize"
app:contentInsetEnd="0dp"
app:contentInsetLeft="0dp"
app:contentInsetRight="0dp"
app:contentInsetStart="0dp"
app:layout_scrollFlags="scroll|enterAlways">
<android.support.v7.widget.SearchView
android:gravity="left"
android:maxWidth="1000dp"
android:id="#+id/search_view"
android:background="#drawable/bg_search"
app:iconifiedByDefault="false"
app:goIcon="#null"
app:voiceIcon="#null"
app:commitIcon="#null"
android:layout_marginEnd="#dimen/double_spacing"
android:layout_width="match_parent"
android:layout_height="match_parent">
</android.support.v7.widget.SearchView>
</android.support.v7.widget.Toolbar>
</android.support.design.widget.AppBarLayout>
(...)
</RelativeLayout>
This shows up like this:
So the SearchView does expand to full width, but not the textview within it, which by using the Layout Inspector I found out is within a LinearLayout called search_plate, which is in a LinearLayout called search_edit_frame that is not expanding:
Now as much as I try I cant get the Search bar to start closer to the back button nor the Search Edit Text to expand to full width.
I tried this based off other answers:
var findViewById = searchView.findViewById<LinearLayout>(searchView.context.resources.getIdentifier("android:id/search_edit_frame", null, null))
findViewById?.layoutParams?.width = LinearLayout.LayoutParams.MATCH_PARENT
But it cant ever find a view with this id.
Any ideas?

The following does the trick:
searchView.setMaxWidth( Integer.MAX_VALUE );
or use this
<?xml version="1.0" encoding="utf-8"?>
<SearchView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content" />

Too much margin on SearchView

My SearchView is showing up like this:
As you can see there is a margin both on the search_edit_frame of the SearchView, and outside the SearchView itself.
Where is this coming from? Inspecting the layout reveals a margin of 24 pixels to the left of search_edit_frame but no margin elsewhere.
How can I remove this extra space?
menu.xml:
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<item
android:id="#+id/appbar_menu_search"
android:icon="#drawable/ic_search"
android:title="#string/search_search"
app:showAsAction="always"
app:actionViewClass="android.support.v7.widget.SearchView" />
</menu>
Layout:
<RelativeLayout
android:id="#+id/root_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.support.design.widget.AppBarLayout
android:id="#+id/profile_appbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/topbar_gradient"
android:theme="#style/AppTheme.Dark"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent">
<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"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/topbar_gradient"
android:fitsSystemWindows="true"
android:minHeight="?android:attr/actionBarSize"
app:layout_scrollFlags="scroll|enterAlways">
</android.support.v7.widget.Toolbar>
</android.support.design.widget.AppBarLayout>
(...)
</RelativeLayout>
I managed to reduce the spacing by applying #Jimmy's answer:
However theres still a big gap between the "back" imagebutton and the SearchView.

search_edit_frame is a LinearLayout in searchview layout. It has start and end margin of 8dip by default .
relevant code from source
<LinearLayout
android:id="#+id/search_edit_frame"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_weight="1"
android:layout_marginStart="8dip"
android:layout_marginEnd="8dip"
android:orientation="horizontal"
android:layoutDirection="locale">
Your issue is probably because of start margin on it. You can get this linear layout from search view and set the layout parameter to reduce the gap in your activity ( probably inside onCreateOptionsMenu or similar where you are inflating thissearchview ) .
Something like this , assuming searchView is your SearchView instance,
LinearLayout searchFrameLL=(LinearLayout)searchView.findViewById(R.id.search_edit_frame);
LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(LinearLayout.LayoutParams.WRAP_CONTENT, LinearLayout.LayoutParams.MATCH_PARENT);
params.setMargins(0,0,8,0); //params.setMargins(left, top, right, bottom)
// params.setMarginStart(0); //(or just use individual like this
searchFrameLL.setLayoutParams(params);
In similar fashion, you can update other properties in that xml to meet your needs.

I'm not sure if it helps, but I also had an unwanted margin in the Toolbar view.
This answer about content insets helped me figure it out.
<android.support.v7.widget.Toolbar
xmlns:app="schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/primaryColor"
android:contentInsetLeft="0dp"
android:contentInsetStart="0dp"
app:contentInsetLeft="0dp"
app:contentInsetStart="0dp"
android:contentInsetRight="0dp"
android:contentInsetEnd="0dp"
app:contentInsetRight="0dp"
app:contentInsetEnd="0dp" />

There will be small padding as it a MenuItem. You can reset the content Inset padding. try setting attribute contentInsetStartWithNavigation to 0dp.
<RelativeLayout
android:id="#+id/root_layout"
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">
<android.support.design.widget.AppBarLayout
android:id="#+id/profile_appbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
>
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:contentInsetStartWithNavigation="0dp"
android:background="#color/colorAccent"
android:minHeight="?android:attr/actionBarSize"
app:layout_scrollFlags="scroll|enterAlways">
</android.support.v7.widget.Toolbar>
</android.support.design.widget.AppBarLayout>
</RelativeLayout>

You can set the leftMargin to zero to achieve desired result:
LinearLayout searchEditFrame = (LinearLayout) searchView.findViewById(R.id.search_edit_frame);
LinearLayout.LayoutParams layoutParams = (LinearLayout.LayoutParams) searchEditFrame.getLayoutParams();
layoutParams.leftMargin = 0;

<?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:id="#+id/root_layout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.AppBarLayout
android:id="#+id/profile_appbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent">
<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"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:contentInsetEnd="0dp"
android:contentInsetLeft="0dp"
android:contentInsetRight="0dp"
android:contentInsetStart="0dp"
android:fitsSystemWindows="true"
android:minHeight="?android:attr/actionBarSize"
app:contentInsetLeft="0dp"
app:contentInsetStart="0dp"
app:layout_scrollFlags="scroll|enterAlways">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_back_arrow" />
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:inputType="text"
android:textColor="#android:color/white" />
</android.support.v7.widget.Toolbar>
</android.support.design.widget.AppBarLayout>
</RelativeLayout>

Use android:layout_gravity="right" on the view.

For kotlin:
var searchView = searchItem.actionView as SearchView
val searchEditFrame: LinearLayout =
searchView!!.findViewById<View>(R.id.search_edit_frame) as LinearLayout
val layoutParams: LinearLayout.LayoutParams =
searchEditFrame.layoutParams as LinearLayout.LayoutParams
layoutParams.leftMargin = -10

Maybe its too late, but I'll post here my solution in case it helps anyone. My SearchView is under app bar and always visible, but the excessive margin between the start of the view and the icon it's still present. My solution it's on the xml where the SearchView is declared, i just added:
android:layout_width="match_parent"
android:paddingStart="-5dp"

Custom layout in Toolbar with TabLayout below

Right now, I have a normal looking Toolbar. What I want to do is add a custom layout between the Toolbar and the TabLayout, as shown in the picture below:
On the left is what my Toolbar looks like now, and on the right is what I want it to look like.
As you can see, I want to add an ImageView and two TextViews to the layout.
How can I achieve this?
Here is my current layout:
<?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"
android:id="#+id/main_content"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.AppBarLayout
android:id="#+id/appbar"
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"
app:layout_collapseMode="pin"
app:layout_scrollFlags="scroll|enterAlways"
app:popupTheme="#style/AppTheme.PopupOverlay" />
<android.support.design.widget.TabLayout
android:id="#+id/tablayout"
android:layout_width="match_parent"
android:layout_height="48dp"
app:layout_scrollFlags="scroll|enterAlways" />
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
</android.support.design.widget.CoordinatorLayout>

AppBarLayout extends LinearLayout, so you can add any number of views to your AppBarLayout: there's no reason to add the views specifically to your Toolbar.
You'll want to make sure you use the same layout_scrollFlags as your Toolbar if you want them to scroll the same.

Toolbar is just a ViewGroup, you can customize is as much as you want.
Try this :
<android.support.v7.widget.Toolbar
style="#style/ToolBarStyle"
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?attr/colorPrimary"
android:minHeight="#dimen/abc_action_bar_default_height_material">
<ImageView
android:layout_width="wrap_content"
android:contentDescription="#string/logo"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:src="#drawable/ic_launcher"/>
This should bring your imageView in center of toolbar.

CollapsingToolbarLayout center TextView in Toolbar

I want toolbar_title layout center in toolbar, but itlooks like there is some margin on left, if I remove CollapsingToolbarLayout it is ok.
Inorder to center toolbar_title text I set toolbar_title's margin right manualy in code, but the only after the fragment resumed I toolbar_title.getX() can get the correct value, so I postDelayed 50 ms to do this.
now ther is the question:
how to center toolbar_title in CoordinatorLayout on a better way?
<android.support.design.widget.CoordinatorLayout
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"
xmlns:tools="http://schemas.android.com/tools">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.design.widget.CollapsingToolbarLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
app:expandedTitleMarginStart="?attr/actionBarSize"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<LinearLayout
android:id="#+id/layout_header"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#f5f5f5"
android:orientation="vertical"
app:layout_collapseMode="parallax">
</LinearLayout>
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
android:theme="#style/AppTheme.ToolBar"
app:layout_collapseMode="pin"
app:popupTheme="#style/AppTheme.PopupOverlay">
<TextView
android:id="#+id/toolbar_title"
style="#style/TextAppearance.AppCompat.Widget.ActionBar.Title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:textColor="#android:color/white"
android:textSize="18sp"
tools:text="title"/>
</android.support.v7.widget.Toolbar>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v7.widget.RecyclerView
android:id="#+id/swipe_container"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior"/>

You just need to add below attributes in your Toolbar.
app:contentInsetLeft="0dp"
app:contentInsetStart="0dp"
See similar thread on stackoverflow: Android API 21 Toolbar Padding
See title textview position before and after attributes adding in toolbar.
Before adding attributes:
After adding attributes:

View covering action toolbar?

I am trying to create a tool bar associated with an EditText on my scren. Below are the contents of my xml file that I am trying to create:
<?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"
xmlns:tool="http://schemas.android.com/tools"
tool:context=".CreatePost"
android:id="#+id/create_post">
<include layout="#layout/app_bar" android:layout_width="match_parent" android:layout_height="wrap_content"
android:id="#+id/create_post_toolbar"/>
<!-- Edit text for typing status. Light gray placeholder. -->
<EditText
android:layout_width="match_parent"
android:layout_height="match_parent"
android:textColorHint="#d3d3d3"
android:layout_below="#id/create_post_toolbar"
android:hint="Update your friends!"
android:padding="10dp"
android:gravity="top"
android:background="#android:color/transparent"
android:inputType="textMultiLine"
android:id="#+id/type_status"/>
</RelativeLayout>
app_bar.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=".CreatePost">
<android.support.design.widget.AppBarLayout android:layout_height="wrap_content"
android:layout_width="match_parent" android:theme="#style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar android:id="#+id/toolbar_universal"
android:layout_width="match_parent" android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary" app:popupTheme="#style/AppTheme.PopupOverlay" />
</android.support.design.widget.AppBarLayout>
</android.support.design.widget.CoordinatorLayout>
However, when I do this, my EditText covers my toolbar. Here is an image to show what happens:
I don't really understand why this is happening, is there anyway to align my EditText so it doesn't cover the toolbar? Thanks!
UPDATE: after adding in Arya's code into mine, my image looks like so, which makes the ActionBar too high. Any ideas on how to fix it?

Your layout, in its current definition, does not make much sense. I think the problem here is that the CoordinatorLayout has been assigned fitsSystemWindows=true. This makes it report its bottom from the very top of the status-bar. On the other hand, the RelativeLayout expects the bottom value from the bottom of the status-bar. This makes your EditText overlap the Toolbar by 25dp - the standard height of a status-bar. You can kind of confirm this by assigning android:fitsSystemWindows="true" to your RelativeLayout with id create_post. In this case, the bottom for CoordinatorLayout will be reported correctly, and the EditText will not overlap the Toolbar.
Usually, the CoordinatorLayout is set to be the parent, and the content (in your case the RelativeLayout) resides as a child of the CoordinatorLayout:
<?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=".CreatePost">
<android.support.design.widget.AppBarLayout
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:theme="#style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar_universal"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:popupTheme="#style/AppTheme.PopupOverlay" />
</android.support.design.widget.AppBarLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/create_post">
<EditText
android:layout_width="match_parent"
android:layout_height="match_parent"
android:textColorHint="#d3d3d3"
android:hint="Update your friends!"
android:padding="10dp"
android:gravity="top"
android:background="#android:color/transparent"
android:inputType="textMultiLine"
android:id="#+id/type_status"/>
</RelativeLayout>
</android.support.design.widget.CoordinatorLayout>
If you have a specific reason for placing the CoordinatorLayout inside a RelativeLayout, please do share.

<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/htab_maincontent"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/tabheader"
android:fitsSystemWindows="true">
<android.support.design.widget.AppBarLayout
android:id="#+id/htab_appbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fitsSystemWindows="true"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.v7.widget.Toolbar
android:id="#+id/htab_toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:minHeight="?attr/actionBarSize"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"/>
</android.support.design.widget.AppBarLayout>

<android.support.design.widget.AppBarLayout
android:layout_height="?attr/actionBarSize"
android:layout_width="match_parent"
android:theme="#style/AppTheme.AppBarOverlay">