How to set custom font for alert dialog in android?

Question

In my android application an alert dialog appears after clicking on a button. I want to set custom font for the alert. I searched the web and found some tutorials and questions about this subject, but none of them works for me.

How can I change the font?

Thanks

score 84 · Accepted Answer · answered Oct 24 '12 at 15:08

84

To do this you use alert builder to build your alert. You then get the TextView from this alert and then you set the typeface for the alert.

AlertDialog dialog = new AlertDialog.Builder(this).setMessage("Hello world").show();
TextView textView = (TextView) dialog.findViewById(android.R.id.message);
Typeface face=Typeface.createFromAsset(getAssets(),"fonts/FONT"); 
textView.setTypeface(face);

answered Oct 24 '12 at 15:08

mikeswright49

3,381
19
22

2

That's good, remember to approve and upvote once you get the privileges so other people can get this help too. – mikeswright49 Oct 24 '12 at 15:48
1

I was trying to do but ur code is really amazing :) thanks alot – Maveňツ Mar 12 '14 at 07:43
17

Unfortunately this is throwing a null pointer exception on API 20, textView cannot be found. – marcwjj Aug 06 '14 at 07:46
@mikeswright49 how do i add ok and cancel buttons for this way? – Dave Cruise Nov 25 '16 at 09:57
3

If you want to change the title's font too, I was able to do so with `android.support.v7.appcompat.R.id.alertTitle` – yuval Aug 17 '17 at 03:33
What is typically the default font for AlertDialog? Is there an action to find out what's being used? – Androidcoder Jun 21 '20 at 20:26

score 22 · Answer 2 · answered Apr 21 '17 at 07:38

The above answers didnt work for me.

I used the following approach

// Initializing the alertDialog
AlertDialog alertDialog = new AlertDialog.Builder(QuizActivity.this).create();
alertDialog.setTitle("Warning");
alertDialog.setMessage("Are you sure you want to exit?");
alertDialog.show(); // This should be called before looking up for elements


// Getting the view elements
TextView textView = (TextView) alertDialog.getWindow().findViewById(android.R.id.message);
TextView alertTitle = (TextView) alertDialog.getWindow().findViewById(R.id.alertTitle);
Button button1 = (Button) alertDialog.getWindow().findViewById(android.R.id.button1);
Button button2 = (Button) alertDialog.getWindow().findViewById(android.R.id.button2);

// Setting font
textView.setTypeface(FontHelper.getFont(Fonts.MULI_REGULAR));
alertTitle.setTypeface(FontHelper.getFont(Fonts.MULI_REGULAR));
button1.setTypeface(FontHelper.getFont(Fonts.MULI_BOLD));
button2.setTypeface(FontHelper.getFont(Fonts.MULI_BOLD));

Tested on 7.1.1

NOTE: Make sure you get the element after showing the dialog. Without this you will get NullPointerException

@Cerlin, are the button1 and button2 for the positive and negetive buttons created using builder or the buttons in the layout which is inflated? — juztcode, Sep 28 '20 at 16:32

score 22 · Answer 3 · answered Apr 30 '18 at 15:09

I know this is an old question, but I leave this here for those still searching for a solution.

If you only want to change text format, you can just override alertDialogTheme attribute to change the theme for the AlertDialog.

Example, using the Application theme:

<style name="MyTheme" parent="Theme.AppCompat.Light.NoActionBar">
    <item name="colorPrimary">@color/colorPrimary</item>
    <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
    <item name="colorAccent">@color/colorAccent</item>

    <!-- This will override the Alert Dialog theme -->
    <item name="alertDialogTheme">@style/MyAlertDialogTheme</item>
</style>

<style name="MyAlertDialogTheme" parent="@android:style/Theme.Material.Light.Dialog.Alert">
    <item name="android:textAppearanceSmall">@style/MyTextAppearanceSmall</item>
    <item name="android:textAppearanceMedium">@style/MyTextAppearanceMedium</item>
    <item name="android:textAppearanceLarge">@style/MyTextAppearanceLarge</item>
</style>

<style name="MyTextAppearance" parent="TextAppearance.AppCompat">
    <item name="android:fontFamily">@font/comic_sans</item>
</style>
(...)

If I'm not mistaken android:textAppearanceSmall is used for the message and the android:textAppearanceMedium for the title. But you can pick whatever you want and remove the rest.

Another option

Without overriding the alertDialogTheme, is by setting the style via the builder constructor. Example: AlertDialog.Builder(getActivity(), R.style.MyAlertDialogTheme)

At this time, this is the true answer – mohammad hosein abedini Dec 19 '19 at 07:31 — mohammad hosein abedini, Dec 19 '19 at 07:31

score 9 · Answer 4 · edited Jun 10 '20 at 07:01

If you are using Material Components, you can customize your diaog to nearly all of needs by declearing a style for it. For example, custom style I created for my dialog:

    <style name="ThemeOverlay.App.MaterialAlertDialog" parent="ThemeOverlay.MaterialComponents.MaterialAlertDialog">
        <item name="materialAlertDialogTitleTextStyle"><!--here goes your title text style --></item>
        <item name="materialAlertDialogBodyTextStyle"><!--here goes your message text style --></item>
        <item name="colorPrimary"><!--here goes your dialog primary color. e.g. button text color, etc.--></item>
        <item name="shapeAppearanceOverlay">@style/ShapeAppearance.App.SmallComponent</item> <!-- your custom shape appearance for your dialog. In my case, I am changing corner radius of dialog to rounded 20dp corners-->
        <item name="colorSurface">@color/white</item>
        <item name="buttonBarPositiveButtonStyle">@style/Widget.App.Button</item> <!-- your custom positive button style-->
        <item name="buttonBarNegativeButtonStyle">@style/Widget.App.Button</item> <!-- your custom negtive button style-->
    </style>

    <style name="ShapeAppearance.App.SmallComponent" parent="ShapeAppearance.MaterialComponents.SmallComponent">
        <item name="cornerFamily">rounded</item>
        <item name="cornerSize">20dp</item>
    </style>

    <style name="Widget.App.Button" parent="Widget.MaterialComponents.Button.TextButton.Dialog">
        <item name="shapeAppearance">@style/ShapeAppearance.App.SmallComponent</item>
        <item name="android:textAppearance">@style/Roboto.Bold.Small</item>
        <item name="android:textColor">@color/colorAccent</item>
        <item name="android:textAllCaps">true</item>
    </style>

Finally, when creating your dialog, do not forget set this style:

 MaterialAlertDialogBuilder(this, R.style.ThemeOverlay_App_MaterialAlertDialog)
            .setMessage("your message")
            .show()

score 3 · Answer 5 · edited May 23 '17 at 12:18

3

You can define your own layout of the dialog you want to display.

Here's a link for this

Creating a custom dialog in Android

In your Layout you can define TextViews with the typeFace you want. You need to download otf files for the font you want. Have them in your asset directories. And set that as the TypeFace of your TextView. And how to set TypeFace

This can be helpful

How to change the font on the TextView?

edited May 23 '17 at 12:18

Community

1
1

answered Oct 24 '12 at 15:09

Rohit Sharma

13,787
8
57
72

I've get my answer in last post by mikeswright49. but thanks for your attention. – IndieBoy Oct 24 '12 at 15:40

score 2 · Answer 6 · answered Feb 01 '18 at 05:59

Customising the alert dialog title textview

             TextView tv_message = new TextView(this);

            Typeface typeface = Typeface.createFromAsset(
                    getAssets(),
                    "fonts/OpenSans-Semibold.ttf"
            );


            // Set the text view layout parameters
            tv_message.setLayoutParams(
                    new 
      ViewGroup.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, 
      ViewGroup.LayoutParams.WRAP_CONTENT)
            );

            // Set message text color
            tv_message.setTextColor(Color.RED);

            // Set message gravity/text align
            tv_message.setGravity(Gravity.START);

            // Set message text size
            tv_message.setTextSize(TypedValue.COMPLEX_UNIT_DIP, 16);

            // Set message custom font
            tv_message.setTypeface(typeface);

            // Set message background color
            tv_message.setBackgroundColor(Color.YELLOW);

            // Set message text padding
            tv_message.setPadding(15, 25, 15, 15);

            tv_message.setText("Are you sure?");
            tv_message.setTextColor(Color.BLACK);

Thanks it worked, below is my code `TextView tv_title = new TextView(this); tv_title.setText(Title); tv_title.setTextColor(getResources().getColor(R.color.white)); Typeface typeface = ResourcesCompat.getFont(context, R.font.work_sans_regular); tv_title.setTypeface(typeface); pDialog.setCustomTitle(tv_title);` **Used this to set ProgressDialog Font** — Pradip Tilala, Feb 12 '19 at 09:27

Tejas · Answer 7 · 2018-07-11T09:50:12.417

You could use a SpannableString, set the typeface on it and return it back to the AlertDialog.Builder

This is a helper function that adds a typeface to a CharSequence and returns a SpannableString -

private static SpannableString typeface(Typeface typeface, CharSequence chars) {
    if (chars == null) {
        return null;
    }
    SpannableString s = new SpannableString(chars);
    s.setSpan(new TypefaceSpan(typeface), 0, s.length(), Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);
    return s;
}

Class that sets the TypeFace on the text -

public class TypefaceSpan extends MetricAffectingSpan {

    private final Typeface typeface;

    public TypefaceSpan(Typeface typeface) {
        this.typeface = typeface;
    }

    @Override
    public void updateDrawState(TextPaint tp) {
        tp.setTypeface(typeface);
        tp.setFlags(tp.getFlags() | Paint.SUBPIXEL_TEXT_FLAG);
    }

    @Override
    public void updateMeasureState(TextPaint p) {
        p.setTypeface(typeface);
        p.setFlags(p.getFlags() | Paint.SUBPIXEL_TEXT_FLAG);
    }
}

While creating the dialog you can substitute the strings with the SpannableString like so -

public static Dialog createDialog(Context c, String title, String message, String pButton, String nButton, AlertCallback callback) {

    AlertDialog.Builder builder = new AlertDialog.Builder(c);

    builder.setMessage(typeface(Fonts.Regular, message));
    builder.setTitle(typeface(Fonts.Bold, title));
    builder.setPositiveButton(typeface(Fonts.Bold, pButton),callback::onPositiveButtonClick);
    builder.setNegativeButton(typeface(Fonts.Bold, nButton),callback::onNegativeButtonClick);

    AlertDialog dialog = builder.create();
    return builder.create();
}

I'd recommend to load the fonts into a cache, rather than calling createFromAsset multiple times. Hope this helps!

score 1 · Answer 8 · answered Aug 17 '19 at 09:24

I had an alert dialog containing a list of items, so I had to combine a couple of answers and also simplify it a little bit, here's the code for the alert dialog itself:

val dialog = AlertDialog.Builder(this, R.style.MyAlertDialogTheme).setTitle(R.string.sort_by)
   .setSingleChoiceItems(modelList, selectedSortPosition) { _, position -> selectedSortPosition = position }
   .setPositiveButton(R.string.ok) { _, _ ->  }
   .setNegativeButton(R.string.cancel) { _, _ -> }.create()
dialog.show()
setFontsForDialog(dialog)

here I have used the style from Danilo's answer, but I have added set theme colors for that:

   <style name="MyAlertDialogTheme" parent="Theme.MaterialComponents.DayNight.Dialog.Alert">
      <item name="colorPrimary">@color/colorPrimary</item>
      <item name="colorAccent">@color/colorAccent</item>
      <item name="android:textAppearanceSmall">@style/MyTextAppearanceSmall</item>
      <item name="android:textAppearanceMedium">@style/MyTextAppearanceMedium</item>
      <item name="android:textAppearanceLarge">@style/MyTextAppearanceLarge</item>
   </style>

and since it only changes the font for the list items, I have added this method and since I was going to use it a lot of times in the app, I have created an extension method for the activity itself:

private fun Activity.setFontsForDialog(dialog: AlertDialog) {
    val font = ResourcesCompat.getFont(this, R.font.theme_bold_pn)
    dialog.findViewById<TextView>(android.R.id.message)?.typeface = font
    dialog.findViewById<TextView>(android.R.id.button1)?.typeface = font
    dialog.findViewById<TextView>(android.R.id.button2)?.typeface = font
}

score 0 · Answer 9 · answered Dec 27 '19 at 12:52

I created an extension method for AlertDialog for this purpose -
(This works as of androidx.appcompat:appcompat:1.1.0)

fun AlertDialog.setTypefaceInDialog(context: Context) {

    val regularFont = ResourcesCompat.getFont(context, R.font.regular_font)
    val boldFont = ResourcesCompat.getFont(context, R.font.medium_font)

    findViewById<TextView>(androidx.appcompat.R.id.alertTitle)?.typeface = boldFont
    findViewById<TextView>(android.R.id.message)?.typeface = regularFont
    getButton(AlertDialog.BUTTON_POSITIVE).typeface = boldFont
    getButton(AlertDialog.BUTTON_NEGATIVE).typeface = boldFont
}

score 0 · Answer 10 · edited Jun 08 '23 at 13:18

0

dialog.window?.decorView?.post {
    val textViews = (dialog.window?.decorView?.allViews ?: sequenceOf<TextView>()).filterIsInstance(TextView::class.java)
    textViews.forEach { it.typeface = ... }
}

edited Jun 08 '23 at 13:18

General Grievance

4,555
31
31
45

answered Jun 08 '23 at 04:30

kkmike999

101
2
5

How to set custom font for alert dialog in android?

10 Answers10

Linked