MetroStyleApp入門 vol61.PopupMenuでプルダウンを表現する

日曜日 , 9, 9月 2012 Leave a comment

 Widnows 8で以下のようなプルダウンメニューを見ることがあります。

 

 ComboBoxのスタイルを修正したものだとずっと思っていたんですが、これPopupMenuクラスで実現します。

 

 ボタンを押した際に画像のようなメニューを表示する方法は以下、

 

        private async void Button_Click_1(object sender, RoutedEventArgs e)
        {
            var menu = new PopupMenu();

            menu.Commands.Add(new UICommand("コマンド1", (command) =>
            {
                this.resultText.Text = "コマンド1を選択しました";
            }));
            menu.Commands.Add(new UICommand("コマンド2", (command) =>
            {
                this.resultText.Text = "コマンド2を選択しました";
            }));


            // ここでセパレーターを追加
            menu.Commands.Add(new UICommandSeparator());


            menu.Commands.Add(new UICommand("コマンド3", (command) =>
            {
                this.resultText.Text = "コマンド3を選択しました";
            }));

            var chosenCommand = await menu.ShowForSelectionAsync(GetElementRect((FrameworkElement)sender));
        }

        public static Rect GetElementRect(FrameworkElement element)
        {
            GeneralTransform buttonTransform = element.TransformToVisual(null);
            Point point = buttonTransform.TransformPoint(new Point());
            return new Rect(point, new Size(element.ActualWidth, element.ActualHeight));
        }

 

 ComboBoxでこれやろうとしてすごい時間を費やしてしまいました・・・


Please give us your valuable comment

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です