StyleSheet

StyleSheet 是一种类似于 CSS StyleSheet 的抽象。

代码质量提示

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

参考

方法

`compose()`

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

组合两个样式，以便 `style2` 将覆盖 `style1` 中的任何样式。如果任一样式为假值，则返回另一个样式，无需分配数组，从而节省了分配并为 PureComponent 检查维护了引用相等性。

`create()`

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

用于创建样式的标识函数。在 `StyleSheet.create()` 内部创建样式的主要实际好处是对原生样式属性进行静态类型检查。

`flatten()`

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

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

`setStyleAttributePreprocessor()`

警告：实验性功能。可能会发生很多重大更改，并且不会可靠地发布公告。整个功能可能会被删除，谁知道呢？使用风险自负。

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

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

属性

`absoluteFill`

一个非常常见的模式是使用 position absolute 和零定位创建叠加层（`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​

方法