NativeScript zIndex установлен в XML не работает?

Question

Рассмотрим следующий XML:

<Page xmlns="http://schemas.nativescript.org/tns.xsd" > 
    <!-- UI Decalration --> 
    <AbsoluteLayout> 
     <GridLayout zIndex="99" height="100" width="100" backgroundColor="red"></GridLayout> 
     <GridLayout zIndex="1" height="200" width="200" backgroundColor="green"></GridLayout> 
    </AbsoluteLayout> 
</Page> 

В моем понимании красный квадрат должен быть виден, но он скрыт за один зеленый. Я делаю что-то неправильно?

Answer 1

Объявить z-index как свойство CSS, чтобы все элементы отображались как ожидаемые. Например:

page.css

.lower-grid { 
    z-index: 1; 
} 
.upper-grid { 
    z-index: 99; 
} 

page.xml

<AbsoluteLayout> 
     <GridLayout class="upper-grid" height="100" width="100" backgroundColor="red" /> 
     <GridLayout class="lower-grid" height="200" width="200" backgroundColor="green" /> 
    </AbsoluteLayout> 

Это решение работает для меня - иметь в виду, что г-индекс поддерживается для Android API 21 и выше ,