不能正确填充ListPicker控制与图像和名称 [英] Cannot correctly populate ListPicker control with Image and Name
本文介绍了不能正确填充ListPicker控制与图像和名称的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我已经创建了一个用户改变他或她的背景ListPicker控制，但不是所有的信息在ListPicker控制无误。当导航到我SettingsPage用户，正确显示所有ListPicker项目的文本，但只显示当前选中的背景图像的问题出现了。所有其它的图像背景是一片空白。此外，奇怪的是，我改变图像的背景和导航来回的MainPage和SettingsPage，被选中然后将在ListPicker显示（与所有其他先前选择的背景一起），而背景的每一个新的图像背景尚未选择不必在ListPicker所示的图像。到目前为止，我有什么如下：
SettingsPage.xaml
<工具箱：ListPicker X：NAME =ThemeListPicker标题=主题Grid.Row =2Grid.ColumnSpan =2
的SelectedIndex ={结合}
的SelectionChanged = ThemeListPicker_SelectionChanged>
<工具箱：ListPicker.ItemTemplate>
<&DataTemplate的GT;
< StackPanel的方向=横向>
<图像来源={结合图像}WIDTH =50HEIGHT =37.59保证金=0,0,12,0/>
< TextBlock的文本={绑定名称}TextWrapping =自动换行/>
< / StackPanel的>
< / DataTemplate中>
< /工具包：ListPicker.ItemTemplate>
< /工具包：ListPicker>
SettingsPage.xaml.cs
列表< ThemeItem> themeList;
公共SettingsPage（）
{
的InitializeComponent（）;
themeList =新的List< ThemeItem>（）
{
新ThemeItem【图像=新的BitmapImage（新的URI（资源/主题/ PanoramaBackground.png，UriKind.Relative ）），NAME =默认}，
新ThemeItem【图像=新的BitmapImage（新的URI（资源/主题/摘要Pattern.jpg，UriKind.Relative）），名称=摘要图案}，
新ThemeItem【图像=新的BitmapImage（新的URI（资源/主题/亚洲Beauty.jpg，UriKind.Relative）），名称=亚洲美人}，
新ThemeItem 【图像=新的BitmapImage（新的URI（资源/主题/秋Leaf.jpg，UriKind.Relative）），名称=秋叶}，
新ThemeItem【图像=新的BitmapImage（新的URI（资源/主题/老Barn.png，UriKind.Relative）），名称=旧谷仓}
};
ThemeListPicker.ItemsSource = themeList;
ThemeListPicker.DataContext = ThemeListPicker.SelectedIndex;
}
保护覆盖无效的OnNavigatedTo（NavigationEventArgs E）
{
base.OnNavigatedTo（E）;
//尊重保存的主题指数设置
this.ThemeListPicker.SelectedIndex = Settings.ThemeIndex.Value;
}
私人无效ThemeListPicker_SelectionChanged（对象发件人，SelectionChangedEventArgs E）
{
如果（e.AddedItems.Count< = 0）//消除IndexOutOfRangeException
{
的回报;
}
//字符串将selectedItem = e.AddedItems [0]作为字符串;
ThemeItem将selectedItem = e.AddedItems [0]作为ThemeItem;
如果（selectedItem属性！= NULL）
{
Settings.Theme.Value = selectedItem.Image.UriSource.ToString（）;
Settings.ThemeIndex.Value = ThemeListPicker.SelectedIndex;
}
}
其中ThemeItem是一个很小的自定义类
公共类ThemeItem
{
公众的BitmapImage图片{搞定;组; }
公共字符串名称{;组; }
}
我将如何能够正确地加载所有图片背景和各自的文本名称？的时候，SettingsPage是navigatedTo的ListPicker控制
编辑：添加的设置类信息
公共类设置
{
//主题设置
公共静态只读设置< INT> ThemeIndex =新的设定和LT; INT>（ThemeIndex，0）;
//主题背景
公共静态只读设置<串GT;主题=新的设定和LT;串>（主题，资源/主题/ PanoramaBackground.png）;
//公共静态只读设置<&的BitmapImage GT;主题=新的设定和LT; BitmapImage的GT&（主题，新的URI（/资源/主题/ PanoramaBackground.png，UriKind.Relative））;
}
//封装存储在独立存储的applicationSettings
公共类设置℃的键/值对; T>
{
字符串名称;
的T值; $ B $（B T）设置defaultValue;
布尔hasValue的;
公共设置（字符串名称，T设置defaultValue）
{
this.name =名称;
this.defaultValue =设置defaultValue;
}
公众吨价
{
得到
{
//检查缓存的值
如果（！这.hasValue）
{
//尝试从独立存储
的值，如果（！IsolatedStorageSettings.ApplicationSettings.TryGetValue（
this.name，出THIS.VALUE））
{
//它尚未设置
THIS.VALUE = this.defaultValue;
IsolatedStorageSettings.ApplicationSettings [this.name = THIS.VALUE;
}
this.hasValue = TRUE;
}
返回THIS.VALUE;
}
组
{
//保存价值的独立存储
IsolatedStorageSettings.ApplicationSettings [this.name] =价值;
THIS.VALUE =价值;
this.hasValue = TRUE;
}
}
公共牛逼默认值
{
{返回this.defaultValue; }
}
//清除缓存的值
公共无效ForceRefresh（）
{
this.hasValue = FALSE;
}
}
解决方案
我结束了使用的FullModeItemTemplate这样的ListPicker而在另一页正确填充。
SettingsPage.xaml
< Grid.Resources>
<的DataTemplate X：NAME =PickerItemTemplate>
< StackPanel的方向=横向>
<图像来源={结合图像}WIDTH =50HEIGHT =37.59保证金=0,0,12,0/>
< TextBlock的文本={绑定名称}TextWrapping =自动换行/>
< / StackPanel的>
< / DataTemplate中>
<的DataTemplate X：NAME =PickerFullModeItemTemplate>
< StackPanel的方向=横向>
<图像来源={结合图像}WIDTH =50HEIGHT =37.59保证金=0,0,12,0/>
< TextBlock的文本={绑定名称}TextWrapping =自动换行/>
< / StackPanel的>
< / DataTemplate中>
< /Grid.Resources>
<工具箱：ListPicker X：NAME =ThemeListPicker标题=主题Grid.Row =2Grid.ColumnSpan =2
FullModeItemTemplate ={StaticResource的PickerFullModeItemTemplate}
的ItemTemplate ={StaticResource的PickerItemTemplate}
的SelectedIndex ={结合}
的SelectionChanged =ThemeListPicker_SelectionChanged/>
I have created a ListPicker control for a user to change his or her background, but not all of the information is populated correctly in the ListPicker control. The problem arises when a user navigated to my SettingsPage, the text of all ListPicker items is displayed properly, but only the image of the currently selected background is shown. All other image backgrounds are blank. Furthermore, the weird thing is as I change the image backgrounds and navigate back and forth between the MainPage and the SettingsPage, every new image background that is selected will then show up in the ListPicker (along with all other previously selected backgrounds) while the backgrounds that haven't been selected do not have images shown in the ListPicker. So far what I have is as follows:
SettingsPage.xaml
<toolkit:ListPicker x:Name="ThemeListPicker" Header="Theme" Grid.Row="2" Grid.ColumnSpan="2"
SelectedIndex="{Binding}"
SelectionChanged="ThemeListPicker_SelectionChanged">
<toolkit:ListPicker.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<Image Source="{Binding Image}" Width="50" Height="37.59" Margin="0,0,12,0"/>
<TextBlock Text="{Binding Name}" TextWrapping="Wrap"/>
</StackPanel>
</DataTemplate>
</toolkit:ListPicker.ItemTemplate>
</toolkit:ListPicker>
SettingsPage.xaml.cs
List<ThemeItem> themeList;
public SettingsPage()
{
InitializeComponent();
themeList = new List<ThemeItem>()
{
new ThemeItem { Image = new BitmapImage(new Uri("Resources/Themes/PanoramaBackground.png", UriKind.Relative)), Name = "Default" },
new ThemeItem { Image = new BitmapImage(new Uri("Resources/Themes/Abstract Pattern.jpg", UriKind.Relative)), Name = "Abstract Pattern" },
new ThemeItem { Image = new BitmapImage(new Uri("Resources/Themes/Asian Beauty.jpg", UriKind.Relative)), Name = "Asian Beauty" },
new ThemeItem { Image = new BitmapImage(new Uri("Resources/Themes/Autumn Leaf.jpg", UriKind.Relative)), Name = "Autumn Leaf" },
new ThemeItem { Image = new BitmapImage(new Uri("Resources/Themes/Old Barn.png", UriKind.Relative)), Name = "Old Barn" }
};
ThemeListPicker.ItemsSource = themeList;
ThemeListPicker.DataContext = ThemeListPicker.SelectedIndex;
}
protected override void OnNavigatedTo(NavigationEventArgs e)
{
base.OnNavigatedTo(e);
//Respect the saved Theme index setting
this.ThemeListPicker.SelectedIndex = Settings.ThemeIndex.Value;
}
private void ThemeListPicker_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
if (e.AddedItems.Count <= 0) //to eliminate IndexOutOfRangeException
{
return;
}
//string selectedItem = e.AddedItems[0] as string;
ThemeItem selectedItem = e.AddedItems[0] as ThemeItem;
if (selectedItem != null)
{
Settings.Theme.Value = selectedItem.Image.UriSource.ToString();
Settings.ThemeIndex.Value = ThemeListPicker.SelectedIndex;
}
}
where ThemeItem is a small custom class
public class ThemeItem
{
public BitmapImage Image { get; set; }
public string Name { get; set; }
}
How would I be able to properly load all Image backgrounds and respective text Names in the ListPicker control when the SettingsPage is navigatedTo?
EDIT: added Settings class info
public class Settings
{
//Theme settings
public static readonly Setting<int> ThemeIndex = new Setting<int>("ThemeIndex", 0);
//Theme Background
public static readonly Setting<string> Theme = new Setting<string>("Theme", "Resources/Themes/PanoramaBackground.png");
//public static readonly Setting<BitmapImage> Theme = new Setting<BitmapImage>("Theme", new Uri("/Resources/Themes/PanoramaBackground.png", UriKind.Relative));
}
//Encapsulates a key/value pair stored in Isolated Storage ApplicationSettings
public class Setting<T>
{
string name;
T value;
T defaultValue;
bool hasValue;
public Setting(string name, T defaultValue)
{
this.name = name;
this.defaultValue = defaultValue;
}
public T Value
{
get
{
//Check for the cached value
if (!this.hasValue)
{
//Try to get the value from Isolated Storage
if (!IsolatedStorageSettings.ApplicationSettings.TryGetValue(
this.name, out this.value))
{
//It has not been set yet
this.value = this.defaultValue;
IsolatedStorageSettings.ApplicationSettings[this.name] = this.value;
}
this.hasValue = true;
}
return this.value;
}
set
{
//Save the value to Isolated Storage
IsolatedStorageSettings.ApplicationSettings[this.name] = value;
this.value = value;
this.hasValue = true;
}
}
public T DefaultValue
{
get { return this.defaultValue; }
}
//"Clear" cached value
public void ForceRefresh()
{
this.hasValue = false;
}
}
解决方案
I ended up using the FullModeItemTemplate so that the the ListPicker would populate correctly in another page.
SettingsPage.xaml
<Grid.Resources>
<DataTemplate x:Name="PickerItemTemplate">
<StackPanel Orientation="Horizontal">
<Image Source="{Binding Image}" Width="50" Height="37.59" Margin="0,0,12,0"/>
<TextBlock Text="{Binding Name}" TextWrapping="Wrap"/>
</StackPanel>
</DataTemplate>
<DataTemplate x:Name="PickerFullModeItemTemplate">
<StackPanel Orientation="Horizontal">
<Image Source="{Binding Image}" Width="50" Height="37.59" Margin="0,0,12,0"/>
<TextBlock Text="{Binding Name}" TextWrapping="Wrap"/>
</StackPanel>
</DataTemplate>
</Grid.Resources>
<toolkit:ListPicker x:Name="ThemeListPicker" Header="Theme" Grid.Row="2" Grid.ColumnSpan="2"
FullModeItemTemplate="{StaticResource PickerFullModeItemTemplate}"
ItemTemplate="{StaticResource PickerItemTemplate}"
SelectedIndex="{Binding}"
SelectionChanged="ThemeListPicker_SelectionChanged"/>
这篇关于不能正确填充ListPicker控制与图像和名称的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
