Отображение элементов CollectionView Xamarin из разных источников внутри StackLayout не отображается должным образом - PullRequest
0 голосов
/ 28 сентября 2019

Я работаю с Xamarin CollectionView и Stacklayout и пытаюсь отобразить списки элементов из разных источников в форме представлений коллекции.Однако вывод кода, показанного ниже, - это то, чего я не ожидал.Результат первого представления коллекции отображается в небольшом окне, а все остальные элементы можно прочитать с помощью прокрутки.Однако я хочу отобразить их все без использования прокрутки, и то же самое должно сработать, если в код добавлено больше коллекций.Я что-то упускаю здесь?

<?xml version="1.0" encoding="UTF-8"?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms" 
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             Title="Arhoo"
             x:Class="Arhoo.Pages.MainFeedPage">

        <StackLayout>
            <StackLayout VerticalOptions="FillAndExpand">                
                <CollectionView x:Name="ItemsListView" 
                        ItemsSource="{Binding Hotels}" 
                        VerticalOptions="FillAndExpand" Margin="10" Visual="Material">

                    <CollectionView.Header>
                        <StackLayout BackgroundColor="LightGray" HeightRequest="50" >
                            <Label Visual="Material" Text="Hotels" FontSize="Medium" FontAttributes="Bold" />
                        </StackLayout>
                    </CollectionView.Header>
                    <CollectionView.ItemsLayout>
                        <GridItemsLayout Orientation="Vertical"  Span="2"/>
                    </CollectionView.ItemsLayout>
                    <CollectionView.EmptyView>
                        <StackLayout>
                            <Label HorizontalOptions="CenterAndExpand" VerticalOptions="CenterAndExpand" Text="Loading Hotels"/>
                        </StackLayout>
                    </CollectionView.EmptyView>
                    <CollectionView.ItemTemplate>
                        <DataTemplate>
                            <StackLayout Visual="Material">
                                <ContentView Padding="10">
                                    <Frame HasShadow="false" OutlineColor="#2f2f2f" Padding="0" CornerRadius="2">
                                        <Grid BackgroundColor="#f2f2f2" MinimumHeightRequest="400">
                                            <Image Source="{Binding Image}" Aspect="AspectFill"/>
                                            <BoxView BackgroundColor="#000000" Opacity="0.4"/>
                                            <Label Text="{Binding Text}" Margin="15" TextColor="White" VerticalOptions="End"
                                       VerticalTextAlignment="End" LineBreakMode="NoWrap" FontSize="18" />
                                        </Grid>
                                    </Frame>
                                </ContentView>
                            </StackLayout>
                        </DataTemplate>
                    </CollectionView.ItemTemplate>
                </CollectionView>

            </StackLayout>            
            <StackLayout VerticalOptions="FillAndExpand">

                <CollectionView x:Name="TOsListView" 
                        ItemsSource="{Binding TourOperators}" 
                        VerticalOptions="FillAndExpand" >
                    <CollectionView.Header>
                        <StackLayout BackgroundColor="LightGray" HeightRequest="20" >
                            <Label Margin="10,0,0,0" Text="Tour Operators" FontSize="Medium" FontAttributes="Bold" />
                        </StackLayout>
                    </CollectionView.Header>
                    <CollectionView.ItemsLayout>
                        <GridItemsLayout 
                    Orientation="Vertical"
                    Span="2"/>
                    </CollectionView.ItemsLayout>
                    <CollectionView.EmptyView>
                        <StackLayout>
                            <Label 
                        HorizontalOptions="CenterAndExpand"
                        VerticalOptions="CenterAndExpand"
                        Text="Loading TOs"/>
                        </StackLayout>
                    </CollectionView.EmptyView>
                    <CollectionView.ItemTemplate>
                        <DataTemplate>
                            <ContentView Padding="10" >
                                <Frame HasShadow="false"
                               OutlineColor="#2f2f2f"
                               Padding="0"
                               CornerRadius="2">
                                    <Grid BackgroundColor="#f2f2f2">

                                        <Image Source="{Binding Image}"
                                       Aspect="AspectFill"/>

                                        <BoxView BackgroundColor="#000000"
                                         Opacity="0.4"/>

                                        <Label Text="{Binding Text}"
                                       Margin="15"
                                       TextColor="White"
                                       VerticalOptions="End"
                                       VerticalTextAlignment="End"
                                       LineBreakMode="NoWrap" 
                                       FontSize="18" />
                                    </Grid>
                                </Frame>
                            </ContentView>
                        </DataTemplate>
                    </CollectionView.ItemTemplate>
                </CollectionView>
            </StackLayout>
        </StackLayout> 



</ContentPage>

1 Ответ

0 голосов
/ 30 сентября 2019

Я добавил <ScrollView> в свой код, и элементы коллекций отображаются так, как я хотел.Вот модифицированный код, который работает для меня.

  ?xml version="1.0" encoding="UTF-8"?>
    <ContentPage xmlns="http://xamarin.com/schemas/2014/forms" 
                 xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
                 Title="Arhoo" 
                 x:Class="Arhoo.Pages.MainFeedPage">
        <ScrollView>
            <StackLayout>  
           <CollectionView x:Name="HotelsListView" ... </CollcetionView>
</StackLayout>
<StackLayout>  
           <CollectionView x:Name="HotelsListView" ... </CollcetionView>
</StackLayout>
<StackLayout>  
           <CollectionView x:Name="HotelsListView" ... </CollcetionView>
</StackLayout>
</StackLayout>

    </ScrollView>

</ContentPage>
...