RN中使用自定义字体 --- iOS

作者: 91阿生 | 来源:发表于2018-10-17 10:32 被阅读12次

    先看下效果图片:


    image.png

    步骤:

    1. 确保字体格式是ttf格式的字体,并将自定义的字体整体存入项目文件夹中


      image.png
    2. 其次,修改项目文件夹的package.json文件。
      assets: 字体文件的路径


      image.png

    3.随后,命令行进入项目文件夹根目录,运行如下命令:

    react-native link
    
    1. 检查下xocde中会多一个资源文件夹


      image.png

    查看下info.plist文件中:


    image.png

    使用的代码:


    image.png

    注意⚠️:关于iOS下fontFamily要求使用字体家族名,可以通过以下代码获取 fontFamilyname

    for(NSString *fontfamilyname in [UIFont familyNames]) {
    
        NSLog(@"family:'%@'",fontfamilyname);
    
        for(NSString *fontName in [UIFont fontNamesForFamilyName:fontfamilyname]) {
             NSLog(@"\tfont:'%@'",fontName);
        }
            NSLog(@"-------------");
    }
    

    复制 family: 打印出来的值。

    针对安卓: 安卓下fontFamily样式属性直接填写字体的文件名称即可(不填写后缀)。

    跨平台开发时,可以使用Platform.OS判断系统类型来进行适配。

    相关文章

      网友评论

        本文标题:RN中使用自定义字体 --- iOS

        本文链接:https://www.haomeiwen.com/subject/npelzftx.html