開源一個圖片組件 react-native-border-radius-image

你們好,十一假期biu的一下就過去了,相信你們都沒有玩的盡興,不要緊,咱們還有周六週日雙休日(不加班),或者再堅持三個月就到了2020年的元旦了, 是否是發現時間過得太快了。
圖片描述
好了,開工了,😀。
筆者在ReactNative之Image在Android設置圓角圖片變形問題這篇文章中提到了安卓端設置圖片圓角的解決辦法,可是還須要你們複製代碼,不太友好(太麻煩,能不能npm一下,😀)。鑑於這種狀況,今天作了一個開源的組件# react-native-border-radius-image, 你們能夠試試看效果如何。歡迎你們star哦react

使用

一、安裝依賴

yarn add react-native-border-radius-image

二、使用

// 導入包
import RoundImage from 'react-native-border-radius-image'

// 頁面中引用, render 方法中
// Icon 爲設置的默認logo


render() {
    const imgUrl = itemData.logo_url ? {uri: itemData.logo_url} : Icon;
    return(
        <RoundImage
            source={imgUrl}
            size={40}
            style={{alignSelf: 'flex-start',
            marginTop: 2,}}
        />
    )
}

三、有圖有真相

圖片描述

這樣是否是更加愉快的使用了,😀。若是幫助了您,歡迎你們star。git

相關文章
相關標籤/搜索