RJE
RJE

Reputation: 891

Change font of custome key (label) of android custom keyboard

I am having a problem with changing the font style (non English - Unicode) of the custom keys of android custom keyboard. I have followed something similar to the answer of this link and it seems working fine for single character buttons. It will change the font of entire app to the new font including single character keys of the keyboard. If I wanna change the size of the key text I can use below two entries

android:keyTextSize="25sp" // for single character keys
android:labelTextSize="20sp" // for multiple character keys

But unfortunately method in above link only works for single character keys only. Is there any way to set the font of multiple character keys.

See below image for example: First button has some default system font while second and third buttons have the correct font.

enter image description here

EDIT: After reading Bhavita Lalwani answer it got me thinking.

if (label != null) {
        // For characters, use large font. For labels like "Done", use small font.
        if (label.length() > 1 && key.codes.length < 2) {
            paint.setTextSize(mLabelTextSize);
            paint.setTypeface(Typeface.DEFAULT_BOLD);
        } else {
            paint.setTextSize(mKeyTextSize);
            paint.setTypeface(Typeface.DEFAULT);
                }
            }

here it says

if (label.length() > 1 && key.codes.length < 2)

so it uses BOLD fonts for multiple characters only if they have single code. eg. I think Android Engs thinking about these things. ???

Keyboard.KEYCODE_DONE
Keyboard.KEYCODE_DELETE

So the ugly workaround will be to add multiple codes and only use first code when needed.

<Key android:codes="5001,1" android:keyLabel="AB" android:keyWidth="12%p" />

Now every key with multiple codes also user DEFAULT typeface. This works for now, (Until I find a proper solution :))

Upvotes: 2

Views: 4008

Answers (1)

Bhavita Lalwani
Bhavita Lalwani

Reputation: 903

I was having a similar issue in creating Hindi custom keyboard.(Non English-Unicode)

So let's find your culprit why this variation happens.

KeyboardView.java in Android Source code

lines 701-709

            if (label != null) {
            // For characters, use large font. For labels like "Done", use small font.
            if (label.length() > 1 && key.codes.length < 2) {
                paint.setTextSize(mLabelTextSize);
                paint.setTypeface(Typeface.DEFAULT_BOLD);
            } else {
                paint.setTextSize(mKeyTextSize);
                paint.setTypeface(Typeface.DEFAULT);
                    }
                }

This means it makes multi character labels to Bold and different size. And single char labels stay as it is.

Solution

Create a CustomKeyboardView class which extends this KeyboardView class

public class CustomKeyboardView extends KeyboardView {

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

Now in this CustomKeyboardView class, override onDraw method. This method would be called when drawing the keyboard and keys on the canvas

@Override
public void onDraw(Canvas canvas) {
    super.onDraw(canvas);
    Paint mpaint = new Paint();
    mpaint.setTypeface(Typeface.DEFAULT_BOLD); //to make all Bold. Choose Default to make all normal font
    mpaint.setTextSize(24); // in px


    List<Key> keys = getKeyboard().getKeys();
    for (Keyboard.Key key : keys) {

        if (key.label != null) {
            String keyLabel = key.label.toString();
            canvas.drawText(keyLabel, key.x + key.width, key.y + key.height, mpaint);
        } else if (key.icon != null) {
            key.icon.setBounds(key.x, key.y, key.x + key.width, key.y + key.height);
            key.icon.draw(canvas);
        }
    }
}

You can use this cheatcode to use sp for setTextSize method

<?xml version="1.0" encoding="utf-8"?>
<resources>
  <dimen name="custom_text_size">25sp</dimen>
</resources>

and

mpaint.setTextSize(getResources().getDimensionPixelSize(R.dimen.custom_text_size));

Finally just as we used to create the Keyboard,

     KeyboardView kv = (CustomKeyboardView) getLayoutInflater().inflate(R.layout.mainkeyboard, null); //mainkeyboard
     Keyboard  keyboard = new Keyboard(this, R.xml.hindi); //Your Keyboard Layout
     kv.setKeyboard(keyboard); //Set the keyboard

And you are good to go.

Hope it helps :D

Upvotes: 2

Related Questions