Custom font for clock textview

问题

I am new in world of android developement and I want to make a clock such that each digit of time has it's own typeface. Hour digits has it's own typeface and minutes digit has its own typeface. How can i do this. Help me.

回答1:

Let's say your font name is DemoFont . Make a Class which extends TextView. And initialize the font for the DemoFont .

Next place the .ttf file of that font in the assets folder.

public class DemoFont extends TextView {


    public DemoFont (Context context, AttributeSet attrs, int defStyle) {
        super(context, attrs, defStyle);
        init();
    }

    public DemoFont (Context context, AttributeSet attrs) {
        super(context, attrs);
        init();
    }

    public DemoFont (Context context) {
        super(context);
        init();
    }

    private void init() {
        Typeface tf = Typeface.createFromAsset(getContext().getAssets(),
                "demofont.ttf");
        setTypeface(tf);
    }

}

Now, In your layout file you can use this like this way.

<YOUR_PACKAGE_NAME.DemoFont
    android:layout_width="match_parent"
    android:layout_height="wrap_content" />

回答2:

First, you need to download a font file, which is usually of the .otf format. Then, you need to import this font into your assets folder in your android studio or eclipse project. After doing this you can create a new Typeface and set it to your text view. In terms of having different fonts for the hours and minutes digit, you need to create a layout with multiple text views. For example, you could do something like the following

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent">

<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:id="@+id/hours_digit"/>

<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text=": "
    android:id="@+id/time_colon"
    android:layout_toEndOf="@id/hours_digit" />

<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_toEndOf="@id/time_colon"
    android:id="@+id/minutes_digit"/>

</RelativeLayout>

Another way to accomplish this, rather than setting a typeface to a textview every single time, is to create your own custom textview, so that the typeface will be applied whenever you're using it. For example, for the minutes text view, you could do:

public class MinutesTextView extends TextView {

// Constructor method for the text view...
public MinutesTextView(Context context, AttributeSet attrs, int defStyle) {
    super(context, attrs, defStyle);
    init(attrs);
}

// Constructor method for the text view...
public MinutesTextView(Context context, AttributeSet attrs) {
    super(context, attrs);
    init(attrs);

}

// Constructor method for the text view...
public MinutesTextView(Context context) {
    super(context);
    init(null);
}

// Initializes any UI properties of the text view.
private void init(AttributeSet attrs) {
    Typeface myTypeface = Typeface.createFromAsset(getContext().getAssets(), "Minutes-font-file.otf");
    setTypeface(myTypeface);
}

}

and the, using the layout file from earlier.

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent">

<com.example.yourpackage.MinutesTextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:id="@+id/hours_digit"/>

<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text=": "
    android:id="@+id/time_colon"
    android:layout_toEndOf="@id/hours_digit" />

<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_toEndOf="@id/time_colon"
    android:id="@+id/minutes_digit"/>

</RelativeLayout>

回答3:

First copy the fonts to the assets folder in your project.

For Hour Textview

public class HourTextView extends TextView {

public HourTextView(Context context) {
    super(context);
    init(null);
}

public HourTextView(Context context, AttributeSet attrs, int defStyleAttr, int defStyleRes) {
    super(context, attrs, defStyleAttr, defStyleRes);
    init(attrs);
}

public HourTextView(Context context, AttributeSet attrs, int defStyleAttr) {
    super(context, attrs, defStyleAttr);
    init(attrs);
}

public HourTextView(Context context, AttributeSet attrs) {
    super(context, attrs);
    init(attrs);
}

// Initializes any UI properties of the text view.
private void init(AttributeSet attrs) {
    Typeface myTypeface = Typeface.createFromAsset(getContext().getAssets(), "Hour-font-file.otf");
    setTypeface(myTypeface);
}

}

For Minute Textview

public class MinuteTextView extends TextView {

public MinuteTextView(Context context) {
    super(context);
    init(null);
}

public MinuteTextView(Context context, AttributeSet attrs, int defStyleAttr, int defStyleRes) {
    super(context, attrs, defStyleAttr, defStyleRes);
    init(attrs);
}

public MinuteTextView(Context context, AttributeSet attrs, int defStyleAttr) {
    super(context, attrs, defStyleAttr);
    init(attrs);
}

public MinuteTextView(Context context, AttributeSet attrs) {
    super(context, attrs);
    init(attrs);
}

// Initializes any UI properties of the text view.
private void init(AttributeSet attrs) {
    Typeface myTypeface = Typeface.createFromAsset(getContext().getAssets(), "Minute-font-file.otf");
    setTypeface(myTypeface);
}

}

For Seconds Textview

public class SecondTextView extends TextView {

public SecondTextView(Context context) {
    super(context);
    init(null);
}

public SecondTextView(Context context, AttributeSet attrs, int defStyleAttr, int defStyleRes) {
    super(context, attrs, defStyleAttr, defStyleRes);
    init(attrs);
}

public SecondTextView(Context context, AttributeSet attrs, int defStyleAttr) {
    super(context, attrs, defStyleAttr);
    init(attrs);
}

public SecondTextView(Context context, AttributeSet attrs) {
    super(context, attrs);
    init(attrs);
}

// Initializes any UI properties of the text view.
private void init(AttributeSet attrs) {
    Typeface myTypeface = Typeface.createFromAsset(getContext().getAssets(), "Second-font-file.otf");
    setTypeface(myTypeface);
}

}

and in xml file do this,

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center">

<com.yourpackage.HourTextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:textAppearance="?android:attr/textAppearanceLarge"
    android:text="10"
    android:id="@+id/hourText" />

<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:textAppearance="?android:attr/textAppearanceLarge"
    android:text=" : " />

<com.yourpackage.MinuteTextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:textAppearance="?android:attr/textAppearanceLarge"
    android:text="45 "
    android:id="@+id/minuteText" />

<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:textAppearance="?android:attr/textAppearanceLarge"
    android:text=" : " />

<com.yourpackage.SecondTextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:textAppearance="?android:attr/textAppearanceLarge"
    android:text="28"
    android:id="@+id/secondsText" />

</LinearLayout>

回答4:

public class MainActivity extends AppCompatActivity {

public TextView textView;
int countInt;
private int mInterval = 1000; // 1 second by default, can be changed later
private Handler mHandler;

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);
    textView=(TextView)findViewById(R.id.textView);

    mHandler = new Handler();
    startRepeatingTask();
}

Runnable mStatusChecker = new Runnable() {
    @Override
    public void run() {
        try {
            countInt=countInt+1;
            textView.setText(String.valueOf(countInt));
        } finally {
            mHandler.postDelayed(mStatusChecker, mInterval);
        }
    }
};

void startRepeatingTask() {
    mStatusChecker.run();
}

void stopRepeatingTask() {
    mHandler.removeCallbacks(mStatusChecker);
}
}

来源：https://stackoverflow.com/questions/36904466/custom-font-for-clock-textview