Как связать список Tab.Items типа «ShellContent» динамически И в XAML с помощью xamarin.forms-shell

Как динамически добавлять элементы типа ShellContent с привязкой данных с учетом шаблона MVVM. Я хочу привязать последнюю модель TabViewModels к коллекции Tab.Items. НЕ код, который я не могу проверить.

Вместо 6 объектов ShellContent я хочу связать любое число во время выполнения.

MainPage.xaml

<FlyoutItem Route="animals"
                Title="Animals"
                FlyoutDisplayOptions="AsSingleItem">
        <Tab Title="Domestic"
             Route="domestic"
             Icon="paw.png">

            <Tab.Items>

                <ShellContent Route="cats"
                          Style="{StaticResource DomesticShell}"
                          Title="sisi"
                          Icon="cat.png"
                          ContentTemplate="{DataTemplate views:CatsPage}" />
                <ShellContent Route="dogs"
                          Style="{StaticResource DomesticShell}"
                          Title="Dogs"
                          Icon="dog.png"
                          ContentTemplate="{DataTemplate views:DogsPage}" />
                <ShellContent Route="dogs"
                          Style="{StaticResource DomesticShell}"
                          Title="Dogs"
                          Icon="dog.png"
                          ContentTemplate="{DataTemplate views:DogsPage}" />
                <ShellContent Route="dogs"
                          Style="{StaticResource DomesticShell}"
                          Title="Dogs"
                          Icon="dog.png"
                          ContentTemplate="{DataTemplate views:DogsPage}" />
                <ShellContent Route="dogs"
                          Style="{StaticResource DomesticShell}"
                          Title="Dogs"
                          Icon="dog.png"
                          ContentTemplate="{DataTemplate views:DogsPage}" />
                <ShellContent Route="dogs"
                          Style="{StaticResource DomesticShell}"
                          Title="Dogs"
                          Icon="dog.png"
                          ContentTemplate="{DataTemplate views:DogsPage}" />
            </Tab.Items>


        </Tab>
</FlyoutItem>

person Pascal    schedule 31.12.2019    source источник


Ответы (1)


Вы можете добавить свойство x:Name="myTab" для вашего Tab и использовать функцию void Add(T item); для добавления дочернего элемента в ваш Tab. Например:

   <FlyoutItem Route="animals" x:Name="mFlyoutItem"
                Title="Animals"
                FlyoutDisplayOptions="AsMultipleItems">
        <Tab Title="Domes.123"
             Route="domestic"
             x:Name="myTab"
             Icon="paw.png">
            <Tab.Items>
            <ShellContent Route="cats"
                          Style="{StaticResource DomesticShell}"
                          Title="Cats"
                          Icon="cat.png"
                          ContentTemplate="{DataTemplate views:CatsPage}" />
            <ShellContent Route="dogs"
                          Style="{StaticResource DomesticShell}"
                          Title="Dogs"
                          Icon="dog.png"
                          ContentTemplate="{DataTemplate views:DogsPage}" />
            </Tab.Items>
        </Tab>
   </FlyoutItem>

Затем добавьте ShellContent в свой код следующим образом:

 myTab.Items.Add(new DogsPage());

Если вы хотите изменить свойство ShellContent (например, Title), вы можете использовать следующий код:

ShellContent shellContent = new ShellContent();
shellContent.Content = new DogsPage();
shellContent.Title = "testTitle";

myTab.Items.Add(shellContent);

Обновить

Для ShellContent.BindingContext вы можете обратиться к этой проблеме: https://github.com/xamarin/Xamarin.Forms/issues/6444

Эта ошибка уже исправлена, поэтому нам нужно обновить Xamarin Form до последней версии.

Пример кода:

  <TabBar>
    <Tab >
        <ShellContent >
            <ShellContent.ContentTemplate>
                <DataTemplate>
                    <local:Page1 BindingContext="{Binding Page1VM}"/>
                </DataTemplate>
            </ShellContent.ContentTemplate>
        </ShellContent>
    </Tab>
</TabBar>
person Jessie Zhang -MSFT    schedule 01.01.2020
comment
Кажется, я должен был быть более ясным. Таким образом, я перефразировал свой заголовок/вопрос. - person Pascal; 01.01.2020
comment
@Pascal Паскаль, я обновил ответ, можешь проверить. - person Jessie Zhang -MSFT; 02.01.2020
comment
Я предполагаю, что Page1VM не является коллекцией Items, содержащей модели tabview, верно? Потому что тогда это бесполезно для меня. - person Pascal; 03.01.2020