How to make a custom TextView?

Question

I'm trying to make a custom text view that has the font set from a given path. Please provide me any example and how I can make that with less code:

<TextView
   android:id="@+id/textView2"
   android:layout_width="wrap_content"
   android:layout_height="wrap_content"
   android:text="@string/accountInfoText"
   android:textColor="#727272"
   android:textSize="18dp" />

Refer [this](http://developer.android.com/guide/topics/ui/themes.html) — Ghost, Feb 28 '12 at 06:21

score 102 · Accepted Answer · edited Feb 28 '12 at 06:38

102

import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Typeface;
import android.util.AttributeSet;
import android.widget.TextView;

public class FontTextView extends TextView {


    public FontTextView(Context context) {
      super(context);
      Typeface face=Typeface.createFromAsset(context.getAssets(), "Helvetica_Neue.ttf"); 
      this.setTypeface(face); 
    }

    public FontTextView(Context context, AttributeSet attrs) {
        super(context, attrs);
     Typeface face=Typeface.createFromAsset(context.getAssets(), "Helvetica_Neue.ttf"); 
  this.setTypeface(face); 
    }

    public FontTextView(Context context, AttributeSet attrs, int defStyle) {
        super(context, attrs, defStyle);
     Typeface face=Typeface.createFromAsset(context.getAssets(), "Helvetica_Neue.ttf"); 
  this.setTypeface(face); 
    }

    protected void onDraw (Canvas canvas) {
        super.onDraw(canvas);
        
       
    }

}

and in xml:

<com.util.FontTextView
                    android:id="@+id/textView2"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="@string/accountInfoText"
                    android:textColor="#727272"
                    android:textSize="18dp" />

edited Feb 28 '12 at 06:38

Hiral Vadodaria

19,158
5
39
56

answered Feb 28 '12 at 06:24

SuN

1,723
1
13
14

34

I recommend using a singleton for applying the font to avoid creating the typeface from assets each time. – JackMahoney Apr 26 '13 at 06:04
@JackMahoney +1 for your very helpful comment. Now my application is very fast!! – Hamzeh Soboh Jan 20 '14 at 11:18
@JackMahoney do you have an example of converting a custom view to singleton to show around? Would be helpful. – kabuto178 Feb 20 '14 at 20:39
6

@kabuto178 Here is some pseudo-code to give you an idea https://gist.github.com/jackmahoney/9181787 – JackMahoney Feb 24 '14 at 04:06
1

It's better to use an AppCompatTextView here, you'll even get a warning if you don't use it, the implementation is the exact same, just extend AppCompatTextView instead of TextView. – Trevor Hart Jul 02 '18 at 18:19
1

According to AndroidX, you can not extend the TextView. You should use AppCompactTextView – Arpit Patel Jan 09 '20 at 05:32

score 49 · Answer 2 · edited Dec 20 '21 at 06:25

Create a Custom View for Textview.

Make the entry in the attrs.xml file and give an option to select Font as a list in custom TextView.
....
Create the enum entry with a list of fonts and assign unique values
Make entries of all fonts in strings.xml

Roboto-Bold Roboto-Medium Roboto-Light Roboto-Regular Roboto-Thin Roboto-Italic
Create an asset folder and copy all the necessary font you want to put in the font folder

Create a class extending TextView

import android.content.Context;
import android.content.res.TypedArray;
import android.graphics.Typeface;
import android.util.AttributeSet;
import android.widget.TextView;

/**
* Created by ANKIT 
*/
public class CustomFontTextView extends TextView {

String customFont;

public CustomFontTextView(Context context, AttributeSet attrs) {
    super(context, attrs);
    style(context, attrs);
}

public CustomFontTextView(Context context, AttributeSet attrs, int defStyle) {
    super(context, attrs, defStyle);
    style(context, attrs);

}

private void style(Context context, AttributeSet attrs) {

    TypedArray a = context.obtainStyledAttributes(attrs,
            R.styleable.CustomFontTextView);
    int cf = a.getInteger(R.styleable.CustomFontTextView_fontName, 0);
    int fontName = 0;
    switch (cf)
    {
        case 1:
            fontName = R.string.Roboto_Bold;
            break;
        case 2:
            fontName = R.string.Roboto_Italic;
            break;
        case 3:
            fontName = R.string.Roboto_Light;
            break;
        case 4:
            fontName = R.string.Roboto_Medium;
            break;
        case 5:
            fontName = R.string.Roboto_Regular;
            break;
        case 6:
            fontName = R.string.Roboto_Thin;
            break;
        default:
            fontName = R.string.Roboto_Regular;
            break;
    }

    customFont = getResources().getString(fontName);

    Typeface tf = Typeface.createFromAsset(context.getAssets(),
            "font/" + customFont + ".ttf");
    setTypeface(tf);
    a.recycle();
}
}

You can use this custom class this way. .. use your packageName.ClassName

 <ankit.com.customui.CustomFontTextView
  android:layout_width="match_parent"
  android:text="Hello World Ankit"
  android:textSize="16sp"
  app:fontName="Roboto_Medium"
  android:layout_height="wrap_content"/>

add below styleable in res/values/attrs.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <declare-styleable name="CustomFontTextView">
        <attr name="fontName" format="string" />
    </declare-styleable>
</resources>

much better implementation than the accepted answer. – Rahul Thakur Feb 03 '17 at 12:01 — Rahul Thakur, Feb 03 '17 at 12:01

score 0 · Answer 3 · answered Sep 09 '21 at 12:31

If you're writing in Kotlin, this is how you can do it. First of all, add your font to the font folder. Then, create a separate Kotlin class. Call it something like HeadlineTextView (or whatever that sort of gives a hint about what the TextView is for).

class HeadlineTextView(context: Context, attributeSet: AttributeSet) : AppCompatTextView(context, attributeSet) {

  init {
      applyFont()
  }

  private fun applyFont() {
    val headlineTypeface: Typeface=Typeface.create("Montserrat", Typeface.NORMAL)
    typeface=headlineTypeface
  }

}

Now use this custom Text View in your XML. Replace this -

<TextView
   android:id="@+id/textView2"
   android:layout_width="wrap_content"
   android:layout_height="wrap_content"
   android:text="@string/accountInfoText"
   android:textColor="#727272"
   android:textSize="18dp" />

With this -

<com.gmail.something.myapp.HeadlineTextView
   android:id="@+id/textView2"
   android:layout_width="wrap_content"
   android:layout_height="wrap_content"
   android:text="@string/accountInfoText"
   android:textColor="#727272"
   android:textSize="18dp" />

How to make a custom TextView?

3 Answers3

Linked

Related