React Native iOS使用custom fontFam

作者: 小失 | 来源:发表于2016-04-27 14:57 被阅读1788次

    最近在使用custom fontFamily的时候遇到一个小坑.

    正常的使用方法可以参照这里:https://github.com/refinery29/react-native-cheat-sheet.
    但是我在使用某个custom fontFamily的时候,发现无论如何都不能正确取到这个font, 而其他的custom fontFamily则是可以的. 于是进去看源码.

    RCTConvert.m中,

    + (UIFont *)UIFont:(UIFont *)font withFamily:(id)family
                  size:(id)size weight:(id)weight style:(id)style
       scaleMultiplier:(CGFloat)scaleMultiplier
    

    最下边有段这样的代码:

      UIFont *bestMatch = font;
      CGFloat closestWeight = INFINITY;
      for (NSString *name in [UIFont fontNamesForFamilyName:familyName]) {
        UIFont *match = [UIFont fontWithName:name size:fontSize];
        if (isItalic == RCTFontIsItalic(match) &&
            isCondensed == RCTFontIsCondensed(match)) {
          CGFloat testWeight = RCTWeightOfFont(match);
          if (ABS(testWeight - fontWeight) < ABS(closestWeight - fontWeight)) {
            bestMatch = match;
            closestWeight = testWeight;
          }
        }
      }
    return bestMatch;
    

    我发现我在使用名为'Impat'的自定义字体时,

    isItalic == RCTFontIsItalic(match) &&
            isCondensed == RCTFontIsCondensed(match)
    

    return false 所以 bestMatch return nil.
    最终导致我无法正确取到这个font.

    我不明白为什么React Native的作者们, 要在这里判断一定是isItalic isCondensed 才有对应的逻辑, 如果不是, 就返回nil了.

    暂时的处理是:

      // Get the closest font that matches the given weight for the fontFamily
      UIFont *bestMatch = font;
      CGFloat closestWeight = INFINITY;
      for (NSString *name in [UIFont fontNamesForFamilyName:familyName]) {
        UIFont *match = [UIFont fontWithName:name size:fontSize];
        if (isItalic == RCTFontIsItalic(match) &&
            isCondensed == RCTFontIsCondensed(match)) {
          CGFloat testWeight = RCTWeightOfFont(match);
          if (ABS(testWeight - fontWeight) < ABS(closestWeight - fontWeight)) {
            bestMatch = match;
            closestWeight = testWeight;
          }
          else { // else是我加的
            bestMatch = match;
          }
        }
        else { // else是我加的. 使用"Impact"字体时,并没有走这个对应的if.导致bestMatch为nil
          bestMatch = match;
        }
      }
    
      return bestMatch;
    

    在一个类似的issue下提了: https://github.com/facebook/react-native/issues/6046#issuecomment-214984034
    暂时记录一下, 等有时间仔细看看这里.

    相关文章

      网友评论

        本文标题:React Native iOS使用custom fontFam

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