{"id":753,"date":"2019-02-13T12:44:14","date_gmt":"2019-02-13T12:44:14","guid":{"rendered":"https:\/\/ibex.tech\/windows-iot\/?p=753"},"modified":"2022-09-13T16:01:54","modified_gmt":"2022-09-13T15:01:54","slug":"creating-a-pop-up-menu-dialog-box","status":"publish","type":"post","link":"https:\/\/ibex.tech\/csharp\/uwp-programming-in-c\/windows-and-pages\/pages\/content-dialog-boxes\/examples-content-dialog-boxes\/creating-a-pop-up-menu-dialog-box","title":{"rendered":"Creating a pop up menu dialog box"},"content":{"rendered":"\n

Menu > Project > Add new item > Visual C# > Content Dialog<\/p>\n\n\n\n

We delete the following default ContentDialog options to remove them:<\/p>\n\n\n

PrimaryButtonText=
SecondaryButtonText=
PrimaryButtonClick=
SecondaryButtonClick=<\/p>\n\n\n

The xaml code<\/h5>\n\n\n\n
<ContentDialog\n    x:Class=\"ecu_winiot.MenuPopup\"\n    xmlns=\"http:\/\/schemas.microsoft.com\/winfx\/2006\/xaml\/presentation\"\n    xmlns:x=\"http:\/\/schemas.microsoft.com\/winfx\/2006\/xaml\"\n    xmlns:local=\"using:ecu_winiot\"\n    xmlns:d=\"http:\/\/schemas.microsoft.com\/expression\/blend\/2008\"\n    xmlns:mc=\"http:\/\/schemas.openxmlformats.org\/markup-compatibility\/2006\"\n    mc:Ignorable=\"d\"\n    x:Name=\"DialogBox\"\n    Title=\"Menu\">\n\n    <Grid Background=\"{ThemeResource ApplicationPageBackgroundThemeBrush}\" Margin=\"0,20\" >\n        <Grid.RowDefinitions>\n            <RowDefinition Height=\"1*\" \/>\n            <RowDefinition Height=\"80\" \/>\n            <RowDefinition Height=\"80\" \/>\n            <RowDefinition Height=\"80\" \/>\n        <\/Grid.RowDefinitions>\n        <Grid.ColumnDefinitions>\n            <ColumnDefinition Width=\"1*\"\/>\n            <ColumnDefinition Width=\"1*\"\/>\n        <\/Grid.ColumnDefinitions>\n        <TextBlock Grid.ColumnSpan=\"2\" Text=\"Select Option\" Margin=\"5\" \/>\n        <Button Grid.Row=\"1\" Grid.Column=\"0\" Content=\"Item 1\" x:Name=\"ButtonMenuItem1\" Click=\"ButtonMenuItem_Click\" Margin=\"5,0\" Width=\"100\" HorizontalAlignment=\"Center\" \/>\n        <Button Grid.Row=\"1\" Grid.Column=\"1\" Content=\"Item 2\" x:Name=\"ButtonMenuItem2\" Click=\"ButtonMenuItem_Click\" Margin=\"5,0\" Width=\"100\" HorizontalAlignment=\"Center\" \/>\n        <Button Grid.Row=\"2\" Grid.Column=\"0\" Content=\"Item 3\" x:Name=\"ButtonMenuItem3\" Click=\"ButtonMenuItem_Click\" Margin=\"5,0\" Width=\"100\" HorizontalAlignment=\"Center\" \/>\n        <Button Grid.Row=\"2\" Grid.Column=\"1\" Content=\"Item 4\" x:Name=\"ButtonMenuItem4\" Click=\"ButtonMenuItem_Click\" Margin=\"5,0\" Width=\"100\" HorizontalAlignment=\"Center\" \/>\n        <Button Grid.Row=\"3\" Grid.Column=\"1\" Content=\"Cancel\" x:Name=\"ButtonCancel\" Click=\"ButtonMenuItem_Click\" Margin=\"5,0\" Width=\"100\" HorizontalAlignment=\"Center\" \/>\n    <\/Grid>\n<\/ContentDialog><\/code><\/pre>\n\n\n\n
The xmal.cs code<\/h5>\n\n\n\n
    public sealed partial class MenuPopup : ContentDialog\n    {\n\t\t\/\/--------------------------\n\t\t\/\/----- PUBLIC DEFINES -----\n\t\t\/\/--------------------------\n        public enum DialogResult\n        {\n            MenuItem1,\n            MenuItem2,\n            MenuItem3,\n            MenuItem4,\n            Cancel,\n            Unknown\n        }\n\n\t\t\/\/---------------------------\n\t\t\/\/----- PRIVATE DEFINES -----\n\t\t\/\/---------------------------\n\t\t\/\/private \n\n\t\t\/\/--------------------------\n\t\t\/\/----- PUBLIC OBJECTS -----\n\t\t\/\/--------------------------\n\t\tpublic DialogResult Result;\n\n\t\t\/\/---------------------------\n\t\t\/\/----- PRIVATE OBJECTS -----\n\t\t\/\/---------------------------\n\t\t\/\/private \n\n\n\t\t\/\/*********************************\n\t\t\/\/*********************************\n\t\t\/\/********** CONSTRUCTOR **********\n\t\t\/\/*********************************\n\t\t\/\/*********************************\n        public MenuPopup()\n        {\n            this.InitializeComponent();\n            this.Result = DialogResult.Unknown;\n        }\n\n\t\t\/\/************************************\n\t\t\/\/************************************\n\t\t\/\/********** BUTTON PRESSED **********\n\t\t\/\/************************************\n\t\t\/\/************************************\n\t\tprivate void ButtonMenuItem_Click(object sender, RoutedEventArgs e)\n\t\t{\n\t\t\tvar ClickedButton = sender as Button;\n\t\t\tswitch (ClickedButton.Name)\n\t\t\t{\n\t\t\tcase \"ButtonMenuItem1\":\n\t\t\t\tthis.Result = DialogResult.MenuItem1;\n\t\t\t\tbreak;\n\t\t\tcase \"ButtonMenuItem2\":\n\t\t\t\tthis.Result = DialogResult.MenuItem2;\n\t\t\t\tbreak;\n\t\t\tcase \"ButtonMenuItem3\":\n\t\t\t\tthis.Result = DialogResult.MenuItem3;\n\t\t\t\tbreak;\n\t\t\tcase \"ButtonMenuItem4\":\n\t\t\t\tthis.Result = DialogResult.MenuItem4;\n\t\t\t\tbreak;\n\t\t\tcase \"ButtonCancel\":\n\t\t\t\tthis.Result = DialogResult.Cancel;\n\t\t\t\tbreak;\n\t\t\t}\n            \n\t\t\t\/\/CLOSE DIALOG BOX\n\t\t\tDialogBox.Hide();\n\t\t}\n\t}<\/code><\/pre>\n\n\n\n
Using the dialog box<\/h5>\n\n\n\n
Note – make the _Click method “private async” as it will be doing an async call<\/p>\n\n\n\n
    \/\/*********************************\n    \/\/*********************************\n    \/\/********** MENU BUTTON **********\n    \/\/*********************************\n    \/\/*********************************\n    private async void ButtonMenu_Click(object sender, RoutedEventArgs e)\n    {\n\n        \/\/----- SHOW MENU DIALOG BOX -----\n        MenuPopup DialogBox = new MenuPopup();\n        await DialogBox.ShowAsync();\n        if (DialogBox.Result == MenuPopup.DialogResult.MenuItem1)\n        {\n            \/\/Do something...\n            int i = 0;\n        }\n    }<\/code><\/pre>\n","protected":false},"excerpt":{"rendered":"
Menu > Project > Add new item > Visual C# > Content Dialog We delete the following default ContentDialog options to remove them: PrimaryButtonText=SecondaryButtonText=PrimaryButtonClick=SecondaryButtonClick= The xaml code The xmal.cs code Using the dialog box Note – make the _Click method “private async” as it will be doing an async call<\/p>\n","protected":false},"author":5,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[149],"tags":[],"class_list":["post-753","post","type-post","status-publish","format-standard","hentry","category-examples-content-dialog-boxes"],"_links":{"self":[{"href":"https:\/\/ibex.tech\/csharp\/wp-json\/wp\/v2\/posts\/753","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ibex.tech\/csharp\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/ibex.tech\/csharp\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/ibex.tech\/csharp\/wp-json\/wp\/v2\/users\/5"}],"replies":[{"embeddable":true,"href":"https:\/\/ibex.tech\/csharp\/wp-json\/wp\/v2\/comments?post=753"}],"version-history":[{"count":1,"href":"https:\/\/ibex.tech\/csharp\/wp-json\/wp\/v2\/posts\/753\/revisions"}],"predecessor-version":[{"id":1146,"href":"https:\/\/ibex.tech\/csharp\/wp-json\/wp\/v2\/posts\/753\/revisions\/1146"}],"wp:attachment":[{"href":"https:\/\/ibex.tech\/csharp\/wp-json\/wp\/v2\/media?parent=753"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/ibex.tech\/csharp\/wp-json\/wp\/v2\/categories?post=753"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/ibex.tech\/csharp\/wp-json\/wp\/v2\/tags?post=753"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}