How to Implement Custom Font in The Notification Title (RemoteViews)?

 

Have you developed any mobile app before? Which font did you use for the notifications?

The default ‘Roboto‘, right? Ain’t you bored of it?

Do you want to customize it with your favorite font?

Yes.

And here is exactly how to customize your default font. In this tutorial, you will learn how to change the font style of Notification Content Title for Remote Views. For example, some devices, which are below 5.0 Android OS, don’t support Gujarati fonts, so you can apply Gujarati font in Notification by following below step.

In below image, we have applied digital font.

Apply Custom font in Notification Title

 

Problem & Solution:

We are working on one of our Android applications, TingTong. In that, we have to use Gujarati font, but, due to some restriction, we cannot apply font in Notification RemoteViews.

So, we have generated an image from a text message by following this process.
Follow below steps to create a custom notification for your mobile application.

  1. Create custom notification layout file i.e. custom_notification.xml

  2. <?xml version=”1.0″ encoding=”utf-8″?>
    <RelativeLayout xmlns:android=”http://schemas.android.com/apk/res/android”
    android:layout_width=”match_parent”
    android:layout_height=”wrap_content”
    android:layout_gravity=”center_vertical”
    android:background=”@color/white”
    android:gravity=”center_vertical”
    android:orientation=”horizontal”>

    <ImageView
    android:id=”@+id/ivNotificationImage”
    android:layout_width=”40dp”
    android:layout_height=”40dp”
    android:layout_centerVertical=”true”
    android:layout_margin=”5dp”
    android:src=”@mipmap/ic_launcher” />

    <LinearLayout
    android:layout_width=”match_parent”
    android:layout_height=”wrap_content”
    android:layout_centerVertical=”true”
    android:layout_marginLeft=”10dp”
    android:layout_toRightOf=”@+id/ivNotificationImage”
    android:orientation=”vertical”>

    <TextView
    android:id=”@+id/tvNotificationTitle”
    android:layout_width=”match_parent”
    android:layout_height=”wrap_content”
    android:layout_marginTop=”5dp”
    android:singleLine=”true”
    android:text=”Toolbar Title”
    android:textSize=”14sp” />
    <ImageView
    android:id=”@+id/ivNotificationMessage”
    android:layout_width=”wrap_content”
    android:layout_height=”wrap_content”
    android:layout_marginTop=”5dp” />
    </LinearLayout>

    </RelativeLayout>

    Want To Develop An Android Application?

    Book your free consultation with Android app experts.

  3. Generate Image from notification message

  4. /*
    *
    *  Code for converting message to image
    *
    */
    public static Bitmap textAsBitmap(Context context,String messageText,float textSize,int textColor){
           String fontName=context.getString(R.string.font_regular_gu);
           Typeface font=Typeface.createFromAsset(context.getAssets(),String.format("fonts/%s.ttf",fontName));
           Paint paint=new Paint();
           paint.setTextSize(textSize);
           paint.setTypeface(font);
           paint.setColor(textColor);
           paint.setTextAlign(Paint.Align.LEFT);
           float baseline=-paint.ascent(); // ascent() is negative
           int width=(int)(paint.measureText(messageText)+0.5f); // round
           int height=(int)(baseline+paint.descent()+0.5f);
           Bitmap image=Bitmap.createBitmap(width,height,Bitmap.Config.ARGB_8888);
           Canvas canvas=new Canvas(image);
           canvas.drawText(text,0,baseline,paint);
           return image;
           }
    
  5. Create custom notification

  6. // Using RemoteViews to bind custom layouts into Notification
    RemoteViews remoteViews = new RemoteViews(context.getPackageName(),
     R.layout.custom_notification);
    
    Bitmap bm = BitmapFactory.decodeResource(context.getResources(), R.mipmap.ic_launcher);
    
    // Open Notification View Class on Notification Click
    Intent intent = new Intent(context, SplashActivity.class);
    PendingIntent pIntent = PendingIntent.getActivity(context, 0, intent,
     PendingIntent.FLAG_UPDATE_CURRENT);
    
    
    NotificationCompat.Builder builder = new NotificationCompat.Builder(context)
     // Set Icon
     .setLargeIcon(bm)
     .setSmallIcon(R.drawable.notification_tingtong)
     // Dismiss Notification
     .setAutoCancel(true)
     // Set PendingIntent into Notification
     .setContentIntent(pIntent)
    // Set RemoteViews into Notification
    .setContent(remoteViews);
    
    
    int color = Color.BLACK;
    
    // Set text on a TextView in the RemoteViews programmatically.
    String notificationTitle=getResources().getString(R.string.notification_title);
    remoteViews.setTextViewText(R.id.tvNotificationTitle,notificationTitle);
    
    //Generate bitmap from text
    Bitmap bitmap = textAsBitmap(context, message, 30, color);
    
    //Show generated bitmap in Imageview
    remoteViews.setImageViewBitmap(R.id.ivNotificationMessage, bitmap);
    
    
    // Create Notification Manager
    NotificationManager notificationmanager = (NotificationManager) context.getSystemService(Context.NOTIFICATION_SERVICE);
    
    // Build Notification with Notification Manager
    int notificationId = new Random().nextInt(100);
    
    Notification notification = builder.build();
    notificationmanager.notify(notificationId, notification);
    

     

    Have you ever imagined how simple is that?

    Want To Create An Android Application?

    Validate your app idea and get a free quote.

    You can easily show this image bitmap in ImageView of your Android application. You can directly download a full source code for free, so you can use it in your next project. Click the following link to download it.

    If you have any query regarding how to set a custom font in notifications or any other related to Android app development, contact our technical team.

Author Bio
Amit Patolia
Amit Patolia
Designation: Android Team Lead

Amit Patolia is an Android Team Lead at Space-O Technologies. He has over 9+ years of experience in Android app development. He has guided to develop over 100 Android apps with unique features and functionalities. He also has expertise in Kotlin-based apps.