RN 设置图片Image圆角,支持某个角设置

2018-06-04  本文已影响0人  春雨霏霏_____

关键逻辑,父视图设置    overflow:'hidden' 属性进行处理

import React, { Component } from 'react';

import {

  AppRegistry,

  Image,

  View,

  StyleSheet

} from 'react-native';

class ImageBorder extends Component

{

    render(

      View style={styles.container}

             Image style ={styles.imageStyle}  source={require('./img/xxxxxxx.png')}

     View

    )

    {

    return (

    )

    };

};

const styles = StyleSheet.create({

    container: {

    backgroundColor:'red',

    borderTopLeftRadius:20,

    overflow:'hidden',

    height: 200,

    marginLeft:100,

    width: 200,

    borderTopRightRadius:20

    ,

    },

    imageStyle: {

      padding: 10,

      fontSize: 18,

      height: 200,

      width: 200

    }

  })

  module.exports = ImageBorder

上一篇下一篇

猜你喜欢

热点阅读