I located a font I like from Google Fonts (Raleway) which produces a download of 18 separate ttf files:
I started in the Type.kt file creating my own FontFamily from these files:
val myFontFamily = FontFamily(
Font(R.font.raleway_regular, weight = FontWeight.Normal),
Font(R.font.raleway_bold, weight = FontWeight.Bold),
Font(R.font.raleway_italic, style = FontStyle.Italic)
...
)
Some questions with the FontFamily declaration:
- Do I really need to put all 18 font files here?
- If this were a Variable font, would there be only 1 file? If no, why not?
- Besides the obvious R.font.raleway_* resource id, which other parameters should be declared for each Font()? How do I determine what to put here for 18 ttf files? Am I describing the content of a single .ttf file or am I declaring the usage of this file?
- Will the system "interpolate" my entries here? (in other words, how would it determine "Bold and Italic" from the entries above?)
After creating a custom FontFamily, I create a custom Typography that uses that FontFamily, like this:
val myTypography = Typography(
displayLarge = TextStyle(
fontFamily = myFontFamily,
fontWeight = FontWeight(400),
fontSize = 57.sp,
lineHeight = 64.sp,
),
displayMedium = TextStyle(
fontFamily = myFontFamily,
fontWeight = FontWeight.Normal,
fontSize = 48.sp,
lineHeight = 53.sp,
),
...
Questions on the custom Typography():
- How does the Material theme system determine arbitrary font sizes from this list of specific font sizes? For example, a requested font size of "50.sp" is not in the Typography.
- How does the system determine which *.ttf file to use, since myFontFamily consists of up to 18 files?
- Which other TextStyle settings should be used here?: letterSpacing, baselineShift, lineHeight, etc. How am I supposed to determine these values?
My code is working, but this doesn't seem like the correct methodology. For example, if I wanted to change to a new font, am I required to understand the details in all the *.ttf files included in the new font? I cannot find any explanation on how this works - just examples of code like above.