flutter 2014年材料规范文本主题与2018年、2021年材料规范文本主题有何不同?

6ojccjat  于 2023-03-09  发布在  Flutter
关注(0)|答案(1)|浏览(108)

材料规范2014的文本主题与材料规范2018和2021的文本主题有何不同?

如果你更新flutter SDK到最新版本,你会收到几条关于textTheme使用的警告消息。

cbwuti44

cbwuti441#

TextThemeAPI最初基于原始材质(2014)设计规范,使用了不同的文本样式名称。所有值如下所示。

2021规范-文本样式

NAME         SIZE       WEIGHT     SPACING

displayLarge    regular      57.0       0
displayMedium   regular      45.0       0
displaySmall    regular      36.0       0
headlineLarge   regular      32.0       0
headlineMedium  regular      28.0       0
headlineSmall   regular      24.0       0
titleLarge      medium       22.0       0
titleMedium     medium       16.0      0.15
titleSmall      medium       14.0      0.1
labelLarge      medium       14.0      0.1
labelMedium     medium       12.0      0.5
labelSmall      medium       11.0      0.5
bodyLarge       regular      16.0      0.15
bodyLarge       regular      14.0      0.25
bodyLarge       regular      12.0      0.4

2018规范-文本样式

NAME         SIZE  WEIGHT  SPACING

headline1    96.0  light   -1.5
headline2    60.0  light   -0.5
headline3    48.0  regular  0.0
headline4    34.0  regular  0.25
headline5    24.0  regular  0.0
headline6    20.0  medium   0.15
subtitle1    16.0  regular  0.15
subtitle2    14.0  medium   0.1
body1        16.0  medium   0.5   (bodyText1)
body2        14.0  regular  0.25  (bodyText2)
button       14.0  medium   1.25
caption      12.0  regular  0.4
overline     10.0  regular  1.5

2014规范-文本样式

NAME       SIZE   WEIGHT   SPACING  2018 NAME

display4   112.0  thin     0.0      headline1
display3   56.0   normal   0.0      headline2
display2   45.0   normal   0.0      headline3
display1   34.0   normal   0.0      headline4
headline   24.0   normal   0.0      headline5
title      20.0   medium   0.0      headline6
subhead    16.0   normal   0.0      subtitle1
body2      14.0   medium   0.0      body1 (bodyText1)
body1      14.0   normal   0.0      body2 (bodyText2)
caption    12.0   normal   0.0      caption
button     14.0   medium   0.0      button
subtitle   14.0   medium   0.0      subtitle2
overline   10.0   normal   0.0      overline

如何使用新的TextTheme属性?(flutter v1.13.8及以上版本)您可以使用所需的属性,如下所示。

Theme.of(context).textTheme.headline1
Theme.of(context).textTheme.headline2
Theme.of(context).textTheme.headline3
Theme.of(context).textTheme.headline4
Theme.of(context).textTheme.headline5
Theme.of(context).textTheme.headline6
Theme.of(context).textTheme.subtitle1
Theme.of(context).textTheme.subtitle2
Theme.of(context).textTheme.body1
Theme.of(context).textTheme.body2
Theme.of(context).textTheme.button
Theme.of(context).textTheme.caption
Theme.of(context).textTheme.overline

哪些属性名是不变的?只有下面两个属性名在两个Theme类中是通用的。

Theme.of(context).textTheme.caption
Theme.of(context).textTheme.overline

相关问题