Group, Item を識別

Grid App で Group, Item を識別して、3種類の BlankPage に遷移します。

前田稔(Maeda Minoru)の超初心者のプログラム入門

Item を識別

  1. このプロジェクトは Windows8 Grid の続きです。
    このとき MessageDialog に Item Title が表示されるのを確認していただきました。
        void ItemView_ItemClick(object sender, ItemClickEventArgs e)
        {   string str = e.ClickedItem.ToString();
            Windows.UI.Popups.MessageDialog dlg =
                new Windows.UI.Popups.MessageDialog(str);
            dlg.ShowAsync();
            this.Frame.Navigate(typeof(BlankPage1), "AllGroups");
        }
        
    Item の識別は、この値(str)を使えば良いので簡単です。
  2. ソースコードの修正に先だって、遷移する3種類の BlankPage を作成します。
    BlankPage1 は作成されているので、BlankPage2 と BlankPage3 を追加します。
    そのまま作業すれば、規定値で BlankPage2 と BlankPage3 が作成されます。
    ・ ページ毎に色を変えて見分けがつくようにする(赤,緑,青)
    ・ 文字のサイズを大きく(50)する
    BlankPage1 のソースを参照して BlankPage2 と BlankPage3 を修正する方法が簡単です。
    詳細は List Navigate を参照して下さい。
  3. BlankPage に張り付けたボタンに Event Handler(Button_Click_1)を設定します。
    赤と緑の Button_Click_1() メソッドです。
        private void Button_Click_1(object sender, RoutedEventArgs e)
        {   this.Frame.Navigate(typeof(GroupDetailPage), "Group-1");
        }
        
    青の BlankPage からは GroupedItemsPage に遷移してみましょう。
        private void Button_Click_1(object sender, RoutedEventArgs e)
        {   this.Frame.Navigate(typeof(GroupedItemsPage), "AllGroups");
        }
        
  4. GroupDetailPage.xaml.cs に Item を識別して3種類の BlankPage に遷移するコードを書きます。
        void ItemView_ItemClick(object sender, ItemClickEventArgs e)
        {   string str = e.ClickedItem.ToString();
            if (str=="Item Title: 1")
                this.Frame.Navigate(typeof(BlankPage1), "AllGroups");
            else if (str == "Item Title: 2")
                this.Frame.Navigate(typeof(BlankPage2), "AllGroups");
            else if (str == "Item Title: 3")
                this.Frame.Navigate(typeof(BlankPage3), "AllGroups");
        }
        
  5. Item1~Item3 をクリックすると BlankPage1~BlankPage3 に遷移します。
    赤と緑の BlankPage のボタンをクリックすると GroupDetailPage に戻ります。
    青の BlankPage のボタンをクリックすると GroupedItemsPage に遷移します。
    Group を識別していないので、どの Group で操作しても同じです。

Group を識別

  1. 次は Group を識別する方法を説明します。
    Group の情報は GroupDetailPage.xaml.cs の LoadState() メソッドで取得出来ます。
    修正前
        protected override void LoadState(Object navigationParameter,
            Dictionary pageState)
        {   var group = SampleDataSource.GetGroup((String)navigationParameter);
            this.DefaultViewModel["Group"] = group;
            this.DefaultViewModel["Items"] = group.Items;
        }
        
    修正後
    string g_str; は class GroupDetailPage の最初の方で定義して下さい。
        string g_str;
    
        protected override void LoadState(Object navigationParameter,
            Dictionary pageState)
        {   var group = SampleDataSource.GetGroup((String)navigationParameter);
            this.DefaultViewModel["Group"] = group;
            this.DefaultViewModel["Items"] = group.Items;
            g_str = navigationParameter.ToString();
            Windows.UI.Popups.MessageDialog dlg =
                new Windows.UI.Popups.MessageDialog(g_str);
            dlg.ShowAsync();
        }
        
  2. プログラムを実行して MessageDialog に Group が表示されることを確かめて下さい。
    Group の識別は、この値(g_str)を使えば良いので簡単です。
    GroupDetailPage.xaml.cs に Group と Item を識別して3種類の BlankPage に遷移するコードを書きます。
        void ItemView_ItemClick(object sender, ItemClickEventArgs e)
        {
            string str = e.ClickedItem.ToString();
            if (g_str == "Group-1")
            {
                if (str == "Item Title: 1")
                    this.Frame.Navigate(typeof(BlankPage1), "AllGroups");
                else if (str == "Item Title: 2")
                    this.Frame.Navigate(typeof(BlankPage2), "AllGroups");
                else if (str == "Item Title: 3")
                    this.Frame.Navigate(typeof(BlankPage3), "AllGroups");
            }
        }
        
  3. これで Group1 の Item1~Item3 をクリックしたときにだけ BlankPage に遷移します。
    赤と緑の BlankPage のボタンをクリックすると GroupDetailPage に戻ります。
    青の BlankPage のボタンをクリックすると GroupedItemsPage に遷移します。

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