をクリックした後にリストビューアイテムを更新するには？

Question

私は、ウィンドウ10の同じリストのwifiをリストビューで作成したいと思います。ユーザーがリストアイテムをクリックすると、詳細情報が表示されます。

UWPアプリのリストビューアイテムに追加データを表示する方法がわかりません。

before selected Wifi node

after selected Wifi node

Answer 1

あなたはグリッドまたはのStackPanelまたは可視性とニーズに合ったものは何でも使うことができ、追加のデータを表示するために崩壊し、ユーザーがアイテムをクリックしたときに表示するように設定されます。ここで私はあなたが簡単なリストビューでこれを行うことができる方法を実証：

これは私のメインページです。

<Page 
    x:Class="App1.MainPage" 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
    xmlns:local="using:App1" 
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
    Name="DummyPage" 
    mc:Ignorable="d"> 

    <Page.Resources> 
     <local:BoolToVisibilityConverter x:Key="BoolToVisibilityConverter" /> 
    </Page.Resources> 

    <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"> 
     <ListView 
      Name="lvDummyData" 
      HorizontalAlignment="Center" 
      VerticalAlignment="Center" 
      IsItemClickEnabled="True" 
      ItemClick="lvDummyData_ItemClick" 
      SelectionMode="Single"> 
      <ListView.ItemTemplate> 
       <DataTemplate> 
        <Grid> 
         <Grid.RowDefinitions> 
          <RowDefinition Height="Auto" /> 
          <RowDefinition Height="Auto" /> 
         </Grid.RowDefinitions> 

         <TextBlock Text="{Binding FirstName}" /> 

         <StackPanel 
          Grid.Row="1" 
          Margin="0,20,0,0" 
          Visibility="{Binding ShowDetails, Mode=OneWay, Converter={StaticResource BoolToVisibilityConverter}}"> 
          <TextBlock Text="{Binding LastName}" /> 
          <TextBlock Text="{Binding Adress}" /> 
         </StackPanel> 
        </Grid> 
       </DataTemplate> 
      </ListView.ItemTemplate> 
     </ListView> 
    </Grid> 
</Page> 

これは背後に私のコードです：

私は私のコードビハインドで

using System.Collections.ObjectModel; 
using System.ComponentModel; 
using Windows.UI.Xaml.Controls; 

// The Blank Page item template is documented at http://go.microsoft.com/fwlink/?LinkId=402352&clcid=0x409 

namespace App1 
{ 
    /// <summary> 
    /// An empty page that can be used on its own or navigated to within a Frame. 
    /// </summary> 
    public sealed partial class MainPage : Page, INotifyPropertyChanged 
    { 
     public ObservableCollection<DummyData> DummyData { get; set; } 
     private DummyData tempSelectedItem; 

     public MainPage() 
     { 
      DummyData = new ObservableCollection<DummyData>(); 

      DummyData.Add(new DummyData() 
      { 
       Adress = "London", 
       FirstName = "Shella", 
       LastName = "Schranz", 
       ShowDetails = false 
      }); 

      DummyData.Add(new DummyData() 
      { 
       Adress = "New York", 
       FirstName = "Karyl", 
       LastName = "Lotz", 
       ShowDetails = false 
      }); 

      DummyData.Add(new DummyData() 
      { 
       Adress = "Pasadena", 
       FirstName = "Jefferson", 
       LastName = "Kaur", 
       ShowDetails = false 
      }); 

      DummyData.Add(new DummyData() 
      { 
       Adress = "Berlin", 
       FirstName = "Soledad", 
       LastName = "Farina", 
       ShowDetails = false 
      }); 

      DummyData.Add(new DummyData() 
      { 
       Adress = "Brazil", 
       FirstName = "Cortney", 
       LastName = "Mair", 
       ShowDetails = false 
      }); 

      this.InitializeComponent(); 

      lvDummyData.ItemsSource = DummyData; 
     } 

     private void lvDummyData_ItemClick(object sender, ItemClickEventArgs e) 
     { 
      DummyData selectedItem = e.ClickedItem as DummyData; 

      selectedItem.ShowDetails = true; 

      if (tempSelectedItem != null) 
      { 
       tempSelectedItem.ShowDetails = false; 
       selectedItem.ShowDetails = true; 
      } 

      tempSelectedItem = selectedItem; 
     } 

     public event PropertyChangedEventHandler PropertyChanged; 

     public void RaisePropertyChangeEvent(string propertyName) 
     { 
      PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName)); 
     } 
    } 

    public class DummyData : INotifyPropertyChanged 
    { 
     public string FirstName { get; set; } 
     public string LastName { get; set; } 
     public string Adress { get; set; } 

     private bool showDetails; 

     public bool ShowDetails 
     { 
      get 
      { 
       return showDetails; 
      } 
      set 
      { 
       showDetails = value; 
       RaisePropertyChangeEvent(nameof(ShowDetails)); 
      } 
     } 

     public event PropertyChangedEventHandler PropertyChanged; 

     public void RaisePropertyChangeEvent(string propertyName) 
     { 
      PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName)); 
     } 
    } 
} 

変数tempSelectedItemは、その情報を非表示にするために前回クリックされた項目を保持します。

に応じて情報を表示し、非表示にするために、我々は、単純なBoolToVisibilityConverter必要があります。

using System; 
using Windows.UI.Xaml; 
using Windows.UI.Xaml.Data; 

namespace App1 
{ 
    public class BoolToVisibilityConverter : IValueConverter 
    { 
     public object Convert(object value, Type targetType, object parameter, string language) 
     { 
      bool boolValue = (bool)value; 
      return boolValue ? Visibility.Visible : Visibility.Collapsed; 
     } 

     public object ConvertBack(object value, Type targetType, object parameter, string language) 
     { 
      throw new NotImplementedException(); 
     } 
    } 
} 

は、この情報がお役に立てば幸いです。