React-Native怎樣讓圖片占滿屏幕

問題

rn里Image不能像css那樣width:100%,必須制定一個(gè)寬度,但是各種移動(dòng)設(shè)備不同的屏幕寬度,法克,怎么破

解決方法

先通過Dimensions難拿到屏幕寬度,然后在style直接使用,舉個(gè)栗子:

<Image resizeMode={'cover'} style={[styles.header_top_wrap_img]} source={require('../logo.png')}/>

//style
const win = Dimensions.get('window');

const styles = StyleSheet.create({
header_top_wrap_img: {
    width: win.width,
    height: 269,
  },
});
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • 前言 學(xué)習(xí)本系列內(nèi)容需要具備一定 HTML 開發(fā)基礎(chǔ),沒有基礎(chǔ)的朋友可以先轉(zhuǎn)至 HTML快速入門(一) 學(xué)習(xí) 本人...
    珍此良辰閱讀 20,822評(píng)論 15 16
  • 前言 學(xué)習(xí)本系列內(nèi)容需要具備一定 HTML 開發(fā)基礎(chǔ),沒有基礎(chǔ)的朋友可以先轉(zhuǎn)至 HTML快速入門(一) 學(xué)習(xí) 本人...
    珍此良辰閱讀 4,662評(píng)論 2 19
  • 問答題47 /72 常見瀏覽器兼容性問題與解決方案? 參考答案 (1)瀏覽器兼容問題一:不同瀏覽器的標(biāo)簽?zāi)J(rèn)的外補(bǔ)...
    _Yfling閱讀 14,168評(píng)論 1 92
  • 額,最近公司的接口讓人給通過抓包給破解了,搞不清楚https的證書是怎么泄露的,然后就有了這么個(gè)需求,只要是網(wǎng)絡(luò)設(shè)...
    PlutoMa閱讀 11,440評(píng)論 15 19
  • 知彼解己想要理解到位,就要把它拆分成兩個(gè)——知彼和解己... 知彼在這里的意思是通過認(rèn)真的聆聽、分...
    FineYogaSunny菩提閱讀 338評(píng)論 0 0

友情鏈接更多精彩內(nèi)容