Question

I have a ListBox in a popup. It’s bound to a simple Dictionary. I also have a ItemContainerStyle to theme listbox highlights. If I add ListBoxItems at design time, the selection style works, but the same style does not work when I assign ItemsSource. To troubleshoot I stripped it to barebones, and problem persists. Below is the code I have, Launch it, and click on ShowPopup to open Popup, first you will see items added in design time, and if you click on “Add ItemsSource” it will show run time items. You can see the selection in design time items, and not in run time items. (items generated via itemssource).

Any ideas? What am I missing?

<phone:PhoneApplicationPage   
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"  
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"  
    xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"  
    xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"  
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"  
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"  
    xmlns:controls="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls"    
    x:Class="ObservableListSample.MainPage"  
    mc:Ignorable="d" d:DesignWidth="728" d:DesignHeight="480"  
    FontFamily="{StaticResource PhoneFontFamilyNormal}"  
    FontSize="{StaticResource PhoneFontSizeNormal}"  
    Foreground="{StaticResource PhoneForegroundBrush}"  
    SupportedOrientations="PortraitOrLandscape" Orientation="Portrait"  
    shell:SystemTray.IsVisible="True"    
    xmlns:toolkit="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls.Toolkit">   

    <!--LayoutRoot is the root grid where all page content is placed-->  
    <Grid x:Name="LayoutRoot" Background="Transparent">   
        <!--ContentPanel - place additional content here-->  
        <Grid x:Name="ContentPanel" Margin="12,0,12,0">   
            <controls:Pivot Margin="8" Title="pivot">   
                <controls:PivotItem Margin="12" Header="Popup">   
                    <Grid Margin="12">   
                        <Button Content="Show Popup" Margin="1,0,0,0" VerticalAlignment="Bottom" Click="Button_Click"/>   
                    </Grid>  
                </controls:PivotItem>  
            </controls:Pivot>  
            <Popup x:Name="LocPopup"  
                   Margin="12,120,12,12">   
                <StackPanel Background="{StaticResource PhoneBackgroundBrush}"  
                            Height="610"  
                            Width="432">   
                    <Button   
                               Content="Add ItemsSource"  
                                Click="Button_Click"  
                               VerticalAlignment="Top" Margin="12" />  
                    <ListBox x:Name="LibraryLocations" Height="480">   
                        <ListBox.Resources>    <DataTemplate x:Key="DataTemplate1">   
                                <ListBoxItem Content="{Binding Value}" Tag="{Binding Key.Name}"/>   
                            </DataTemplate>  
                        </ListBox.Resources>  
                        <ListBox.ItemTemplate>  
                            <StaticResource ResourceKey="DataTemplate1"/>   
                        </ListBox.ItemTemplate>  
                        <ListBoxItem Content="ListBoxItem 1" />  
                        <ListBoxItem Content="ListBoxItem 2" />  
                        <ListBoxItem Content="ListBoxItem 3" />  
                        <ListBoxItem Content="ListBoxItem 4" />  
                        <ListBoxItem Content="ListBoxItem 5" />  
                        <ListBoxItem Content="ListBoxItem 6" />  
                    </ListBox>  
                </StackPanel>  
            </Popup>  
        </Grid>  
    </Grid>  
</phone:PhoneApplicationPage>  

C#

using System;   
using System.Collections.Generic;   
using System.Linq;   
using System.Net;   
using System.Windows;   
using System.Windows.Controls;   
using System.Windows.Documents;   
using System.Windows.Input;   
using System.Windows.Media;   
using System.Windows.Media.Animation;   
using System.Windows.Shapes;   
using Microsoft.Phone.Controls;   
using System.Collections.ObjectModel;   

namespace ObservableListSample   
{   

    public partial class MainPage : PhoneApplicationPage   
    {   
         // Constructor   
        public MainPage()   
        {   
            InitializeComponent();   
        }   

        private void Button_Click(object sender, RoutedEventArgs e)   
        {   
            if (!LocPopup.IsOpen)   
                LocPopup.IsOpen = true;   
            else  
            {   
                Dictionary<string, string> items = new Dictionary<string, string>();   
                for (int i = 0; i < 20; i++)   
                {   
                    items.Add(i.ToString(), "Item " + i.ToString());   
                }   
                if (LibraryLocations.ItemsSource == null)   
                    LibraryLocations.Items.Clear();   
                LibraryLocations.ItemsSource = items;   
            }   
        }   

        protected override void OnBackKeyPress(System.ComponentModel.CancelEventArgs e)   
        {   
            if (LocPopup.IsOpen)   
            {   
                LocPopup.IsOpen = false;   
                e.Cancel = true;   
            }   
            else  
            {   
                base.OnBackKeyPress(e);   
            }   
        }   

    }     

}  

Answer 1

I don’t see any ItemContainerStyle in your sample. Do you really need using ListBoxItem in the ListBox.ItemTemplate? Try this one instead:

<DataTemplate x:Key="DataTemplate1">
   <TextBlock Text="{Binding Value}" Tag="{Binding Key.Name}"/>
</DataTemplate>