Shoutem UI中的卡片不工作

Question

我正在尝试shoutem-ui文档中的Card示例，但它没有显示全部内容，这里是我的.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>