Flutter 提供软件包时,自定义字体不会呈现为金色图像

Flutter 提供软件包时,自定义字体不会呈现为金色图像,flutter,flutter-test,Flutter,Flutter Test,我在模块主题中定义了自定义字体。此模块是模块小部件中的依赖项 widgets模块中的小部件应用自定义字体,如下所示 style: TextStyle( fontSize: fontSize, fontFamily: "IconActions", package: "theme" ) 它很好用 不幸的是,这种自定义字体没有呈现在金色图像上。我必须删除包:“theme”来解决这个问题。但这会破坏应用程序,字体不再显示。 因此,基本上我可以让字体在生产代码或测试代码中正常工作,但决不能两

我在模块
主题
中定义了自定义字体。此模块是模块
小部件中的依赖项

widgets模块中的小部件应用自定义字体,如下所示

style: TextStyle(
  fontSize: fontSize,
  fontFamily: "IconActions",
  package: "theme"
)
它很好用

不幸的是,这种自定义字体没有呈现在金色图像上。我必须删除
包:“theme”
来解决这个问题。但这会破坏应用程序,字体不再显示。 因此,基本上我可以让字体在生产代码或测试代码中正常工作,但决不能两者兼而有之

自定义字体加载到测试的
设置
方法中

final fontData = File('assets/fonts/IconActions.ttf')
  .readAsBytes()
  .then((bytes) => ByteData.view(Uint8List.fromList(bytes).buffer));
final fontLoader = FontLoader('IconActions')..addFont(fontData);
await fontLoader.load();

我是遗漏了什么,还是它是一个bug?

因此基本上解决方案是从TextStyle中删除
包:“theme”
,使其正常工作。但这是解决方案的一半,因为正如我在问题中提到的,golden文件的字体渲染器正确,但字体在应用程序中不起作用

要使其在应用程序中工作,我们需要给定的项目结构:

pubspec.yaml(模块
主题

widget.dart(模块
主题

现在,在模块
widgets
中,该模块包含
main.dart
及其运行的
main
函数,您必须再次定义字体:

pubspec.yaml(模块
widgets


现在字体在应用程序和黄金图像中都正确显示了。

去年我就遇到了这个问题,也无法在测试中加载字体。。我不知道是
package
参数破坏了它,所以感谢您使用该结果进行更新

至于另一种解决方法,有一种方法可以两全其美,您可以拥有独立的字体包,而不必在使用它的应用程序中声明打包的字体文件

例如,我们有一个公司品牌/排版软件包,我们在多个应用程序中使用该软件包,其中包含所有预配置的
TextStyle
声明,另一个独立软件包具有自定义生成的
iconda
,存储在
*.ttf
文件中(如FontAwesome)

包装方面: 公开发行


颤振:
使用材料设计:真实
资产:
-资产/字体/
字体:
-家庭:MyFont
字体:
-资产:资产/font/MyFont.ttf
体重:400
#等
打包的
文本样式

class-BrandStyles{
静态常数_packageName='';
静态常量headline1Style=TextStyle(
颜色:颜色,黑色,
fontFamily:“MyFont”,
字体大小:60.0,
fontStyle:fontStyle.normal,
fontWeight:fontWeight.w400,
身高:1.16,
字母间距:0,
包装:_packageName,
);
//等
}
黄金测试

void main(){
最终小部件=MaterialApp(
主题:主题数据(
textTheme:textTheme(
//使用自定义扩展方法删除“package”值
headline1:BrandStyles.headline1Style.trimFontPackage(),
),
),
家:脚手架(
主体:安全区域(子项:StylesExample()),
),
);
设置(()异步{
TestWidgetsFlutterBinding.ensureInitialized();
final file=file('path/to/packated/asset/MyFont.ttf')。readAsBytesSync();
final bytes=Future.value(file.buffer.asByteData());
wait(FontLoader('MyFont')…addFont(bytes)).load();
});
testWidgets('Golden排版测试',(WidgetTester)异步{
等待测试仪pumpWidget(小部件);
待会儿(
find.byType(MaterialApp),matchesGoldenFile('goldens/typography.png');
});
}
扩展样式TextStyle上的扩展{
TextStyle trimFontPackage(){
返回文本样式(
继承:继承,
颜色:颜色,
背景色:背景色,
fontSize:fontSize,
fontWeight:fontWeight,
fontStyle:fontStyle,
字母间距:字母间距,
字间距:字间距,
text基线:text基线,
高度:高度,,
地点:地点,
前景:前景,
背景:背景,,
阴影:阴影,
fontFeatures:fontFeatures,
装饰:装饰,,
装饰颜色:装饰颜色,
装饰风格:装饰风格,
装饰厚度:装饰厚度,
debugLabel:debugLabel,
///`replaceAll`仅在加载多个字体时才需要,
///否则,将值设置为您的单个“fontFamily”名称
fontFamily:fontFamily.replaceAll('packages/',''),
);
}
}
或者,如果您和我一样,对自定义图标也有同样的问题,您可以使用类似的扩展方法,在您的自定义
IconData
黄金测试中执行同样的操作,删除
fontPackage
值:

IconData上的扩展ICONEX{ IconData CONVERTOGOLDEN()=>IconData( 这个代码点, fontFamily:this.fontFamily, ); }
你的应用程序端 公开发行


# ...
依赖项:
颤振:
sdk:颤振
:
吉特:
url:.git
裁判:
主飞镖


类MyApp扩展了无状态小部件{
@凌驾
小部件构建(构建上下文){
返回材料PP(
标题:“颤振演示”,
主题:ThemeData.light().copyWith(
textTheme:textTheme(
标题1:品牌风格。标题1风格,
),
),
);
}
}
现在不再需要在应用程序
pubspec.yaml
中声明字体,甚至不需要将样式包与实现应用程序放在同一个项目/存储库中

flutter:
  fonts:
   - family 'ComicSans'
     fonts:
     - asset: packages/theme/fonts/ComicSans.ttf
style: TextStyle(
  fontSize: fontSize,
  fontFamily: "ComicSans",
)
dependencies:
  flutter:
    sdk: flutter
  theme:
    path: ../path/to/theme/module

flutter:
  fonts:
   - family 'ComicSans'
     fonts:
     - asset: packages/theme/fonts/ComicSans.ttf