show/hide a control in a longlistselector template

Question

I have a longlistselector that shows a set of saved runs in an app. The saved runs may have distances in either miles or km (depending on the culture where the app is used) and in general I store both of these in the model (to avoid turning 10 mile runs into 9.9999 mile runs which happens when converting all the time).

In my itemtemplate for my longlistselector, I was going to simply put in both metric and imperial fields in the template in xaml and hide the non-useful ones after a culture check on page load.

I can't get to these textblocks, however, by simply typing their names. Intellisense doesn't see them. I'm assuming because this is a template.

Is it possible to get to the xaml-defined textblocks in the longlistselector itemtemplate from the codebehind? Or should I build the itemtemplate in code at load and preferentially put the right textblocks in? (Not a fan of that approach, but I suppose I could.)

I was originally going at this with individual fields and converters that would convert distances and pick units based on culture, but these made things a little messy.

Longlist selector looks like this in the xaml:

 <phone:LongListSelector x:Name="SavedRunsListSelector" Margin="0,0,-12,0" ItemsSource="{Binding SavedRuns}">
                        <phone:LongListSelector.ItemTemplate>
                            <DataTemplate>
                                <StackPanel Margin="0,0,0,0">
                                    <TextBlock Text="{Binding RunName}" Margin="0,0,0,-6"
                                     TextWrapping="Wrap"
                                     Style="{StaticResource PhoneTextLargeStyle}" 
                                     Foreground="{StaticResource PhoneAccentBrush}"/>
                          <!--<toolkit:WrapPanel Margin="0,-6,12,0" HorizontalAlignment="Stretch">-->
                              <TextBlock Text="{Binding RunDate, Converter={StaticResource ConverterRunDate}}"
                                         TextWrapping="Wrap"  HorizontalAlignment="Left"
                                         Margin="0,0,0,0"
                                         Style="{StaticResource PhoneTextSubtleStyle}"
                                         Opacity="1"/>
                              <TextBlock Text="{Binding RunDistMiles, Converter={StaticResource ConverterDistanceMilesWholeString}}" 
                                     x:Name="textBlockSavedRunsListDistanceMiles"
                                     TextWrapping="Wrap" Margin="0,-6,12,0" 
                                     Style="{StaticResource PhoneTextSubtleStyle}"/>
                          <TextBlock Text="{Binding RunDistKm, Converter={StaticResource ConverterDistanceKmWholeString}}" 
                                     x:Name="textBlockSavedRunsListDistanceKm"
                                     TextWrapping="Wrap" Margin="0,-6,12,0" 
                                     Style="{StaticResource PhoneTextSubtleStyle}"/>
                          <TextBlock Text="{Binding RunTimeTotalSecs, Converter={StaticResource SecToTimeConverter}}"
                                     TextWrapping="Wrap" Margin="0,-6,12,0" Style="{StaticResource PhoneTextSubtleStyle}"/>
                      </StackPanel>
                  </DataTemplate>
              </phone:LongListSelector.ItemTemplate>
  </phone:LongListSelector>

Upon reflection, easiest might be to build 2 templates in xaml and just apply the correct one in code behind after checking culture info. More xaml (but mostly copy/paste) and much simpler code in background. — WPNoviceCoder, May 09 '16 at 11:25

score 1 · Accepted Answer · edited May 23 '17 at 12:16

There are several ways that you can accomplish your goals.

1) If you really want to access the items in the DataTemplate by name then you will need the help of the VisualTreeHelper.

See How to access a named control inside a XAML DataTemplate (using CSharp) by Jerry Nixon or you can just searc for accessing DataTemplate items from code-behind.

2) You can make use of a ItemTemplate Selector, one for each of your display settings. See here : LongListSelector different item template

3) Or you can just basically databind the Visibility of the textbox to a converter class in your ViewModel. For example, if "Km mode" then Visibility of miles TextBlock would be Collapsed.

show/hide a control in a longlistselector template

1 Answers1