Does anybody know how to set padding between the ActionBar's home icon and the title?
EDIT: make sure you set this drawable as LOGO, not as your app icon like some of the commenters did.
Just make an XML drawable and put it in the resource folder "drawable" (without any density or other configuration).
<?xml version="1.0" encoding="utf-8"?>
<layer-list
xmlns:android="http://schemas.android.com/apk/res/android" >
<item
android:drawable="#drawable/my_logo"
android:right="10dp"/>
</layer-list>
The last step is to set this new drawable as logo in your manifest (or on the Actionbar object in your activity)
Good luck!
I adapted Cliffus answer and assigned the logo-drawable in my actionbar style definition, for instance like this in res/style.xml:
<item name="android:actionBarStyle">#style/MyActionBar</item>
<style name="MyActionBar" parent="#android:style/Widget.Holo.Light.ActionBar">
<item name="android:background">#3f51b5</item>
<item name="android:titleTextStyle">#style/ActionBar.TitleText</item>
<item name="android:textColor">#fff</item>
<item name="android:textSize">18sp</item>
<item name="android:logo">#drawable/actionbar_space_between_icon_and_title</item>
</style>
The drawable looks like Cliffus' one (here with the default app launcher icon) in res/drawable/actionbar_space_between_icon_and_title.xml:
<?xml version="1.0" encoding="utf-8"?>
<layer-list
xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:drawable="#drawable/ic_launcher"
android:right="20dp"/>
</layer-list>
In the android_manifest.xml you can still set a different app icon (launcher icon on 'desktop'. Any different logo definition here are visible in activities without an action bar.
I also faced a similar issue, in my case I had to set titles dynamically on each activity depending on the content.
So this worked for me.
actionBar.setTitle(" " + yourActivityTitle);
If all you want is the spacing, this is the easiest solution I could think of.
This is how I was able to set the padding between the home icon and the title.
ImageView view = (ImageView)findViewById(android.R.id.home);
view.setPadding(left, top, right, bottom);
I couldn't find a way to customize this via the ActionBar xml styles though. That is, the following XML doesn't work:
<style name="ActionBar" parent="android:style/Widget.Holo.Light.ActionBar">
<item name="android:titleTextStyle">#style/ActionBarTitle</item>
<item name="android:icon">#drawable/ic_action_home</item>
</style>
<style name="ActionBarTitle" parent="android:style/TextAppearance.Holo.Widget.ActionBar.Title">
<item name="android:textSize">18sp</item>
<item name="android:paddingLeft">12dp</item> <!-- Can't get this padding to work :( -->
</style>
However, if you are looking to achieve this through xml, these two links might help you find a solution:
https://github.com/android/platform_frameworks_base/blob/master/core/res/res/values/styles.xml
(This is the actual layout used to display the home icon in an action bar)
https://github.com/android/platform_frameworks_base/blob/master/core/res/res/layout/action_bar_home.xml
This is a common question in Material Design as you may want to line your toolbars title with the content in the fragment below. To do this, you can override the default padding of "12dp" by using the attribute contentInsetStart="72dp" in your toolbar.xml layout as shown below
toolbar.xml
<?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/app_theme_color"
app:contentInsetStart="72dp"/>
Then in your activity, call
Toolbar toolbar = (Toolbar) activity.findViewById(R.id.toolbar);
toolbar.setTitle("Title Goes Here");
And you end up with this:
If you are using toolbar from AppCompat (android.support.v7.widget.Toolbar, >= revision 24, June 2016), the padding between the icon and the title can be changed with the following value :
app:contentInsetStartWithNavigation="0dp"
To improve my answer, you can use it on your toolbar directly inside your activity or you can create a new layout file for your toolbar. In this case, you just have to import your toolbar's #id using the include property on each needed views.
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:elevation="4dp"
app:contentInsetLeft="0dp"
app:contentInsetStart="0dp"
app:contentInsetStartWithNavigation="0dp">
</android.support.v7.widget.Toolbar>
You can then import your layout on your activity.xml
<include
layout="#layout/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
For me only the following combination worked, tested from API 18 to 24
app:contentInsetLeft="0dp"
app:contentInsetStart="0dp"
app:contentInsetStartWithNavigation="0dp"
where in "app" is : xmlns:app="http://schemas.android.com/apk/res-auto"
for example.
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#color/SE_Life_Green"
app:contentInsetLeft="0dp"
app:contentInsetStart="0dp"
app:contentInsetStartWithNavigation="0dp"
>
.......
.......
.......
</android.support.v7.widget.Toolbar>
Using titleMarginStart works for me. Xamarin example:
<android.support.v7.widget.Toolbar
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/toolbar"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:minHeight="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:titleMarginStart="24dp"/>
Set the logo like so:
mToolbar = FindViewById<SupportToolbar>(Resource.Id.toolbar);
SetSupportActionBar(mToolbar);
SupportActionBar.SetLogo(Resource.Drawable.titleicon32x32);
SupportActionBar.SetDisplayShowHomeEnabled(true);
SupportActionBar.SetDisplayUseLogoEnabled(true);
SupportActionBar.Title = "App title";
I used \t before the title and worked for me.
Im using a custom image instead of the default title text to the right of my apps logo. This is set up programatically like
actionBar.setDisplayHomeAsUpEnabled(true);
actionBar.setDisplayUseLogoEnabled(true);
actionBar.setCustomView(R.layout.include_ab_txt_logo);
actionBar.setDisplayShowCustomEnabled(true);
The issues with the above answers for me are #Cliffus's suggestion does not work for me due to the issues others have outlined in the comments and while #dushyanth programatic padding setting may have worked in the past I would think that the fact that the spacing is now set using android:layout_marginEnd="8dip" since API 17 manually setting the padding should have no effect. See the link he posted to git to verify its current state.
A simple solution for me is to set a negative margin on my custom view in the actionBar, like so android:layout_marginLeft="-14dp". A quick test shows it works for me on 2.3.3 and 4.3 using ActionBarCompat
Hope this helps someone!
I solved this problem by using custom Navigation layout
Using it you can customize anything in title on action bar:
build.gradle
dependencies {
compile 'com.android.support:appcompat-v7:21.0.+'
...
}
AndroidManifest.xml
<application
android:icon="#drawable/ic_launcher"
android:label="#string/app_name">
<activity
android:name=".MainActivity"
android:theme="#style/ThemeName">
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
</application>
styles.xml
<style name="ThemeName" parent="Theme.AppCompat.Light">
<item name="actionBarStyle">#style/ActionBar</item>
<item name="android:actionBarStyle" tools:ignore="NewApi">#style/ActionBar</item>
<style name="ActionBar" parent="Widget.AppCompat.ActionBar">
<item name="displayOptions">showCustom</item>
<item name="android:displayOptions" tools:ignore="NewApi">showCustom</item>
<item name="customNavigationLayout">#layout/action_bar</item>
<item name="android:customNavigationLayout" tools:ignore="NewApi">#layout/action_bar</item>
<item name="background">#color/android:white</item>
<item name="android:background">#color/android:white</item>
action_bar.xml
<?xml version="1.0" encoding="utf-8"?>
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/action_bar_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center_vertical"
android:drawableLeft="#drawable/ic_launcher"
android:drawablePadding="10dp"
android:textSize="20sp"
android:textColor="#android:color/black"
android:text="#string/app_name"/>
I had a similar issue but with spacing between the up and the custom app icon/logo in the action bar. Dushyanth's solution of setting padding programatically worked for me (setting padding on app/logo icon). I tried to find either android.R.id.home or R.id.abs__home (ActionBarSherlock only, as this ensures backwards compatibility), and it seems to work across 2.3-4.3 devices I've tested on.
For my case, it was with Toolbar i resolved it like this:
ic_toolbar_drawble.xml
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:drawable="#drawable/ic_toolbar"
android:right="-16dp"
android:left="-16dp"/>
</layer-list>
In my Fragment, i check the api :
if (android.os.Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP)
toolbar.setLogo(R.drawable.ic_toolbar);
else
toolbar.setLogo(R.drawable.ic_toolbar_draweble);
Good luck!
You can change drawableSize of your DrawerArrow like this:
<style name="MyTheme" parent="android:Theme.WithActionBar">
<item name="drawerArrowStyle">#style/DrawerArrowStyle</item>
</style>
<style name="DrawerArrowStyle" parent="Widget.AppCompat.DrawerArrowToggle">
<item name="barLength">24dp</item>
<item name="arrowShaftLength">24dp</item>
<item name="arrowHeadLength">10dp</item>
<item name="drawableSize">42dp</item> //this is your answer
</style>
It isn't correct answer, because you can't choose padding side and DrawerArrow icon scaling when change drawableSize (drawableSize = width = height). But you can margin from left. To margin from right do
findViewById(android.R.id.home).setPadding(10, 0, 5, 0);
I used this method setContentInsetsAbsolute(int contentInsetLeft, int contentInsetRight) and it works!
int padding = getResources().getDimensionPixelSize(R.dimen.toolbar_content_insets);
mToolbar.setContentInsetsAbsolute(padding, 0);
When you are using a custom Toolbar, you can use
toolbar = (Toolbar) findViewById(R.id.toolbar);
toolbar.setTitle(R.string.activity_title);
setSupportActionBar(toolbar);
getSupportActionBar().setLogo(R.drawable.logo);
and in your toolbar layout simply set app:titleMarginStart="16dp"
Note that you have to set the icon as a logo, don't use getSupportActionBar().setIcon(R.drawable.logo)
instead use:
getSupportActionBar().setLogo(R.drawable.logo)
I used AppBarLayout and custom ImageButton do to so.
<android.support.design.widget.AppBarLayout
android:id="#+id/appbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:elevation="0dp"
android:background="#android:color/transparent"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:layout_width="32dp"
android:layout_height="32dp"
android:src="#drawable/selector_back_button"
android:layout_centerVertical="true"
android:layout_marginLeft="8dp"
android:id="#+id/back_button"/>
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"/>
</RelativeLayout>
</android.support.design.widget.AppBarLayout>
My Java code:
findViewById(R.id.appbar).bringToFront();
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
final ActionBar ab = getSupportActionBar();
getSupportActionBar().setDisplayShowTitleEnabled(false);
You can achieve same by method as well:
Drawable d = new InsetDrawable(getDrawable(R.drawable.nav_icon),0,0,10,0);
mToolbar.setLogo(d);
In your XML, set the app:titleMargin in your Toolbar view as following:
<androidx.appcompat.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:titleMarginStart="16dp"/>
Or in your code:
toolbar.setTitleMargin(16,16,16,16); // start, top, end, bottom
Just include:
app:titleMargin="10dp"
Within your xml file, like:
<androidx.appcompat.widget.Toolbar
android:id="#+id/tbrMain"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:titleMargin="10dp"
android:minHeight="?attr/actionBarSize"
android:theme="?attr/actionBarTheme" />
this work for me to add padding to the title and for ActionBar icon i have set that programmatically.
getActionBar().setTitle(Html.fromHtml("<font color='#fffff'> Boat App </font>"));
<string name="app_name">" "Brick Industry</string>
Just add " " for your app name
It will add space between icon and title
Related
I have the following searchView component:
The current style is:
<style name="CustomToolbarStyle" parent="Theme.AppCompat.Light.NoActionBar">
<item name="actionOverflowButtonStyle">#style/OverFlow</item>
<item name="android:background">#20202A</item>
</style>
and the current XML for the toolbar is:
<android.support.v7.widget.Toolbar
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:theme="#style/CustomToolbarStyle"
app:titleTextColor="#FFF"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:configChanges="orientation"
android:screenOrientation="portrait"
app:collapseIcon="#drawable/returnwhite"
app:popupTheme="#style/CustomPopupStyle"
app:navigationIcon="#drawable/returnwhite"
>
</android.support.v7.widget.Toolbar>
When I long click on the searchView, the cursor becomes as following:
I want to make it transparent, obviously.
you most set a transparent color to background in xml like below:
android:background="#00000000"
it also used to remove below line of edittext and spinner
so I had finally found out the solution to do so.
I had to remove this portion <item name="android:background">#20202A</item>
and put android:background="#color/topBar" in the XML of the the toolbar
I want to change the background color of the overflow popup menu to match the background of the main screen. Does anyone know how I could do that?
Thanks.
If you are using a Toolbar, first you need to add this line to your toolbar layout:
app:popupTheme="#style/ThemeOverlay.MyTheme"
It should look like this:
<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="?attr/actionBarSize"
android:minHeight="?attr/actionBarSize"
android:background="#color/primary"
app:titleTextColor="#color/white"
app:layout_scrollFlags="scroll|enterAlways"
app:popupTheme="#style/ThemeOverlay.MyTheme"/>
You need to use that line to tell your Toolbar which theme to use. Then, you add the following theme to your styles.xml file:
<style name="ThemeOverlay.MyTheme" parent="ThemeOverlay.AppCompat.Light">
<item name="android:colorBackground">#color/primary</item>
<item name="android:textColor">#color/white</item>
</style>
In the place I put "#color/primary" and "#color/white", you can use any color you want, and you can also put hex values like #000000.
I am trying as best I can to style the ActionBar (i.e. an android.support.v7.widget.Toolbar) in my app, but it just won't work. I am following the official documentation when trying to achieve this. What I am really trying to do is to make the title color white. It is currently displayed in black. My target API is 11.
What am I doing wrong?
res/values/themes.xml
<resources>
<!-- Base theme applied no matter what API -->
<style name="MMTheme.Base" parent="Theme.AppCompat.Light">
<item name="windowNoTitle">true</item>
<item name="windowActionBar">false</item>
<item name="android:textColor">#color/mm_dark_gray</item>
<item name="colorPrimary">#color/mm_brown</item>
<item name="colorPrimaryDark">#color/mm_dark_gray</item>
<item name="colorAccent">#color/mm_green</item>
<item name="android:actionBarStyle">#style/MMActionBar</item>
<item name="android:actionBarTabTextStyle">#style/MMActionBarTabText</item>
<item name="android:actionMenuTextColor">#color/mm_green</item>
<!-- Support library compatibility -->
<item name="actionBarStyle">#style/MMActionBar</item>
<item name="actionBarTabTextStyle">#style/MMActionBarTabText</item>
<item name="actionMenuTextColor">#color/mm_green</item>
</style>
<style name="MMTheme" parent="MMTheme.Base"></style>
<!-- ActionBar style -->
<style name="MMActionBar" parent="#style/Widget.AppCompat.ActionBar">
<item name="android:background">#color/mm_green</item>
<item name="android:titleTextStyle">#style/MMActionBarTitleText</item>
<!-- Support library compatibility -->
<item name="titleTextStyle">#style/MMActionBarTitleText</item>
</style>
<!-- ActionBar title text -->
<style name="MMActionBarTitleText" parent="#style/TextAppearance.AppCompat.Widget.ActionBar.Title">
<item name="android:textColor">#color/mm_white</item>
<!-- The textColor property is backward compatible with the Support Library -->
</style>
<!-- ActionBar tabs text -->
<style name="MMActionBarTabText" parent="#style/Widget.AppCompat.ActionBar.TabText">
<item name="android:textColor">#color/mm_green</item>
<!-- The textColor property is backward compatible with the Support Library -->
</style>
</resources>
The inflated android.support.v7.widget.Toolbar
<android.support.v7.widget.Toolbar
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/mm_toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:minHeight="?attr/actionBarSize"/>
In the Activity
// Setup main Toolbar
Toolbar toolbar = (Toolbar) mInflatedActivity.findViewById(R.id.mm_toolbar);
setSupportActionBar(toolbar);
getSupportActionBar().setIcon(R.drawable.ic_launcher);
I have tried everything I can think of and searched a lot online, but I cannot make it work. What am I missing?
Current result is (nevermind the search icon):
Adding style="#style/MMActionBar" to the xml properties of the android.support.v7.widget.Toolbar results in this:
Changing main parent theme to Theme.AppCompat.Light.DarkActionBar does nothing.
Just use this in yout layout xml
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#color/red600"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"
app:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar" />
Set theme in xml itself to ThemeOverlay.AppCompat.Dark.ActionBar which will make title text white.
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"
app:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
And I guess this is the right way to theme Toolbar, since according to official Android Developer blog
Styling of Toolbar is done differently to the standard action bar, and
is set directly onto the view.
Here's a basic style you should be using when you're using a Toolbar
as your action bar:
<android.support.v7.widget.Toolbar
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:minHeight="?attr/actionBarSize"
app:theme="#style/ThemeOverlay.AppCompat.ActionBar" />
The app:theme declaration will make sure that your text and items are
using solid colors (i.e 100% opacity white).
I have faced same problem. The following solution solved my problem.
For this you need to make changes at two places.
1.Modify your toolbar xml like this,
<android.support.v7.widget.Toolbar
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:background="#color/ColorPrimary"
android:elevation="2dp"
xmlns:android="http://schemas.android.com/apk/res/android" >
<TextView
android:id="#+id/TV_tool_bar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="My App Name"
android:textSize="18sp"
android:textColor="#FFFFFF"/>
</android.support.v7.widget.Toolbar>
Modify like this in your activity file.
Toolbar toolbar = (Toolbar) findViewById(R.id.tool_bar);
setSupportActionBar(toolbar);
getSupportActionBar().setTitle(null);
Thats it. This will make your title color white. Cheers..!
Use this to change colors of the letters on the toolbar:
<android.support.v7.widget.Toolbar
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/ColorPrimary"
android:theme="#style/ThemeOverlay.AppCompat.Dark"
android:elevation="4dp"
>
</android.support.v7.widget.Toolbar>
I'm having a problem trying to center the back button on the support toolbar.
I'm using it inside an ActionBarActivity.
<android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:toolbar="http://schemas.android.com/apk/res-auto"
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?attr/colorPrimary"
android:minHeight="?attr/actionBarSize"
toolbar:popupTheme="#style/ThemeOverlay.AppCompat.Light"
toolbar:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar" />
And set the up navigation inside the Activity's onCreate() like this:
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
getSupportActionBar().setTitle(R.string.title_activity_scanner);
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
However, what I'm getting is this:
As you can see the back button is misplaced
Edit:
The problem seems to lie in a custom value for ?attr/actionBarSize set to 40dp, however, it turns out now, that it's the title that is misplaced instead.
From the developer.android.com :
Toolbar supports a more focused feature set than ActionBar. From start
to end, a toolbar may contain a combination of the following optional
elements:
A navigation button. This may be an Up arrow, navigation menu toggle,
close, collapse, done or another glyph of the app's choosing. This
button should always be used to access other navigational destinations
within the container of the Toolbar and its signified content or
otherwise leave the current context signified by the Toolbar. The
navigation button is vertically aligned within the Toolbar's minimum
height, if set.
So if you set minHeight attribute the same as your toolbar height (layout_height ), the back arrow will be centered vertically.
(2020)
In case you have a non-standard toolbar height, to center the back button nowadays (2k20) with androidx Toolbar you can just use the buttonGravity property.
This allows you to use wrap_content instead of a specific height (minHeight doesn't allow you to do so):
<androidx.appcompat.widget.Toolbar
app:buttonGravity="center_vertical"
android:layout_height="wrap_content"
... />
Inside ActionBarActivity
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
getSupportActionBat().setTitle("Hello World");
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
getSupportActionBar().setHomeButtonEnabled(true);
Layout code :
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#color/primary"
app:theme="#style/ToolbarTheme"
app:popupTheme="#style/Theme.AppCompat"/>
And style :
<style name="AppTheme.Base" parent="Theme.AppCompat.Light">
<item name="colorPrimary">#color/primary</item>
<item name="colorPrimaryDark">#color/primaryDark</item>
<item name="android:windowNoTitle">true</item>
<item name="android:windowActionBar">false</item>
<item name="windowActionBar">false</item>
</style>
<style name="AppTheme" parent="AppTheme.Base">
Remember that toolbar is just viewgroup, so u can style it in any way u like.
Here is image link : Toolbar sample
Hope it helps.
Best way to achieve this is remove regular Back button from the toolbar and add a custom ImageButton in your XML layout and set image to it. You can place this ImageButtton wherever you want on the toolbar.
Your activity layout code should be something like this.
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<include
android:id="#+id/toolbar"
layout="#layout/toolbar" />
<ImageButton
android:layout_width="60dp"
android:layout_height="60dp"
android:id="#+id/button"
android:src="#drawable/attach_icon"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true" />
</RelativeLayout>
For me, none of the solutions worked. In my case the problem was the margin I applied:
<android.support.v7.widget.Toolbar
android:layout_width="match_parent"
android:layout_height="wrap_content"
... >
<View
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="10dp"
android:layout_marginTop="10dp" />
</android.support.v7.widget.Toolbar>
After applying it to the toolbar directly, the button was centered vertically:
<android.support.v7.widget.Toolbar
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="10dp"
android:layout_marginTop="10dp"
... >
<View
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</android.support.v7.widget.Toolbar>
Piggybacking off of #Rick Sanchez answer - if you know the size of the Toolbar's minHeight attribute you can then use:
android:gravity="top"
app:titleMarginTop="#dimen/margin_to_center"
in the Toolbar to center the text. If you are using android:minHeight="?actionBarSize" then this would be about 13p
#Rick Sanchez answer is work,setup Toolbar's layout_height the same as minHeight
I found in Toolbar constructor have a field can setup button gravity,
mButtonGravity = a.getInteger(R.styleable.Toolbar_buttonGravity, Gravity.TOP);
,but v7 support Toolbar can not setup,
mButtonGravity = Gravity.TOP;
make your button size 56dp and set scaleType to center with no margins on Appbar
Make sure your icon is 24x24 dimensions
I was using
<style name="MyActionBar" parent="#style/Widget.AppCompat.ActionBar">
when I should've been using
<style name="MyActionBar" parent="#style/Widget.AppCompat.Toolbar">
I am trying to change the font of the toolbar's title.
Here is my toolbar layout:
<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_height="wrap_content"
android:layout_width="match_parent"
android:minHeight="?attr/actionBarSize"
android:background="#666666"
app:titleTextAppearance="#style/MyText"
app:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"/>
And in my styles.xml
<style name="MyText">
<item name="fontPath">fonts/myFont.ttf</item>
</style>
If I do not set app:titleTextAppearance, the toolbar uses the system font. When I set it, the font gets smaller, but it is still in the system font. Am I doing something wrong?
Any suggestion, comments or answers much appreciated.
Edit:
I tried moving the style to styles-text.xml but no luck
Edit2:
For now, I am using a SpannableString and TypefaceSpan to make this work. Hope it helps someone.
This works:
<android.support.v7.widget.Toolbar
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_height="wrap_content"
android:layout_width="match_parent"
app:titleTextAppearance="#style/ActionBarTitleStyle"/>
Then have this in your styles.xml
<style name="ActionBarTitle" parent="android:Widget.TextView">
<!-- The action bar title font -->
<item name="android:fontFamily">sans-serif-light</item>
<!-- Customizes the color of the action bar title-->
<item name="android:textColor">#FF0000</item>
<!-- Customizes the size of the action bar title-->
<item name="android:textSize">24sp</item>
</style>
In my case, the font:family is only applied if I use "android:titleTextAppearance" instead of "app:titleTextAppearance" but this only works for api 21 or higher