react-本机导航showModal自定义大小

import { Navigation } from 'react-native-navigation';

// 定义模态框组件
const MyModalScreen = (props) => {
  return (
    <View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}>
      <Text>This is a custom modal!</Text>
      <Button title="Close Modal" onPress={() => Navigation.dismissModal(props.componentId)} />
    </View>
  );
};

// 显示模态框
const showModal = () => {
  Navigation.showModal({
    stack: {
      children: [
        {
          component: {
            name: 'MyModalScreen',
            options: {
              modalPresentationStyle: 'formSheet', // 可以选择 'fullScreen', 'pageSheet', 'formSheet', 'overFullScreen'
              modalSize: 'half', // 自定义大小，可以是 'full' 或 'half'
              // 其他自定义样式
              style: {
                backgroundColor: 'white',
                borderRadius: 10,
                shadowColor: '#000',
                shadowOffset: { width: 0, height: 2 },
                shadowOpacity: 0.2,
                shadowRadius: 2,
                elevation: 5,
              },
            },
          },
        },
      ],
    },
  });
};

// 在某个组件中调用 showModal 函数
const App = () => {
  return (
    <View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}>
      <Button title="Show Modal" onPress={showModal} />
    </View>
  );
};

export default App;