Xamarin.Формы - отображать все элементы без прокрутки

#xamarin.forms

Вопрос:

Я использую scrollview для отображения моей домашней страницы, он содержит много элементов управления, в том числе 2 CollectionViews, моя проблема в том, что когда пользователь прокручивает домашнюю страницу вниз, и как только будет достигнут CollectionView, он застрянет в скроллере CollectionView, я хочу, чтобы все элементы (около 40 элементов) отображалисьв CollectionView без скроллера, чтобы пользователь мог продолжать прокручивать домашнюю страницу и элементы CollectionView к элементам управления, указанным ниже. Я попытался установить фиксированную высоту для CollectionView, но это не сработало. Кроме того, я нашел статью, в которой говорилось об использовании BindableLayout, но я где-то читал, что он может быть намного медленнее, чем CollectionView, и он не поддерживает макет элемента (я использую span=»2″, чтобы показывать 2 элемента рядом друг с другом в каждой строке)

1. jpg содержит тысячи слов.

2. @Shaw, я включил изображение

3. Вы можете установить Scroll Orientation из CollectionView как горизонтальный, чтобы не возникало проблем с прокруткой при прокрутке пользователем до CollectionView.

4. @LucasZhang-MSFT, я не смог найти способ сделать это в XAML

5. learn.microsoft.com/en-us/xamarin/xamarin-forms/user-interface/…

Ответ №1:

Вы могли бы использовать BindableLayout гибкого описания . Проверьте следующий код

 <ScrollView Orientation="Vertical" BackgroundColor="LightBlue">

        //.. other elements
 
        <FlexLayout  BindableLayout.ItemsSource="{Binding XXX}" Direction="Row"
                AlignItems="Start" Wrap="Wrap" JustifyContent="SpaceAround" AlignContent="SpaceAround" >
            <BindableLayout.ItemTemplate>
                <DataTemplate>

                   //replace it with your data template
                    <StackLayout HeightRequest="100" WidthRequest="180" BackgroundColor="Red" Margin="10"  >

                        <Label Text="{Binding .}" TextColor="Black" BackgroundColor="Green" /> 

                    </StackLayout>

                </DataTemplate>
            </BindableLayout.ItemTemplate>
        </FlexLayout>

    </ScrollView>

Примечание:

Таким образом, вам нужно установить ширину каждого элемента меньше половины ширины экрана. В противном случае элемент переместится в следующую строку.

1. У меня возникли некоторые проблемы с настройкой собственного макета с использованием BindableLayout FlexLayout, и я заметил некоторое отставание, поэтому мой клиент решил использовать ListView от Syncfusion

2. Это здорово ! Счастливого кодирования 🙂