How to toggle visibility of child elements in list view index?

Question

I'm making a UWP application with Xamarin.Forms. The following code is a snippet of the XAML. This page contains a list view that displays parsed JSON data.

<ListView x:Name="listView"
                  ItemTapped="ItemTapped"
                  Style="{StaticResource openpageListView}">
            <ListView.ItemTemplate>
                <DataTemplate>
                        <ViewCell>
                            <Frame Padding="0, 40, 0, 40">

                                <StackLayout HorizontalOptions="CenterAndExpand"
                                             VerticalOptions="StartAndExpand">
                                    <StackLayout Orientation="Horizontal"
                                                 HeightRequest="30"
                                                 WidthRequest="750"
                                                 HorizontalOptions="CenterAndExpand"
                                                 VerticalOptions="Start">
                                        <Label Text="Topic: "
                                               TextColor="White"
                                               FontAttributes="Bold"
                                               HorizontalOptions="StartAndExpand"/>
                                        <Label Text="{Binding Topic}"
                                               HorizontalOptions="StartAndExpand"/>
                                        <Label Text="Input Type / Output Type: "
                                               TextColor="White"
                                               FontAttributes="Bold"
                                               HorizontalOptions="EndAndExpand" />
                                        <Label HorizontalOptions="EndAndExpand">
                                            <Label.Text>
                                                <MultiBinding StringFormat="{}{0} => {1}">
                                                    <Binding Path="InputType" />
                                                    <Binding Path="OutputType" />
                                                </MultiBinding>
                                            </Label.Text>
                                        </Label>
                                    </StackLayout>

                                    <!-- Boolean specific subsection -->
                                    <Grid x:Name="boolean"
                                          IsVisible="false"
                                          Padding="0, 15, 0, 15"
                                          RowSpacing="15"
                                          ColumnSpacing="15"
                                          HorizontalOptions="CenterAndExpand">
                                        <Grid.RowDefinitions>
                                            <RowDefinition Height="30"/>
                                        </Grid.RowDefinitions>
                                        <Grid.ColumnDefinitions>
                                            <ColumnDefinition Width="205" />
                                            <ColumnDefinition Width="205" />
                                            <ColumnDefinition Width="205" />
                                        </Grid.ColumnDefinitions>
                                        <StackLayout Orientation="Horizontal" Grid.Column="0" Grid.Row="0">
                                            <Label Text="Default: "
                                               TextColor="White"
                                               FontAttributes="Bold"/>
                                            <Label Text="{Binding Default}" />
                                        </StackLayout>
                                        <StackLayout Orientation="Horizontal" Grid.Column="1" Grid.Row="0">
                                            <Label Text="Invert: "
                                               TextColor="White"
                                               FontAttributes="Bold" />
                                            <Label Text="{Binding Invert}" />
                                        </StackLayout>
                                        <StackLayout Orientation="Horizontal" Grid.Column="2" Grid.Row="0">
                                            <Label Text="Button / Axis ID: "
                                               TextColor="White"
                                               FontAttributes="Bold" />
                                            <Label Text="{Binding ButtonId}" />
                                        </StackLayout>
                                    </Grid>
                                    
                                    <!-- Analog Specific Subsection -->
                                    <StackLayout x:Name="analog"
                                                 WidthRequest="750"
                                                 IsVisible="true">
                                        <Grid Padding="0, 15, 0, 15"
                                              RowSpacing="15"
                                              ColumnSpacing="50"
                                              HorizontalOptions="CenterAndExpand">
                                            <Grid.RowDefinitions>
                                                <RowDefinition Height="30"/>
                                            </Grid.RowDefinitions>
                                            <Grid.ColumnDefinitions>
                                                <ColumnDefinition Width="250" />
                                                <ColumnDefinition Width="250" />
                                            </Grid.ColumnDefinitions>
                                            <StackLayout Orientation="Horizontal" Grid.Row="0" Grid.Column="0">
                                                <Label Text="Button / Axis ID: "
                                                       TextColor="White"
                                                       FontAttributes="Bold" />
                                                <Label Text="{Binding AxisId}" />
                                            </StackLayout>
                                            <StackLayout Orientation="Horizontal" Grid.Row="0" Grid.Column="1">
                                                <Label Text="Clamp: "
                                                       TextColor="White"
                                                       FontAttributes="Bold" />
                                                <Label Text="{Binding Clamp}" />
                                            </StackLayout>
                                        </Grid>
                                        <Grid Padding="0, 0, 0, 15"
                                              RowSpacing="15"
                                              ColumnSpacing="50"
                                              HorizontalOptions="CenterAndExpand">
                                            <Grid.RowDefinitions>
                                                <RowDefinition Height="30"/>
                                            </Grid.RowDefinitions>
                                            <Grid.ColumnDefinitions>
                                                <ColumnDefinition Width="205" />
                                                <ColumnDefinition Width="205" />
                                                <ColumnDefinition Width="205" />
                                            </Grid.ColumnDefinitions>
                                            <StackLayout Orientation="Horizontal" Grid.Row="0" Grid.Column="0">
                                                <Label Text="Default: "
                                                       TextColor="White"
                                                       FontAttributes="Bold" />
                                                <Label Text="{Binding Default}" />
                                            </StackLayout>
                                            <StackLayout Orientation="Horizontal" Grid.Row="0" Grid.Column="1">
                                                <Label Text="Scalar: "
                                                       TextColor="White"
                                                       FontAttributes="Bold" />
                                                <Label Text="{Binding Scalar}" />
                                            </StackLayout>
                                            <StackLayout Orientation="Horizontal" Grid.Row="0" Grid.Column="2">
                                                <Label Text="Bias: "
                                                       TextColor="White"
                                                       FontAttributes="Bold" />
                                                <Label Text="{Binding Bias}" />
                                            </StackLayout>
                                        </Grid>
                                    </StackLayout>

This is what the "boolean" subsection looks like.

This is what the "analog" subsection looks like.

Is there any way to loop through each row of the listView in the code-behind at runtime and toggle boolean/analog's IsVisible property to be true? I want to make it so that some rows have the boolean section visible and other rows have the analog section visible.

Answer 1

Yes, there is. But I don't think that's a good idea. Instead, what you can do is to split your ListView.DataTemplate into two separate files and use a DataTemplateSelector

See these links for more details:

Creating a Xamarin.Forms DataTemplate

Creating a Xamarin.Forms DataTemplateSelector