expo xml font
1.0.0
이 엑스포 플러그인을 사용하여 Android XML 글꼴을 쉽게 사용하십시오.
이 플러그인은 https://github.com/jsamr/react-native-font-demo에서 React Native에서 XML 글꼴을 사용하는 방법에 대한 멋진 가이드를 구축하지만 API를 사용하기 쉬운 API를 제공하므로 기본 파일과 수동으로 바이올링 할 필요가 없습니다.
메모
v3은 엑스포 50 <=에 대한 것이고 V2는 엑스포 49> =입니다.
# using yarn
yarn add expo-xml-font
# using npm
npm install expo-xml-fontapp.json 또는 app.config.js 파일의 plugins 섹션에 플러그인을 추가하십시오. {
"plugins" : [ " expo-xml-font " ]
}이 예제는 예제로 Inter를 사용하지만 원하는 글꼴을 사용할 수 있습니다.
Inter-Thin.ttf (100)
Inter-ExtraLight.ttf (200)
Inter-Light.ttf (300)
Inter-Regular.ttf (400)
Inter-Medium.ttf (500)
Inter-Semibold.ttf (600)
Inter-Bold.ttf (700)
Inter-Extrabold.ttf (800)
Inter-Black.ttf (900)
inter_thin.ttf (100)
inter_extraLight.ttf (200)
inter_light.ttf (300)
inter_regular.ttf (400)
inter_medium.ttf (500)
inter_semibold.ttf (600)
inter_bold.ttf (700)
inter_extrabold.ttf (800)
inter_black.ttf (900)
이 파일을 프로젝트가있는 폴더에 복사하십시오. 예를 들어 글꼴 파일을 assets/fonts 폴더에 넣을 수 있습니다.
app.json 또는 app.config.js 에서 expo-xml-font 구성하십시오.
{
"plugins" : [
[
" expo-xml-font " ,
[
{
"name" : " Inter " ,
"folder" : " assets/fonts " ,
"variants" : [
{ "fontFile" : " inter_thin " , "fontWeight" : 100 },
{ "fontFile" : " inter_extralight " , "fontWeight" : 200 },
{ "fontFile" : " inter_light " , "fontWeight" : 300 },
{ "fontFile" : " inter_regular " , "fontWeight" : 400 },
{ "fontFile" : " inter_medium " , "fontWeight" : 500 },
{ "fontFile" : " inter_semibold " , "fontWeight" : 600 },
{ "fontFile" : " inter_bold " , "fontWeight" : 700 },
{ "fontFile" : " inter_extrabold " , "fontWeight" : 800 },
{ "fontFile" : " inter_black " , "fontWeight" : 900 }
]
}
]
]
]
}expo prebuild 실행하여 XML 글꼴을 생성하십시오. 이제 코드에서 사용할 수 있습니다! expo-xml-font 사용하는 경우 글꼴의 모든 세부 사항을 제공하는 물체를 전달해야합니다.
type Options = {
/**
* Name of font
* @example "Inter"
*/
name : string ;
/**
* Path of folder which contains font files. It's alright if the path is relative.
* @example "assets/fonts"
*/
folder : string ;
variants : {
/**
* Font file for font. Do NOT include the extension.
* @example "inter_regular.ttf" -> "inter_regular"
*/
fontFile : string ;
/** The font weight of the provided font file */
fontWeight : 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900 ;
/**
* Specifies whether or not the font file is italic
* @default false
*/
italic ?: boolean ;
} [ ] ;
} [ ] ;이 플러그인은 글꼴 배열을 가져 오므로 원하는만큼의 글꼴 패밀리를 지정할 수 있습니다.