Home » Android » android – Set font style bold of appcompat toolbar menu

android – Set font style bold of appcompat toolbar menu

Posted by: admin June 15, 2020 Leave a comment

Questions:

My menu items becomes red, 10sp and the background is white but textStyle bold is not working. Why is this?

styles.xml

<style name="toolbarMenuTheme">
    <item name="android:colorBackground">@color/white</item>
    <item name="android:textColor">@color/red</item>
    <item name="android:textSize">10sp</item>
    <item name="android:textStyle">bold</item>
</style>

Snippet from my layout.

    <android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="48dp"
        android:layout_marginTop="-5dp"
        android:background="@color/white"
        android:theme="@style/toolbarMenuTheme"/>

And my inflated layout.

<item
    android:id="@+id/web_view_reload"
    android:icon="@drawable/replay"
    android:title="Reload"
    app:showAsAction="always"/>
<item
    android:id="@+id/web_view_action"
    android:icon="@drawable/stack_icon_on"
    android:title="Stack"
    app:showAsAction="always"/>
<item
    android:id="@+id/web_view_screenshot"
    android:icon="@drawable/screenshot"
    android:title="Screenshot"
    app:showAsAction="always"/>
<item
    android:id="@+id/web_view_share"
    android:title="SHARE WEBSITE"/>
<item
    android:id="@+id/web_view_copy_url"
    android:title="Copy URL"/>

Inflating it in java by:

    Toolbar toolbar = (Toolbar) view.findViewById(R.id.toolbar);
    toolbar.setNavigationIcon(R.drawable.x);
    toolbar.inflateMenu(R.menu.web_view_toolbar_menu);

And setting click listeners:

toolbar.setOnMenuItemClickListener(new Toolbar.OnMenuItemClickListener() {
    @Override
    public boolean onMenuItemClick(MenuItem item) {
        ....
    }
}

Edit after comments

Here is my full styles.xml

Styles.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <style name="CustomUITheme" parent="@style/Theme.AppCompat.Light.NoActionBar">
        <item name="android:windowNoTitle">true</item>
        <item name="android:windowActionBar">false</item>
        <item name="windowActionBar">false</item>

        <item name="android:windowBackground">@color/milky</item>

        <!--item name="android:textSelectHandle">@drawable/text_select_handle_middle</item>
        <item name="android:textSelectHandleLeft">@drawable/text_select_handle_left</item>
        <item name="android:textSelectHandleRight">@drawable/text_select_handle_right</item-->
        <item name="colorPrimary">@color/toolbar_bg</item>
        <item name="colorPrimaryDark">#ff404040</item>
        <item name="colorAccent">@color/accent</item>
        <item name="android:textColorHighlight">@color/text_highlight</item>

        <!--item name="alertDialogTheme">@style/AppCompatAlertDialogStyle</item-->
    </style>

    <style name="toolbarMenuTheme" parent="TextAppearance.Widget.AppCompat.Toolbar.Title">
        <item name="android:colorBackground">@color/white</item>
        <item name="android:textColor">@color/red</item>
        <item name="android:textSize">10sp</item>
        <item name="android:textStyle">bold</item>
    </style>

    <style name="AppCompatAlertDialogStyle" parent="Theme.AppCompat.Light.Dialog.Alert">
        <item name="android:background">#FFFFFF</item>
        <item name="android:windowNoTitle">true</item>
    </style>

    <!--style name="CustomActionBar"
        parent="@android:style/Widget.Holo.Light.ActionBar.Solid.Inverse">
        <item name="android:background">@color/toolbar_bg</item>
    </style-->

    <style name="captionOnly">
        <item name="android:background">@null</item>
        <item name="android:clickable">false</item>
        <item name="android:focusable">false</item>
        <item name="android:minHeight">0dp</item>
        <item name="android:minWidth">0dp</item>
    </style>

    <!-- FAB -->
    <style name="FloatingActionButton" parent="android:Widget.ImageButton">
        <item name="floatingActionButtonSize">normal</item>
    </style>

    <!-- empty states -->
    <style name="empty_title">
        <item name="android:textSize">10dp</item>
    </style>

    <style name="empty_details">
        <item name="android:textColor">#999999</item>
        <item name="android:textSize">8dp</item>
    </style>
</resources>
How to&Answers:

Add the following in your styles.xml file

<style name="ActionBar.nameText" parent="TextAppearance.AppCompat.Widget.ActionBar.Title">
        <item name="android:textColor">@color/PrimaryTextColor</item>
        <item name="android:textSize">18sp</item>
        <item name="android:textStyle">bold</item>
    </style>

The style name and parent might differ in your case, but take concept for bold

EDIT

Use the following in the toolbar.xml

    <android.support.v7.widget.Toolbar
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:companyApp="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="?actionBarSize"
    companyApp:theme="@style/ActionBarThemeOverlay"
    companyApp:titleTextAppearance="@style/ActionBar.nameText">
</android.support.v7.widget.Toolbar>

And in your styles.xml

<style name="ActionBarThemeOverlay" parent="">
        <item name="android:textColorPrimary">@color/PrimaryTextColor</item>
        <item name="colorControlHighlight">@color/BackgroundColor</item>
        <item name="android:actionMenuTextColor">@color/PrimaryTextColor</item>
        <item name="android:textColorSecondary">@color/PrimaryTextColor</item>
        <item name="android:background">@color/PrimaryBackgroundColor</item>
    </style>

And in the androidmanifest.xml

<application
   android:icon="@drawable/ic_launcher"
   android:label="@string/app_name" 
   android:theme="@android:style/Your Theme">

Answer:

You can try this in your activity.java to make Collapsed Title BOLD

final CollapsingToolbarLayout collapsingToolbarLayout = (CollapsingToolbarLayout) findViewById(R.id.collapsing_container);

collapsingToolbarLayout.setCollapsedTitleTypeface(Typeface.DEFAULT_BOLD);

Answer:

Why not to try this

Also in this you can set parts of text bold

Screenshot

getSupportActionBar().setDisplayShowTitleEnabled(true);
SpannableStringBuilder str = new SpannableStringBuilder("HelloWorld");
str.setSpan(new android.text.style.StyleSpan(android.graphics.Typeface.BOLD), 5, 10,Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
getSupportActionBar().setTitle(str);

Output will be HelloWorld

In case you want your whole text to be bold, just use this

str.setSpan(new android.text.style.StyleSpan(android.graphics.Typeface.BOLD), 0, 10,Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);

Output will be HelloWorld

Answer:

Toolbar

    <android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/toolbar"
    android:layout_width="match_parent"
    android:layout_height="48dp"
    android:layout_marginTop="-5dp"
    android:background="@color/white"
    android:theme="@style/toolbarMenuTheme"
    app:titleTextAppearance="@style/Toolbar.TitleText" />

In Style.xml

 <style name="Toolbar.TitleText" parent="TextAppearance.Widget.AppCompat.Toolbar.Title">
    <item name="android:textStyle">bold</item>
</style>

for popup Menu

<style name="myPopupMenuTextAppearanceLarge" parent="@android:style/TextAppearance.DeviceDefault.Widget.PopupMenu.Large">
    <item name="android:textColor">@color/color_dark_grey</item>
    <item name="android:textStyle">bold</item>
</style>

Answer:

It work for me
SpannableStringBuilder str = new SpannableStringBuilder(“Prime”);str.setSpan(new android.text.style.StyleSpan(Typeface.ITALIC), 0, str.length(),Spannable.SPAN_USER);
str.setSpan(new android.text.style.ForegroundColorSpan(Color.parseColor(“#FFD700”)),0,str.length(),Spannable.SPAN_USER);
mActionBar.setSubtitle(str);

Answer:

Below style for menu items and PopuOverlay

  <style name="AppTheme.PopupOverlay" parent="ThemeOverlay.AppCompat.Light" >
        <item name="android:textColor">#d22323</item>
        <item name="android:textStyle">bold</item>
    </style>

Below for title

   <style name="ActionBar.nameText" parent="TextAppearance.AppCompat.Widget.ActionBar.Title">
        <item name="android:textColor">@color/colorPrimaryDark</item>
        <item name="android:textStyle">bold</item>
    </style>

Now add themes to toolbar

 <androidx.appcompat.widget.Toolbar
        android:id="@+id/toolbar"
        app:title="title here"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:background="?attr/colorPrimary"
        android:theme="@style/AppTheme.PopupOverlay"
        app:titleTextAppearance="@style/ActionBar.nameText"
        app:popupTheme="@style/AppTheme.PopupOverlay" />