StyleSheet

StyleSheet 是一个类似于 CSS StyleSheets 的抽象。

代码质量提示

将样式移出 render 函数，可以使代码更易于理解。
为样式命名是为 render 函数中的低级组件添加含义并鼓励复用的好方法。
在大多数 IDE 中，使用 StyleSheet.create() 可以提供静态类型检查和建议，以帮助您编写有效的样式。

参考

方法

`compose()`

tsx
static compose(style1: Object, style2: Object): Object | Object[];

组合两个样式，使 style2 将覆盖 style1 中的任何样式。如果任一样式为假值，则返回另一个样式，而不分配数组，从而节省内存并保持 PureComponent 检查的引用相等性。

`create()`

tsx
static create(styles: Object extends Record<string, ViewStyle | ImageStyle | TextStyle>): Object;

用于创建样式的身份函数。在 StyleSheet.create() 中创建样式的实际好处是能够针对原生样式属性进行静态类型检查。

`flatten()`

tsx
static flatten(style: Array<Object extends Record<string, ViewStyle | ImageStyle | TextStyle>>): Object;

将样式对象数组展平成一个聚合的样式对象。

`setStyleAttributePreprocessor()`

实验性

可能会发生重大更改，并且不会被可靠地通知。整个东西可能会被删除，谁知道呢？自行承担风险。

tsx
static setStyleAttributePreprocessor(
  property: string,
  process: (propValue: any) => any,
);

设置用于预处理样式属性值的函数。这用于内部处理颜色和转换值。除非您真的知道自己在做什么并且已用尽其他选择，否则不应使用此方法。

属性

`absoluteFill`

一种非常常见的模式是创建具有绝对定位和零定位（position: 'absolute', left: 0, right: 0, top: 0, bottom: 0）的覆盖层，因此 absoluteFill 可用于方便并减少这些重复样式的重复。如果您愿意，可以使用 absoluteFill 来创建 StyleSheet 中的自定义条目，例如：

`absoluteFillObject`

有时您可能想要 absoluteFill 但带有几个调整 - absoluteFillObject 可用于在 StyleSheet 中创建自定义条目，例如：

`hairlineWidth`

这被定义为平台上细线的宽度。它可以用作边框或两个元素之间的分隔线的厚度。示例

此常量将始终是偶数像素数（因此由它定义的线看起来会很清晰），并试图匹配底层平台上细线的标准宽度。但是，您不应该依赖它的大小是恒定的，因为在不同的平台和屏幕密度上，它的值可能会被计算得不同。

如果您的模拟器被缩小，细线宽度的线可能不可见。

参考

方法​

compose()​

create()​

flatten()​

setStyleAttributePreprocessor()​

属性​

absoluteFill​

absoluteFillObject​

hairlineWidth​

方法