CODEWITHSUNDEEP
c#.netwpfxamlpopup
Only Bolivian Here
Only Bolivian Here

Reputation: 36753

Needs suggestions on how to build a pop up form when an object is clicked

Basically I have three empty slots.

These three slots represent three chosen items of a game.

When I click one of the empty boxes, I want to display this pop up box with a collection of all of the items and some checkboxes where users can choose certain filters and the items filter out.

The construction of such "window" is not hard for me, what I am having trouble figuring out is how the window should exist in relation to the main Window.

Should I place this new pop up in a new Window and have it appear when a user clicks, then on clicking the item, send that chosen item back to the main Window event?

How would you do it? I'm kind of new to WPF and would appreciate some feedback.

Upvotes: 1

Views: 209

Answers (3)

bebleo
bebleo

Reputation: 326

Assuming that since you have tagged this question with "popup" you want a dialog box you could create event handlers for the click event on the boxes something like the following:

private void On_BoxClicked(sender object, EventArgs e)
{
     PopUpBox dialog = new PopUpBox();
     var result = PopUpBox.ShowDialog();
     if (result == true)
     {
          //process the result here accessing the properties that
          //are needed through the dialog object.
     }
}

You will need to set the DialogResult for the form to be true. I ussually just add to the OnClick event for the button that you wish to return as being successful for, and close, the following:

this.DialogResult = true;

For more information about custom dialog forms see: Custom Dialog Boxes

Using RoutedCommands

A more sophisticated approach would be to add a command to the form with the parameter for each box. Code for the actual handling off adding the items would be more or less the same, but it does add certain features (such as disabling the click event unless certain conditions -- defined in the CanExecute method -- are met):

//the custom command
public static RoutedCommand AddToBox = new RoutedCommand();

//add the can execute method
private void AddToBox_CanExecute(sender object, CanExecuteRoutedEventArgs e)
{
    //assuming that this can always execute
    e.CanExecute = true;
}

//Executing the command when the button is clicked
//Show the dialog box and get the response
private void AddToBox_Executed(sender object, ExecutedRoutedEventArgs e)
{
     PopUpBox dialog = new PopUpBox();
     var result = dialog.ShowDialog();
     if (result == true)
     {
          string box = e.Parameter;      

          //get the result of the dialog where GetResult() is the
          //method that returns the necessary information.
          //here set to object for the sake of example
          object[] obj = dialog.GetResult()

          switch (box)
          {
               case "box1":
                    //put value into box 1
               case "box2":
                    //put value into box 2
               case "box3":
                    //put value into box 3
          }
     }
}

In order to use the command add a reference to the command. First you will need to add a reference to the namespace, presesuming that this command is contained in Example.Window1:

<Window ...
     xmlns:cmd="clr:NameSpace:Example" ... />

Then add the Command Binding

<Window.CommandBindings>
     <CommandBinding Command="{x:Static cmd:Window1.AddToBox}" 
          CanExecute="AddToBox_CanExecute" Executed="AddToBox_Executed" />
</Window.CommandBindings>

Finally, add the command and parameter to the XAML, for example:

<Button Name="Box1" 
      Command="{x:Static cmd:Window1.AddToBox}" 
      CommandParameter="Box1" />

For more information about custom routed commands in WPF see: RoutedCommand Class

Upvotes: 0

Devendra D. Chavan
Devendra D. Chavan

Reputation: 9021

Rather than a popup window you can have a flow design.


Screen 1
Screen1
The user clicks on one of the slots to view more information or add filter options for that slot. Clicking on the slot opens Screen2.


Screen 2
Screen2
In this screen the user can filter the items he wants. The active slot (slot being edited) is highlighted on the left. More information on the chosen item can also be shown. At the bottom at the apply and cancel (back) buttons. A prompt can be shown in case the user cancels without saving/applying.

You can apply WPF Styles and Animations to make your application more visually appealing.

Upvotes: 2

Gabriel GM
Gabriel GM

Reputation: 6649

What you can do is open your other window as a new form and use the method ShowDialog() instead of Show(). This way, you're gonna be able to use the DialogResult of your window to know if the user cancelled or selected an item and you can make a method in this window to get the value you need.

frmList frmPopup = new frmList();
DialogResult response = frmPopup.ShowDialog();  //Execution of this method stops until you close frmPopup

if(response == DialogResult.Ok)                 //Make sure you set the DialogResult value in your form when you are closing correctly
{
    frmPopup.getValue();                        //Method of the window that would return the value you're looking for
}

Upvotes: 0

Related Questions