react-native-android - Shoutem UI 中的卡片不起作用

Question

我正在尝试Card来自文档的示例shoutem-ui，但这里没有显示完整内容是我的 .js 文件

import React, { Component } from 'react';
import {
  View,
  Subtitle,
  Card,
  Image,
  Caption
} from '@shoutem/ui'

export default class MyApp extends Component {
  render() {
    return (
      <Card>
        <Image
          styleName="medium-wide"
            source={{uri: 'https://shoutem.github.io/img/ui-toolkit/examples/image-10.png'}}
        />
        <View styleName="content">
          <Subtitle>Choosing The Right Boutique Hotel For You</Subtitle>
          <Caption>21 hours ago</Caption>
        </View>
      </Card>
    );
  }
}

还有我的模拟器的屏幕截图

请帮我解决问题。谢谢

Answer 1

您需要通过将其 flex 设置为 0 来覆盖视图的样式。

在显示全宽卡片的情况下：设置卡片的宽度为空。

<Card style={{ width: null }}>
  ...
  <View style={{ flex: 0 }}>
    ...
  </View>
</Card>