So began researching how to create an action bar with an autocomplete text view for search. Most of the solutions I've found come close to what I'm looking for however they all seem to be focused on cramming any and additional views added to the action bar on one line.
Further complicating this, is the fact that this is all located in a view pager fragment whose parent activity already has an action bar. Thus using the setSupportingActionBar call with a Toolbar throws an illegal state exception.
Not sure if what I am accomplishing is actually supported but here it goes.
The end result I am looking for is this
Here is what I wrote
*custom view containing the autocomplete text view named autocomplete.xml *
<?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:orientation="vertical">
<AutoCompleteTextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/search_text_view"
android:paddingTop="15dp"
android:paddingBottom="15dp"
android:paddingLeft="20dp"
android:paddingRight="20dp"
android:drawableLeft="#drawable/ic_search_blue"
android:background="#drawable/white_edittext"/>
</LinearLayout>
here is the code in my fragment used to setup the action bar
private void initializeActionsBarWithAutocomplete(){
ActionBar actionBar = ((MyParentActivity) getActivity()).getSupportActionBar();
actionBar.setTitle(getResources().getString(R.string.default_title));
View autoCompleteView = LayoutInflater.from(getContext()).inflate(R.layout.autocomplete, null);
mSearchTextView = (AutoCompleteTextView) autoCompleteView.findViewById(R.id.search_text_view);
mSearchTextView.setAdapter(mTypeAheadAdapter);
mSearchTextView.setOnItemClickListener(this);
mSearchTextView.addTextChangedListener(this);
actionBar.setCustomView(autoCompleteView);
actionBar.setDisplayShowCustomEnabled(true);
actionBar.setDisplayShowTitleEnabled(true);
actionBar.setDisplayHomeAsUpEnabled(true);
}
What I end up getting is this
So assuming what I'm trying to do is possible, and I'm at least on the right track, what exactly is going wrong here. I assumed that having the custom view match parent would force the textview to take up its own line and expand the size of the action bar accordingly. That is clearly not the case. I looked at some articles that allowed you to set the height of the action bar explicitly but from what I can comprehend, that method will result in the same appearance with a bunch of white space under views in the action bar.
You can use Toolbar widget in XML and customize it as per your needs.
Here is an layout of Toolbar containing AutoCompleteTextView:
<android.support.design.widget.AppBarLayout
android:id="#+id/appBarLayout"
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="wrap_content"
android:background="?attr/colorPrimary"
app:layout_scrollFlags="scroll|enterAlways"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"
app:titleTextColor="#FFFFFF">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:paddingTop="20dp">
<TextView
android:id="#+id/toolbar_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="8dp"
android:text="#string/app_name"
android:textColor="#ffffff"
android:textSize="20sp"
android:textStyle="bold" />
<android.support.v7.widget.CardView
android:layout_width="match_parent"
android:layout_height="40dp"
android:layout_margin="8dp"
android:layout_centerInParent="true"
cardview:cardBackgroundColor="#ffffff"
cardview:cardCornerRadius="2dp"
cardview:cardElevation="0dp">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:focusable="true"
android:focusableInTouchMode="true">
<AutoCompleteTextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/search_text_view"
android:paddingTop="15dp"
android:paddingBottom="15dp"
android:paddingLeft="20dp"
android:paddingRight="20dp"
android:drawableLeft="#drawable/ic_search_blue"
android:background="#drawable/white_edittext"/>
</RelativeLayout>
</android.support.v7.widget.CardView>
</LinearLayout>
</android.support.v7.widget.Toolbar>
</android.support.design.widget.AppBarLayout>
In your JAVA code try this:
Toolbar mToolBar;
ActionBar mActionBar;
AutoCompleteTextView mSearchTextView;
private void initializeActionsBarWithAutocomplete(){
// ToolBar
mToolBar = (Toolbar) findViewById(R.id.toolbar);
// AutoCompleteTextView
mSearchTextView = (AutoCompleteTextView) mToolBar.findViewById(R.id.search_text_view);
mSearchTextView.setAdapter(mTypeAheadAdapter);
mSearchTextView.setOnItemClickListener(this);
mSearchTextView.addTextChangedListener(this);
setSupportActionBar(mToolBar);
// ActionBar
mActionBar = getSupportActionBar();
mActionBar.setTitle(getResources().getString(R.string.default_title));
mActionBar.setDisplayHomeAsUpEnabled(true);
}
OUTPUT:
Hope this will help~
Related
I am working on Android project and I've created a new Settings Activity from Android. When I created the activity, and tried running, it the Settings Activity that Android Studio created, didn't include an action bar for some reason. I googled around and found that it seems to be a common thing and add the action bar manually, so I've done the following:
private void setupActionBar()
{
getLayoutInflater().inflate(R.layout.toolbar, (ViewGroup)findViewById(android.R.id.content));
Toolbar toolbar = findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
ActionBar actionBar = getSupportActionBar();
if (actionBar != null)
{
// Show the Up button in the action bar.
actionBar.setDisplayHomeAsUpEnabled(true);
}
}
I found that the first preference header is hidden under the action bar, again Googled around, found you need to add padding to the list view which I did using the following in the onCreate()
getListView().setPadding(0, 180, 0, 0);
Doing the above seems a little odd, and it only works on the initial settings activity screen with the list of preference headers. Once you click on the preference headers to view the settings, the first setting is hidden under the action bar as shown in the screenshot below:
I think I figured it out.
I created a toolbar XML as below
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:local="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/settings_toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:minHeight="?attr/actionBarSize"
android:background="?attr/colorPrimary"
android:popupTheme="#style/ThemeOverlay.AppCompat.Light" />
Then in the SettingsActivity in the setupActionBar method as below:
private void setupActionBar()
{
ViewGroup rootView = (ViewGroup)findViewById(R.id.action_bar_root);
View view = getLayoutInflater().inflate(R.layout.settings_toolbar, rootView, false);
rootView.addView(view, 0);
Toolbar toolbar = (Toolbar)findViewById(R.id.settings_toolbar);
setSupportActionBar(toolbar);
ActionBar actionBar = getSupportActionBar();
if (actionBar != null) {
// Show the Up button in the action bar.
actionBar.setDisplayHomeAsUpEnabled(true);
}
}
I suggest to remove your Action Bar and make a custom toolbar which will be described by other layout file and will contain a widget that cancels your current activity.
For example:
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/relLayout1">
<include layout="#layout/snippet_comments_toolbar"/>
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/relLayout2"
android:layout_below="#+id/relLayout1"
android:layout_marginBottom="60dp">
<ListView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/listView"></ListView>
</RelativeLayout>
and then snippet_comments_toolbar which is that toolbar I am talking about:
<merge xmlns:android="http://schemas.android.com/apk/res/android"
>
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="50dp"
android:background="#drawable/white_grey_border_bottom"
>
<android.support.v7.widget.Toolbar
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/profileToolBar">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:layout_width="30dp"
android:layout_height="30dp"
android:layout_marginEnd="20dp"
android:layout_centerVertical="true"
android:id="#+id/backArrow"
android:src="#drawable/ic_backarrow"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Comments"
android:layout_toRightOf="#+id/backArrow"
android:layout_marginRight="15dp"
android:textSize="20sp"
android:textColor="#color/black"
android:layout_centerVertical="true"
android:id="#+id/tvNext"
/>
</RelativeLayout>
</android.support.v7.widget.Toolbar>
</android.support.design.widget.AppBarLayout>
</merge>
I'm trying to display my toolbar title in the center and to do it I use the method which is given in this answer :-Toolbar Center title
However, when I enable back button in my activity by following code:
toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
mActionBar = getSupportActionBar();
mActionBar.setDisplayHomeAsUpEnabled(true);
mActionBar.setDisplayShowHomeEnabled(true);
The title of toolbar doesn't show up in the center but slightly off-centered towards the right.
How can I achieve centered title without being affected by the back button or menu bar?
Add a TextView inside the Toolbar & don't forget to set the following attribute inside your TextView.
android:layout_marginRight="?android:attr/actionBarSize"
OR
android:layout_marginEnd="?android:attr/actionBarSize"
code snippet:
<android.support.v7.widget.Toolbar
android:id="#+id/custom_toolbar"
android:layout_width="match_parent"
android:layout_height="?android:attr/actionBarSize"
android:background="#android:color/holo_red_dark">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="abc"
android:textColor="#android:color/white"
android:textSize="20sp"
android:layout_marginRight="?android:attr/actionBarSize"
android:gravity="center"/>
</android.support.v7.widget.Toolbar>
Refer to this tutorial for more information.
Having a placeholder image the same size as the back arrow and setting it to be invisible when the back arrow is not shown and gone when it's displayed did the trick for me.
<?xml version="1.0" encoding="utf-8"?>
<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="#color/blue"
android:minHeight="?attr/actionBarSize"
app:contentInsetEnd="0dp"
app:contentInsetLeft="0dp"
app:contentInsetRight="0dp"
app:contentInsetStart="0dp"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"
app:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<ImageView
android:id="#+id/iv_placeholder"
android:layout_width="72dp"
android:layout_height="48dp"
android:src="#drawable/ic_actionbar_hamburger"
android:visibility="invisible"/>
<TextView
android:id="#+id/logo_tv"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginEnd="?attr/actionBarSize"
android:gravity="center"
android:text=""
android:textColor="#color/white"
android:textStyle="normal"/>
</android.support.v7.widget.Toolbar>
Just add android:paddingEnd="72dp; to the Toolbar layout.
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?android:attr/actionBarSize"
app:contentScrim="#color/colorPrimary"
app:layout_collapseMode="pin"
android:paddingEnd="72dp"
app:popupTheme="#style/ThemeOverlay.AppCompat.Dark"
app:title="Title"/>
Just put your content in a child view inside the Toolbar tag in XML, using the following attributes:
android:layout_width="wrap_content"
android:layout_gravity="center"
Offical docs for Toolbar state:
One or more custom views. The application may add arbitrary child views to the Toolbar. They will appear at this position within the layout. If a child view's LayoutParams indicates a Gravity value of Gravity#CENTER_HORIZONTAL the view will attempt to center within the available space remaining in the Toolbar after all other elements have been measured.
This works for me, using androidx.appcompat.widget.Toolbar with a child view.
The reason why the title is not centered when you use a back button as navigation icon, is that navigation icon is represented as AppCompatImageButton and is added to the same layout as your title TextView. Using Arshak's answer is not a bad idea, but ?android:attr/actionBarSize is not a good way to define the end margin. As the action bar height is probably the same size as icon's width, it might work, but might not work on all devices. Could be a good idea to specify this size from material design guidelines.
In my case I was using an imageview inside the toolbar which I didnt want shifting around while navigating between fragments of a activity.
I kept it centered by placing it out the toolbar. I used constraintlayouts
<androidx.constraintlayout.widget.ConstraintLayout
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/container"
android:layout_width="match_parent"
android:layout_height="match_parent">
<com.google.android.material.appbar.MaterialToolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
</com.google.android.material.appbar.MaterialToolbar>
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintTop_toTopOf="#id/toolbar"
app:layout_constraintBottom_toBottomOf="#id/toolbar"
android:src="#drawable/ic_logo"
tools:ignore="ContentDescription" />
...
</androidx.constraintlayout.widget.ConstraintLayout>
I think the nicest and most up-to-date method is to have full control over the appbar. This way you can change other things from textview location.
<androidx.appcompat.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:title="#string/app_name"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/app_name"
android:textSize="20dp"
android:textColor="?attr/colorPrimary"
android:layout_centerInParent="true"
android:layout_marginEnd="20dp"/>
</RelativeLayout>
</androidx.appcompat.widget.Toolbar>
You can use this directly inside your activity. However, you may need to change the active toolbar by making such a definition in the activity where you added this toolbar.
Toolbar toolbar = findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
Dont set propterties like this
mActionBar = getSupportActionBar();
mActionBar.setDisplayHomeAsUpEnabled(true);
mActionBar.setDisplayShowHomeEnabled(true);
Do like this
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
// Title and subtitle
toolbar.setTitle(R.string.about_toolbar_title);
toolbar.setSubtitleTextColor(Color.WHITE);
toolbar.setTitleTextColor(Color.WHITE);
toolbar.setBackgroundColor(getResources().getColor(
R.color.themeToolbarColor));
toolbar.setNavigationIcon(R.drawable.ic_action_back);
toolbar.setNavigationOnClickListener(new OnClickListener() {
#Override
public void onClick(View v) {
finish(); // to go back finish() will do your work.
//mActionBar.setDisplayHomeAsUpEnabled(true);
//mActionBar.setDisplayShowHomeEnabled(true);
}
});
I have an appCompatActivity with a supportActionBar similar to whatsApp chat screen interface. Having been able to customise the actionbar with all the necessary components, I am not not able to apply padding/margin of any sort on the leftmost up/back button. However, with rest of the items I set up in the toolbar are aligned properly.
Here is how my layout of the activity looks like:
<RelativeLayout 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/relMainLayout"
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/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"
app:layout_scrollFlags="scroll|enterAlways">
<de.hdodenhof.circleimageview.CircleImageView
android:id="#+id/avatar"
android:layout_width="#dimen/action_bar_avatar_size"
android:layout_height="#dimen/action_bar_avatar_size"/>
<TextView
android:id="#+id/txtUserName"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textSize="20dp"
android:textAppearance="#style/TextAppearance.AppCompat.Body1"/>
</android.support.v7.widget.Toolbar>
</android.support.design.widget.AppBarLayout>
...
In the activity:
mImageViewAvatar = (ImageView) findViewById(R.id.avatar);
mTextViewUserName = (TextView) findViewById(R.id.txtUserName);
final Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
getSupportActionBar().setDisplayShowTitleEnabled(false);
mImageViewAvatar.setBackgroundImage(Contacts.getImage());
mTextViewUserName.setText(recipientId);
I have tried to set my layout_marginLeft to a negative value as well to the image even, it does not move to left. How do I apply margin/padding alignments to only this toolbar? Not the toolbar used in the application.
I guess you're looking for app:contentInsetLeft respectively app:contentInsetStart. Setting these attributes to 0dp will remove the padding - see the following two screenshots:
Without explicity setting contentInset:
Setting contentInset to 0dp
Please note: This won't work if you're using getSupportActionBar().setDisplayHomeAsUpEnabled(true) since the drawable which will be used by the system has a padding which can't be removed. See the following Screenshot:
So if you're trying to achieve the same as WhatsApp you have to use your own "back-button" drawable and add it to your Toolbar layout.
Edit
That's how I would do it:
*.xml
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
android:elevation="4dp"
app:contentInsetLeft="0dp"
app:contentInsetStart="0dp"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light">
<LinearLayout
android:id="#+id/layout_back_button"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:background="?attr/selectableItemBackgroundBorderless"
android:gravity="center_vertical">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_action_arrow_back" />
<ImageView
android:layout_width="40dp"
android:layout_height="40dp"
android:src="#drawable/avatar" />
</LinearLayout>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="8dp"
android:text="StackOverflow"
android:textAppearance="#style/TextAppearance.AppCompat.Body1"
android:textSize="20dp" />
</android.support.v7.widget.Toolbar>
Java code
Toolbar tb = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(tb);
getSupportActionBar().setTitle(null);
View view = findViewById(R.id.layout_back_button);
view.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
onBackPressed();
}
});
Result:
Notice that I wrapped the back button drawable and the avatar in an extra layout, which has the selectableItemBackgroundBorderless set as the background. Due that we achieve this ripple effect like in WhatsApp.
I am using the new appcompat Toolbar as an actionbar. I want to use menu items with android:showAsAction="ifRoom" but I would also like to have buttons below the Toolbar which are part of the Toolbar layout. Not menu items but buttons and textviews I add myself. Hope that makes sense. Anyways how do I go about doing that? ideally the entire second row would have only my items whereas the top row would have the menu items.
Thanks.
EDIT: here is what I am talking about:
<android.support.v7.widget.Toolbar
android:id="#+id/my_awesome_toolbar"
android:layout_height="128dp"
android:layout_width="match_parent"
android:minHeight="?attr/actionBarSize"
android:background="?attr/colorPrimary">
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<EditText
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:hint="should extend full width" />
</RelativeLayout>
</android.support.v7.widget.Toolbar>
Ends up looking like this:
This is not actually possible what you are saying to customize toolbar like that, as menu is controlled by system you cant handle that.
But you can do a workaround to achieve same effect like this,
<android.support.v7.widget.Toolbar
android:id="#+id/my_awesome_toolbar"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:minHeight="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"
app:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
</android.support.v7.widget.Toolbar>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:orientation="horizontal"
android:paddingLeft="5dp"
android:paddingRight="5dp"
android:background="?attr/colorPrimary">
<EditText
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:textColor="#android:color/white"
android:hint="Hello" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:text="Button"/>
</LinearLayout>
<!--Other layout-->
Or wrap toolbar and linear layout in another linear layout to bind them togather.
It Should solve your purpose!
You can always use reflection to do it:
Toolbar toolbar = findViewById(R.id.my_awesome_toolbar);
toolbar.setTitle("A really long title here to make sure we wrap text.");
Field mTitleTextViewField = null;
try {
mTitleTextViewField = Toolbar.class.getDeclaredField("mTitleTextView");
mTitleTextViewField.setAccessible(true);
TextView mTitleTextView = (TextView)mTitleTextViewField.get(toolbar);
mTitleTextView.setSingleLine(false);
mTitleTextView.setMaxLines(2);
} catch (NoSuchFieldException e) {
e.printStackTrace();
} catch (IllegalAccessException e) {
e.printStackTrace();
}
I am attempting to show both a title, using setTitle and a custom view in my toolbar.
I am not treating it as an actionbar, instead as nothing more than a view.
I am adding both the titles and custom view in Java
toolbar = (Toolbar) view.findViewById(R.id.toolbar);
if (title != null) {
toolbar.setTitle(title);
toolbar.setTitleTextColor(getResources().getColor(android.R.color.white));
}
if (subtitle != null) {
toolbar.setSubtitle(subtitle);
toolbar.setSubtitleTextColor(getResources().getColor(android.R.color.white));
}
// Add switch view to toolbar
View switchView = LayoutInflater.from(getActivity())
.inflate(R.layout.device_list_switch, null);
toolbar.addView(switchView);
The xml for my switch view is
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#android:color/holo_blue_bright">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/discoverable"
android:layout_alignParentBottom="true"
android:layout_alignTop="#+id/discoverable"
android:layout_toLeftOf="#+id/discoverable"
android:layout_toStartOf="#+id/discoverable"
android:gravity="center"
android:text="#string/discoverable_switch_label"
android:textColor="#android:color/white"
/>
<Switch
android:id="#+id/discoverable"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"
android:layout_marginLeft="#dimen/discoverable_switch_margin_left"
android:layout_marginStart="#dimen/discoverable_switch_margin_left"/>
</RelativeLayout>
What happens is that the RelativeLayout fills the entire toolbar area and the title isn't visible.
Any ideas?
If you are not using the Toolbar as an ActionBar, then maybe you could just use a layout.
I used a LinearLayout instead of a Toolbar.
What advantages is Toolbar giving you?
This can be solved by adding your own title (and subtitle, if you need it) text views inside the toolbar alongside your custom view.
But perhaps a better way is to use a second toolbar nested inside the first. That way, all formatting is taken care of for you.
<android.support.v7.widget.Toolbar xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/topToolbar"
android:layout_alignParentTop="true"
android:layout_height="wrap_content"
android:layout_width="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<android.support.v7.widget.Toolbar xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/titleToolbar"
android:layout_width="wrap_content"
android:layout_height="match_parent"
app:contentInsetStart="0dp"
app:contentInsetLeft="0dp">
</android.support.v7.widget.Toolbar>
<CustomView... />
</LinearLayout>
</android.support.v7.widget.Toolbar>