CardView в Xamarin.Forms

Я ищу способ динамически создавать элементы управления в виде карточек, которые выглядят следующим образом:

введите описание изображения здесь

Я выполнил поиск и нашел эту статью, в которой показано вы узнаете, как реализовать CardView в проекте Xamarin.Android. Но я использую Xamarin.Forms, поэтому могу скомпилировать и для iOS.

Я также попытался использовать ListView с ViewCells и парой тегов StackLayout, но не смог даже приблизиться к этому, вот код:

<ListView x:Name="listView">
    <ListView.ItemTemplate>
        <DataTemplate>
            <ViewCell Height="300">
                <StackLayout>
                    <StackLayout Orientation="Horizontal">
                        <Image Source="{Binding UserAvatar}" />
                        <Label Text="{Binding UserName}" />
                    </StackLayout>
                    <Image Source="{Binding BittImage}" />
                </StackLayout>
            </ViewCell>
        </DataTemplate>
    </ListView.ItemTemplate>
</ListView>

Я новичок в Xamarin, поэтому, если мне не хватает чего-то базового, дайте мне знать, ребята.


person Multitut    schedule 07.04.2017    source источник


Ответы (1)


Ты на правильном пути. Используйте ListView с Frame в качестве корневого элемента и поля и установите соответствующий цвет фона ListView. Это должно придать вам вид карты. Затем вы заполняете карту по своему усмотрению.

<ListView x:Name="listView" BackgroundColor="Gray">
    <ListView.ItemTemplate>
        <DataTemplate>
            <ViewCell Height="300">
                <Frame HasShadow="true" Margin="5">
                    <StackLayout>
                        <StackLayout Orientation="Horizontal">
                            <Image Source="{Binding UserAvatar}" />
                            <Label Text="{Binding UserName}" />
                        </StackLayout>
                        <Image Source="{Binding BittImage}" />
                    </StackLayout>
                </Frame>
            </ViewCell>
        </DataTemplate>
    </ListView.ItemTemplate>
</ListView>
person Adam    schedule 08.04.2017
comment
Спасибо! Я пробую другой порядок / расположение элементов управления, но он показывает только пустые кадры (1 кадр на запись) - person Multitut; 08.04.2017