の適正を行うページナビゲーションにListBoxの選択の変更
-
25-09-2019 - |
質問
っているのでョ光です。もたなければならないと思いる複数のViewModelsような小さなプロトコルを簡単に追加することを失わせないアイテムの様子がよくわかる。私がまだなかなか理解がどのように行うという"何がそうすることによって")ナビゲートから他のページには、選択範囲の変更ListBox.
の大きな問題をこのツールキットで勢いがョ他の源を使用する前にしない(そのビジョン)ョら枠組みに伴い、サンプルとドキュメンテーションありサンプルであり、異なる概念?やめないでください。
解決
また変更のおListBox ItemTemplate各項目さHyperlinkButtonだけで設定にNavigateURI属性のページにしたいナビゲートす。
他のヒント
私はまだビューで任意のコードビハインドなく、この(リストボックスで変更選択時の詳細ページに移動)を行う方法を考え出したていません。ただし、ビューでほんの少し分離コードを有するOKであれば、ここで私が推薦するものです。
<ListBox x:Name="MainListBox" Margin="0,0,-12,0" ItemsSource="{Binding Items}"
SelectionChanged="MainListBox_SelectionChanged"
SelectedItem="{Binding Path=SelectedListItem, Mode=TwoWay}">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Margin="0,0,0,17" Width="432">
<TextBlock Text="{Binding LineOne}" TextWrapping="Wrap" Style="{StaticResource PhoneTextExtraLargeStyle}"/>
<TextBlock Text="{Binding LineTwo}" TextWrapping="Wrap" Margin="12,-6,12,0" Style="{StaticResource PhoneTextSubtleStyle}"/>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
まず、双方向が(上記でSelectedListItem
)あなたのViewModelにプロパティにバインディングを持つリストボックスのSelectedItemプロパティに上記のバインドあたり。
次に、このページのためのあなたの分離コードでMainListBox_SelectionChangedのハンドラを実装します:
// Handle selection changed on ListBox
private void MainListBox_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
// If selected index is -1 (no selection) do nothing
if (MainListBox.SelectedIndex == -1)
return;
// Navigate to the new page
NavigationService.Navigate(new Uri("/DetailsPage.xaml", UriKind.Relative));
}
この場合にのみ、あなたのメインビューに必要なコードビハインドます。
あなたのメインのViewModelでは、SelectedListItemプロパティを必要とします:
public const string SelectedListItemPropertyName = "SelectedListItem";
private ItemViewModel _SelectedListItem;
/// <summary>
/// Sample ViewModel property; this property is used in the view to display its value using a Binding
/// </summary>
/// <returns></returns>
public ItemViewModel SelectedListItem
{
get
{
return _SelectedListItem;
}
set
{
if (value != _SelectedListItem)
{
_SelectedListItem = value;
RaisePropertyChanged(SelectedListItemPropertyName);
}
}
}
あなたが詳細ビューでセットアップするのDataContextを必要とする今、あなたの詳細ページに渡されたコンテキストを取得するトリックは、(コンテキストがリスト項目を選択したものである):
public DetailsPage()
{
InitializeComponent();
if (DataContext == null)
DataContext = App.ViewModel.SelectedListItem;
}
希望このことができます。
最終的にあなたが潜在的にナビゲートカスタムオブジェクトを設定した後、よりただナビゲートよりもやりたいよ。
ここでこれを行うのMVVM光方法です。
あなたはのviewmodel
内のプロパティに、あなたのリストボックス、選択した項目をバインドするために最初にお勧めします<ListBox ItemsSource="{Binding Events}" Margin="0,0,-12,0" SelectedItem="{Binding SelectedEvent, Mode=TwoWay}">
あなたのSelectedEvent
プロパティを宣言します。
public const string SelectedEventPropertyName = "SelectedEvent";
private Event _selectedEvent;
public Event SelectedEvent
{
get {return _selectedEvent;}
set
{
if (_selectedEvent == value)
{
return;
}
var oldValue = _selectedEvent;
_selectedEvent = value;
// Update bindings and broadcast change using GalaSoft.MvvmLight.Messenging
RaisePropertyChanged(SelectedEventPropertyName, oldValue, value, true);
}
}
あなたはその後、タップイベントにバインドされた相互作用のトリガーを定義することができます。
<i:Interaction.Triggers>
<i:EventTrigger EventName="Tap">
<cmd:EventToCommand Command="{Binding EventPageCommand, Mode=OneWay}"/>
</i:EventTrigger>
</i:Interaction.Triggers>
あなたのviewmodelで、RelayCommandとしてあなたEventPageCommandを定義します:
public RelayCommand EventPageCommand { get; private set; }
public MainViewModel()
{
EventPageCommand = new RelayCommand(GoToEventPage);
}
、最後に宣言し、あなたのGoToEventPage
方法
private void GoToEventPage()
{
_navigationService.NavigateTo(new Uri("/EventPage.xaml", UriKind.Relative));
}
あなたの新しいページに移動する前に、他のアクションを行うことができ、加えてあなたのリストボックスから選択した項目が現在あなたもそれをバインドプロパティに設定されます。ことノート