Introduction

Centering a toolbar title on Android is not as automatic as many developers expect. The default Toolbar layout is optimized for navigation icons, menus, and the traditional start-aligned title, so a centered title with a custom font usually requires either MaterialToolbar support or a custom title view.

Why the Default Title Is Hard to Center

A standard Toolbar treats the title as part of its own internal layout. That is convenient when you only need the default appearance, but it becomes limiting when you want exact visual control.

If you set the title normally, Android measures it relative to navigation and action items, not as a free-floating centered label:

val toolbar = findViewById<Toolbar>(R.id.toolbar)
setSupportActionBar(toolbar)
supportActionBar?.title = "Profile"

This works, but the title is usually start-aligned. Even if it appears centered on one screen size, it may shift when a back arrow or menu item appears.

Option 1: Use MaterialToolbar With Centered Title Support

If your project uses Material Components, MaterialToolbar is the cleanest solution. It has built-in support for a centered title.

1<com.google.android.material.appbar.MaterialToolbar
2    android:id="@+id/toolbar"
3    android:layout_width="match_parent"
4    android:layout_height="wrap_content"
5    android:background="@color/white"
6    app:title="Profile"
7    app:titleCentered="true"
8    app:titleTextAppearance="@style/ToolbarTitleStyle" />

Then define the font through a text appearance:

1<style name="ToolbarTitleStyle" parent="TextAppearance.MaterialComponents.Headline6">
2    <item name="android:fontFamily">@font/merriweather_bold</item>
3    <item name="android:textColor">@color/black</item>
4    <item name="android:textSize">20sp</item>
5</style>

This approach is maintainable because it keeps the title in the toolbar API instead of replacing it with a custom child view.

Option 2: Supply a Custom Title View

If you need exact placement or your toolbar implementation does not support title centering, add your own TextView inside the toolbar. In that setup, disable the built-in title and let the custom view handle presentation.

1<androidx.appcompat.widget.Toolbar
2    android:id="@+id/toolbar"
3    android:layout_width="match_parent"
4    android:layout_height="wrap_content"
5    android:background="@color/white">
6
7    <TextView
8        android:id="@+id/toolbarTitle"
9        android:layout_width="wrap_content"
10        android:layout_height="wrap_content"
11        android:layout_gravity="center"
12        android:fontFamily="@font/merriweather_bold"
13        android:text="Profile"
14        android:textColor="@color/black"
15        android:textSize="20sp" />
16</androidx.appcompat.widget.Toolbar>

In your Activity or Fragment:

1val toolbar = findViewById<Toolbar>(R.id.toolbar)
2setSupportActionBar(toolbar)
3supportActionBar?.setDisplayShowTitleEnabled(false)
4
5val titleView = findViewById<TextView>(R.id.toolbarTitle)
6titleView.text = "Profile"

This gives you full control over font, spacing, alignment, and animation. It is especially useful when design requirements are stricter than the default toolbar API allows.

Handling Navigation and Menu Items

A centered title is easy when the toolbar is otherwise empty. The real challenge appears when you add a back arrow on the start side and action buttons on the end side.

To keep the title visually centered, test screens with:

• no navigation icon
• a navigation icon only
• both navigation and action icons
• long localized titles

If you use a custom TextView, android:layout_gravity="center" centers the view inside the toolbar bounds, not inside the remaining free space. That is often good enough, but not always perfect when icons have very different widths. For pixel-accurate layouts, some teams place a centered title in a container outside the toolbar rather than inside it.

Applying a Custom Font Correctly

The recommended modern way to set the font is through the res/font directory. Put the font file there and reference it with @font/....

1<TextView
2    android:id="@+id/toolbarTitle"
3    android:layout_width="wrap_content"
4    android:layout_height="wrap_content"
5    android:fontFamily="@font/merriweather_bold"
6    android:text="Profile" />

This is better than loading a Typeface manually from assets in most cases. Resource fonts are simpler, work well with styles, and reduce repetitive code.

If you still need runtime font loading, for example because the font depends on feature flags, you can apply it in Kotlin:

val titleView = findViewById<TextView>(R.id.toolbarTitle)
titleView.typeface = ResourcesCompat.getFont(this, R.font.merriweather_bold)

Common Pitfalls

The most common mistake is trying to force the default toolbar title into a perfect centered layout. That title was not designed for high-precision custom alignment across every configuration.

Another problem is forgetting to disable the built-in title when adding a custom TextView. If you do not call setDisplayShowTitleEnabled(false), you may end up with two titles competing for space.

Developers also sometimes test only on one screen size. A title that looks centered without menu items can shift as soon as icons or translated text change the layout.

Summary

• Standard Toolbar titles are not designed for exact center alignment.
• 'MaterialToolbar with app:titleCentered="true" is the cleanest solution when available.'
• A custom TextView inside the toolbar gives the most control over alignment and font.
• Prefer fonts from res/font rather than loading assets manually.
• Always test with navigation icons, menu items, and longer titles before calling the layout finished.