List View Data

ListView の Navigate Data を Class にします。

前田稔の超初心者のプログラム入門

プログラムの説明

  1. ListView で Navigate する Data を Class にまとめます。
    Visual Studio を起動して [FILE][New Project] から [空白アプリ(ユニバーサル Windows)] を選びプロジェクトを構築します。
    MainPage.xaml をダブルクリックしてレイアウトウインドウを表示します。
    画像を参考に TextBox, ListView, Button を貼り付けます。

    ツールName説明
    TextBox textBox 入力用 TextBox
    ListView listView List View Item
    Button button Button
    TextBox TextBoxOut 表示用 TextBox
  2. MainPage.xaml.cs の Constructor から ListView にアイテムを登録する ListItemAdd() 関数を呼び出します。
        public MainPage()
        {   this.InitializeComponent();
            ListItemAdd();
        }
    
  3. SampleConfiguration.cs に ListItemAdd() 関数をプログラムしてプロジェクトに加えます。
    partial class MainPage として宣言され、MainPage で宣言した他の Class と一つにまとめられます。
    using System;
    using System.Collections.Generic;
    using Windows.UI.Xaml.Controls;
    
    namespace App1
    {
        public class LvData
        {   public string Title { get; set; }
            public Type ClassType { get; set; }
            public override string ToString()
            {   return Title;  }
        }
        public partial class MainPage : Page
        {
            List<LvData> lvdata = new List<LvData>
            {   new LvData() { Title="1) Scenario1", ClassType=typeof(Scenario1) },
                new LvData() { Title="2) Scenario2", ClassType=typeof(Scenario2) },
                new LvData() { Title="3) Scenario3", ClassType=typeof(Scenario3) }
            };
            private void ListItemAdd()
            {   foreach (LvData s in lvdata)
                {   listView.Items.Add(s.Title);
                }
            }
        }
    }
    
  4. ListView の Click を検出するイベントハンドラを設定します。
    MainPage.xaml のレイアウトウインドウを表示して、ListView の稲妻アイコンから SelectionChanged に ScenarioChanged とタイプします。
    また ListView の [その他の指定] から IsItemClickEnabled をチェックして下さい。
    (英語版では [Arrange by: Source] の [Other] から IsItemClickEnabled をチェック)
  5. ListView の SelectionChanged を検出するイベントハンドラをコーディングします。
    クリックされたアイテムの Index を Scenario_No に保存します。
    List View Navi では ItemClick を検出していましたが、今回は SelectionChanged を検出します。
        Scenario_No = 0;
        private void ScenarioChanged(object sender, SelectionChangedEventArgs e)
        {   Scenario_No = listView.SelectedIndex;
            string str = "Index : " + Scenario_No;
            TextBoxOut.Text = str;
        }
    
  6. Button Click のイベントハンドラを設定して Scenario_No のページを呼び出します。
        private void Button_Click(object sender, RoutedEventArgs e)
        {   this.Frame.Navigate(lvdata[Scenario_No].ClassType, "AllGroups");
        }
    
  7. [Add][New Item] から [Blank Page] で シナリオ(Scenario1~Scenario3)を追加します。
    Scenario ページには TextBlock(適当なメッセージ)と Button を張り付けて下さい。
    Scenario ページの作成は Navigate Page2 などを参考にして下さい。
  8. ボタンのクリックで MainPage に戻ります。
        public sealed partial class Scenario1 : Page
        {   public Scenario1()
            {   this.InitializeComponent();  }
            protected override void OnNavigatedTo(NavigationEventArgs e)
            {   }
            private void button_Click(object sender, RoutedEventArgs e)
            {   this.Frame.Navigate(typeof(MainPage), "AllGroups");  }
        }
    
  9. ListView の Scenario1~Scenario3 をクリックすると Scenario_No に記録します。
    Button Click で Scenario_No のページを呼び出します。
    Scenario ページのボタンのクリックで MainPage に戻ります。

超初心者のプログラム入門(C# Frame Work)