NativeScript: как стилизации ListView ItemTemplate

Question

У меня есть следующий NativeScript код:

<Page loaded="onPageLoaded"> 
    <GridLayout rows="auto, *"> 
     <ListView items="{{ items }}" row="1"> 
      <ListView.itemTemplate > 
       <Image url="{{ url }}" /> 
      </ListView.itemTemplate> 
     </ListView> 
    </GridLayout> 
</Page> 

Я хотел бы, чтобы стиль ListView-Item, придавая ей отступы, так что каждый образ имеет немного пробелов вокруг него , Я попытался дать ему класс и стиль класса в css, но я не смог его изменить.

Однако я смог самостоятельно смоделировать изображение (давая ему преимущество). Можно ли создать стиль listviewItem-container (например, я хотел бы создать div-контейнер в css)?

Answer 1

Вы правы! Сейчас невозможно создать стиль контейнера элементов - только содержимое элемента. Мы подумаем, как это сделать в будущем.

Благодарим вас за отзыв!

Answer 2

Вы можете использовать элемент Border, чтобы обернуть содержимое itemTemplate.

<Page loaded="onPageLoaded"> 
    <GridLayout rows="auto, *"> 
     <ListView items="{{ items }}" row="1"> 
      <ListView.itemTemplate > 
       <Border borderWidth="0"> 
        <Image url="{{ url }}" /> 
       </Border> 
      </ListView.itemTemplate> 
     </ListView> 
    </GridLayout> 
</Page> 

Answer 3

На данный момент (1.5.2), вы можете поместить изображения внутри контейнера макета и применить стиль к этому контейнеру:

<Page loaded="onPageLoaded"> 
    <GridLayout rows="auto, *"> 
     <ListView items="{{ items }}" row="1"> 
      <ListView.itemTemplate > 
       <StackLayout> 
        <Image url="{{ url }}" horizontalAlignment="stretch"/> 
       </StackLayout> 
      </ListView.itemTemplate> 
     </ListView> 
    </GridLayout> 
</Page>