[英]Selected item on ListBox binding?
I have a binding for ListBox but how I can add an event to selected item? 我有一个ListBox绑定,但是如何将事件添加到所选项目?
MainPage.xaml: MainPage.xaml中:
<!--ContentPanel - place additional content here-->
<StackPanel x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
<ListBox Name="list" SelectionChanged="list_SelectionChanged">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<Image Source="{Binding ImageUri}"
Stretch="None"
Height="100"/>
<StackPanel Width="360" >
<TextBlock Text="{Binding Text}"
Style="{StaticResource PhoneTextExtraLargeStyle}"/>
<TextBlock Text="{Binding Opis}"
Style="{StaticResource PhoneTextSubtleStyle}"/>
</StackPanel>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</StackPanel>
MainPage.xaml.cs: MainPage.xaml.cs:
public partial class MainPage : PhoneApplicationPage
{
public MainPage()
{
InitializeComponent();
ObservableCollection<SampleData> dataSource =
new ObservableCollection<SampleData>();
dataSource.Add(new SampleData()
{
ImageUri = "Images/appbar.delete.rest.png",
Text = "Item1",
Description = "blablabla"
});
dataSource.Add(new SampleData()
{
ImageUri = "Images/appbar.delete.rest.png",
Text = "Item2",
Description = "blablabla"
});
dataSource.Add(new SampleData()
{
ImageUri = "Images/appbar.download.rest.png",
Text = "Item3",
Description = "blablabla"
});
this.list.ItemsSource = dataSource;
}
private void list_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
if (list.SelectedItem == null) return;
//what next?
}
public class SampleData
{
public string Text { get; set; }
public string Description { get; set; }
public string ImageUri { get; set; }
}
}
I want to click for example on Item2 and get to page Page2.xaml. 例如,我想单击Item2并转到页面Page2.xaml。
My project from VS2010: http://www.przeklej.pl/plik/wp7sampleproject6-7z-00368v7i196u 我来自VS2010的项目: http : //www.przeklej.pl/plik/wp7sampleproject6-7z-00368v7i196u
If you are using an MVVM stack like MVVMlight this is quite simple as you simply create a Full Property in your view model for a Selected Item and then bind to it as you would with anything else. 如果您使用的是MVVMlight之类的MVVM堆栈,这非常简单,因为您只需在视图模型中为Selected Item创建Full属性,然后像其他任何操作一样将其绑定到该属性。 Using your code above for example I would do: 例如,使用上面的代码,我会做:
/// <summary>
/// The <see cref="SelectedListItem" /> property's name.
/// </summary>
public const string SelectedStickPropertyName = "SelectedListItem";
private SampleData _selectedItem;
/// <summary>
/// Gets the SelectedStick property.
/// TODO Update documentation:
/// Changes to that property's value raise the PropertyChanged event.
/// This property's value is broadcasted by the Messenger's default instance when it changes.
/// </summary>
public SampleData SelectedListItem
{
get
{
return _selectedItem;
}
set
{
if (_selectedItem == value || value == null)
{
return;
}
var oldValue = _selectedItem;
_selectedItem = value;
// Update bindings, no broadcast
RaisePropertyChanged(SelectedStickPropertyName);
}
}
Then in your Listbox XAML just bind the Listbox Selected Item to the above property (provided you have set the data context property: 然后在Listbox XAML中,只需将Listbox Selected Item绑定到上述属性(前提是您已经设置了data context属性:
<ListBox Name="list" SelectionChanged="list_SelectionChanged" SelectedItem="{Binding SelectedListItem, Mode=TwoWay}">
That way you can query the Selected Item Property to find the value. 这样,您可以查询Selected Item属性来查找值。
Personally I would use Buttons with Command bindings, but I suppose you could start this way: 我个人会使用带有Command绑定的Button,但是我想你可以这样开始:
public MainPage()
{
InitializeComponent();
ObservableCollection<SampleData> dataSource = new ObservableCollection<SampleData>();
dataSource.Add(
new SampleData()
{
ImageUri = "Images/appbar.delete.rest.png",
Text = "Item1",
Description = "blablabla",
TargetUri = new Uri("Page1.xaml", UriKind.Relative)
});
dataSource.Add(
new SampleData()
{
ImageUri = "Images/appbar.delete.rest.png",
Text = "item2",
Description = "blablabla",
TargetUri = new Uri("Page2.xaml", UriKind.Relative)
});
dataSource.Add(
new SampleData()
{
ImageUri = "Images/appbar.download.rest.png",
Text = "Item3",
Description = "blablabla",
TargetUri = new Uri("Page3.xaml", UriKind.Relative)
});
this.list.ItemsSource = dataSource;
}
private void list_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
var data = list.SelectedItem as SampleData;
if (data == null)
{
return;
}
NavigationService.Navigate(data.TargetUri);
}
public class SampleData
{
public string Text { get; set; }
public string Description { get; set; }
public string ImageUri { get; set; }
public Uri TargetUri { get; set; }
}
*EDIT *编辑
If you want tapping an item to do the navigation using commands, you could do it like this: 如果要点按某个项目以使用命令进行导航,则可以这样进行:
public class SampleData
{
public string Text { get; set; }
public string Description { get; set; }
public string ImageUri { get; set; }
public Uri TargetUri { get; set; }
public ICommand NavigateCommand { get; private set; }
public SampleData()
{
NavigateCommand =
new DelegateCommand(
() => NavigationService.Navigate(TargetUri);
}
}
To get a NavigationService instance - you can implement it yourself or simply use App.RootFrame to perform navigation calls. 要获取NavigationService实例-您可以自己实现它,也可以简单地使用App.RootFrame执行导航调用。 You would define command bindings roughly as below: 您将大致如下定义命令绑定:
<ListBox.ItemTemplate>
<DataTemplate>
<Button
Command={Binding NavigateCommand}>
<Button.Template>
<ControlTemplate>
<StackPanel Orientation="Horizontal">
<Image Source="{Binding ImageUri}"
Stretch="None"
Height="100"/>
<StackPanel Width="360" >
<TextBlock Text="{Binding Text}"
Style="{StaticResource PhoneTextExtraLargeStyle}"/>
<TextBlock Text="{Binding Description}"
Style="{StaticResource PhoneTextSubtleStyle}"/>
</StackPanel>
</StackPanel>
</ControlTemplate>
</Button.Template>
</Button>
</DataTemplate>
</ListBox.ItemTemplate>
Have a look at the code which is created by default as part of a new Databound application. 查看默认情况下作为新数据绑定应用程序的一部分创建的代码。 It shows how to access the SelectedItem by querying the e.AddedItems
property in the SelectionChanged event handler. 它显示了如何通过查询SelectionChanged事件处理程序中的e.AddedItems
属性来访问SelectedItem。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.