FB Litho: How to set custom font for Text

Question

My question is how to set a custom font for Text component in Facebook's UI framework Litho?

The following is my Text component:

 Text.create(componentContext)
                .flexGrow(1f)
                .verticalGravity(VerticalGravity.CENTER)
                .text("MY APP")
                .textSizeDip(25)
                .textAlignment(Layout.Alignment.ALIGN_CENTER)

This document [1] shows that there's a typeface prop I have no idea about usage though. [1]: https://fblitho.com/javadoc/com/facebook/litho/widget/Text — Salim Mahboubi, Oct 19 '17 at 15:49

score 3 · Accepted Answer · answered Nov 17 '17 at 18:46

To use the typeface prop, you must first obtain a Typeface object, which is significantly easier if you can use Support Library v26, which introduces Fonts in XML ... it's pretty simple to do so from a ComponentContext even inside your onCreateLayout method (though presumably you may wish to cache the Typeface):

Text.create(c)
    .typeface(ResourcesCompat.getFont(
        c.getApplicationContext, R.font.my_cool_font)
    .text("Check out my cool font")
    .build()

There is also a Typeface.Builder class available if you do not have access to Support v26, which gives you a few options about how to specify the desired font.

FB Litho: How to set custom font for Text

1 Answers1