我在 native react 之上使用 native 基础组件，我想知道如何在 UI 中使卡片呈圆形而不是矩形。 有圆形的 Prop 吗？
最佳答案
好吧，实际上没有人能回答这个问题，但幸运的是我在 github 上发现了这个:
import React, { Component } from "react";
import { Container, Header, Title, Content, Button, Icon, Card, CardItem, Text, Body, Left, Right, IconNB, View } from "native-base";
export default class App extends Component {
constructor(props) {
super(props);
this.state = {
loading: true
};
}
static navigationOptions = {
header:null
};
async componentWillMount() {
await Expo.Font.loadAsync({
Roboto: require("native-base/Fonts/Roboto.ttf"),
Roboto_medium: require("native-base/Fonts/Roboto_medium.ttf"),
Ionicons: require("@expo/vector-icons/fonts/Ionicons.ttf"),
});
this.setState({ loading: false });
}
render() {
if (this.state.loading) {
return <Expo.AppLoading />;
}
else
return (
<Container>
<Header>
<Left>
<Button transparent>
<Icon name="arrow-back" />
</Button>
</Left>
<Body>
<Title>Header</Title>
</Body>
<Right />
</Header>
<Content padder>
<Card style={{ borderRadius: 8 }}>
<CardItem header bordered style={{ borderTopLeftRadius: 8, borderTopRightRadius: 8 }}>
<Text>NativeBase</Text>
</CardItem>
<CardItem bordered>
<Body>
<Text>
NativeBase is a free and open source framework that enable
developers to build
high-quality mobile apps using React Native iOS and Android
apps
with a fusion of ES6.
</Text>
</Body>
</CardItem>
<CardItem bordered>
<Body>
<Text>
NativeBase builds a layer on top of React Native that provides
you with
basic set of components for mobile application development.
</Text>
</Body>
</CardItem>
<CardItem bordered>
<Body>
<Text>
Get on the mobile fast track with NativeBase, the
fastest-growing platform
and tool set for iOS and Android development.
</Text>
</Body>
</CardItem>
<CardItem footer bordered style={{ borderBottomLeftRadius: 8, borderBottomRightRadius: 8 }}>
<Text>GeekyAnts</Text>
</CardItem>
</Card>
</Content>
</Container >
);
}
}
谢谢阿基尔极客!!!! Here是原始帖子的链接
Here是另一个与圆角卡片背景图像相关的链接
关于react-native - 如何在 native react 、 native 基础中使卡片呈圆形，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/53551511/