expo 中 calc()的用法

在 Expo 中，`calc()` 函数可以用于指定组件的宽度或高度。它可以帮助你实现响应式设计，让你的组件在不同设备上具有不同的尺寸。

`calc()` 函数的语法与 CSS 中的一致，可以使用加减乘除等运算符。例如，你可以使用以下代码指定一个宽度为屏幕宽度的一半：

import React from 'react';
import { StyleSheet, View } from 'react-native';

export default function App() {
  return (
    <View style={styles.container}>
      <View style={[styles.box, { width: 'calc(50% - 10px)' }]} />
    </View>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    alignItems: 'center',
    justifyContent: 'center',
    backgroundColor: '#fff',
  },
  box: {
    height: 100,
    backgroundColor: '#f00',
  },
});

在这个例子中，我们使用 `calc()` 函数来计算一个宽度值，该值为屏幕宽度的一半减去 10 个像素。这样，我们就可以在不同大小的设备上使盒子的宽度保持一致。

需要注意的是，`calc()` 函数目前只支持在 `style` 属性中使用，不能在样式表中使用。