Binding problem with TabView DataTemplates

Darren 1 Reputation point
2021-09-02T13:45:02.307+00:00

I am trying to create a tabbed view of collection view lists with all VM bindings. That way tabs and their lists (based on a state) can added in data if more states are setup.

Here is a light version of the XAML

    <StackLayout>
        <xct:TabView TabItemsSource="{Binding Tabs}">

            <xct:TabView.TabViewItemDataTemplate>
                <DataTemplate>
                    <StackLayout><Label Text="{Binding TabTitle}" /></StackLayout>
                </DataTemplate>
            </xct:TabView.TabViewItemDataTemplate>

            <xct:TabView.Behaviors>
                <xct:EventToCommandBehavior
                    Command="{Binding TabChangedCommand}"
                    EventName="SelectionChanged" />
            </xct:TabView.Behaviors>

            <xct:TabView.TabContentDataTemplate>
                <DataTemplate>
                    <!--  binding context is the TabHeader in Tabs  -->
                    <CollectionView ItemsSource="{Binding Orders}">
                        <CollectionView.ItemTemplate>
                            <DataTemplate>
                                <StackLayout><Label Text="{Binding CustomerName}" /></StackLayout>
                            </DataTemplate>
                        </CollectionView.ItemTemplate>
                    </CollectionView>

                </DataTemplate>
            </xct:TabView.TabContentDataTemplate>

        </xct:TabView>
    </StackLayout>

I have a test project on Github if anyone wants to get a better understanding https://github.com/lywyn/TabTest.

The problem with data binding is that the CollectionView ItemsSource="{Binding Orders}" is binding to the TabHeader object in the collection used to bind the tabs to data collection TabView TabItemsSource="{Binding Tabs}". Should I move the collection view outside of the tabs and have one collection view for all tabs (sks states) or is there a way to bind the collection view to a data source in the view model for the page.

Xamarin
Xamarin
A Microsoft open-source app platform for building Android and iOS apps with .NET and C#.
5,313 questions
{count} votes