Font
Semantic styles and exact sizes
One value carrying size, weight, family and design. The named styles follow the reader's text-size setting; Font.system pins an exact number and does not.
Properties
LARGE_TITLERootlessFontTITLERootlessFontTITLE2RootlessFontTITLE3RootlessFontHEADLINERootlessFontSUBHEADLINERootlessFontBODYRootlessFontCALLOUTRootlessFontFOOTNOTERootlessFontCAPTIONRootlessFontCAPTION2RootlessFontMethods
.withWeight(weight)RootlessFontA copy at a different weight, e.g. Font.CAPTION.withWeight(FontWeight.bold).
- weight String required
.withFamily(name)RootlessFontA copy in a different family.
- name String required
.withDesign(design)RootlessFontA copy in a system-font design - rounded, serif or monospaced.
- design String required
.rounded()RootlessFontShorthand for withDesign(FontDesign.rounded).
.serif()RootlessFontShorthand for withDesign(FontDesign.serif).
.monospaced()RootlessFontShorthand for withDesign(FontDesign.monospaced). Keeps digits from shifting width as a number changes.
Font.system(size, weight?, design?)RootlessFontA system font at an exact point size, optionally in a design.
- size Number required
Point size.
- weight FontWeight
Defaults to regular.
- design FontDesign
Defaults to the system font.
Font.custom(name, size, weight?)RootlessFontA named family such as "Avenir". Device.fonts lists what is installed; an unknown name falls back to the system font.
- name String required
A family name from Device.fonts.
- size Number required
Point size.
- weight FontWeight
Defaults to regular.
Examples
Setting type
Text("Steps", { font: Font.HEADLINE })
Text("4,213", { font: Font.system(26, FontWeight.bold) })
Text("today", { font: Font.CAPTION.withWeight(FontWeight.medium) })
Text("Hello", { font: Font.custom("Avenir", 20) })