react-native布局中的層級問題(zIndex,elevation)


關於層級的zIndex/elevation

1、zIndex是rn在0.30開始支持的屬性,是可以生效的;

2、shadow和elevation

  • shadow(陰影)開頭的樣式現在可以在iOS上應用,但在安卓中是不生效的.
  • 而Android上對應的屬性是elevationelevation
    設置elevation屬性就等價於使用原生的elevation API,因而也有同樣的限制(比如最明顯的就是需要Android 5.0以上版本)。此外還會影響到層疊視圖在空間z軸上的順序

結論

對於Android,兩個同一層級的定位組件(position:“absolute”)

情況 在z軸的層疊關系
既沒有ZIndex屬性,又沒有elevation 屬性 由其擺放位置決定的,放在下面的組件會在上層
兩個組件只有zIndex沒有elevation屬性時 zIndex大的在上層
兩個組件有elevation屬性 elevation大的在上層
兩個組件既有zIndex屬性elevation屬性 以elevation為准

注:對於IOS,同層級的組件,z軸的層疊關系只與擺放順序與zIndex有關,與elevation無關


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM