添加带有react原生和UI Kitten的顶角图像

j2cgzkjk  于 2022-12-30  发布在  React
关注(0)|答案(1)|浏览(108)

我需要在React Native APP的左上角添加绿色圆圈:

但我不知道怎么做。绿色圆圈技术上是一个.png(我得到的图像)我尝试了这个:

<Layout style={styles.container}>
        <Image source={require('../assets/style/images/Vector.png')}  style={styles.topImg}/>
        .......

</Layout>

const styles = StyleSheet.create({
    topImg: {
        position: 'absolute',
        width: 200,
        top: 50,
        left: 50,
        right: 0,
        bottom: 0,
    },
    container: {
        flex: 1,
        flexDirection: 'column'
    },
    layout: {
        justifyContent: 'center',
        alignItems: 'center',
    }
});

但是它不起作用,绿色圆圈不显示...

l7mqbcuq

l7mqbcuq1#

工作示例:https://snack.expo.dev/@msbot01/vengeful-croissant如果要使用图像,请按照View的操作调整图像

<View>
  <View style={{backgroundColor:'green', height:100, width:100, borderRadius:100, marginTop:-50,position:'absolute', opacity:0.5}}>
  </View>
  <View style={{backgroundColor:'green', height:100, width:100, borderRadius:100, marginLeft:-50,position:'absolute', opacity:0.4}}>
  </View>
</View>

相关问题