1

在 TouchableOpacity使用Card元素 。

当我按下它时,卡片背景颜色太烦人了 wrt 不透明度。

当我删除 borderRadius时,这个问题不会发生

当我使用borderRadius时 ,会出现这个问题

我已经看到了我正在使用的所有组件的道具,但对我没有任何帮助。

问题:

当我在 Card containerStyle 中使用borderRadius 时,TouchableOpacity 颜色与 Card 颜色不匹配。大约相反。

我怎样才能给出相同的颜色,所以当按下卡片时,没有显示卡片白色背景颜色?

组件.js

               <TouchableOpacity>
                            <Card
                            containerStyle={styles.MainCardStyle}
                            transparent>
                                <CardItem
                                    cardBody
                                    >
                                    <View style= 
                                       {styles.cardContentStyle}>
                                        <Image
                                            style={styles.iconStyle}
                                            resizeMode="contain"
                                            source= 
                                   {require('../../assets/database.png')}
                                        />
                                        <Text style= 
                               {styles.cardTextStyle}>Setting</Text>
                                    </View>
                                </CardItem>
                            </Card>
             </TouchableOpacity>

样式.js

export const styles=({
    MainCardStyle: {
         borderRadius: 16,

    },
    cardContentStyle: {
        flexDirection: 'row',

    },

实际输出

实际输出

期望的输出

预期产出

4

1 回答 1

0

将 TouchableOpacity 放入卡片并使用:

样式={ ...StyleSheet.absoluteFillObject }

原因 StyleSheet 必须被导入

于 2019-01-14T12:47:05.257 回答