Still celebrating National IT Professionals Day with 3 months of free Premium Membership. Use Code ITDAY17

x
?
Solved

Confirmation box in wpf

Posted on 2010-09-10
16
Medium Priority
?
1,146 Views
Last Modified: 2013-11-12
Hi!

I want to create in a WPF application a box, on which we can set a text/color/icon and is displayed during a specified times and after disapear.

The goal is to confirm that action that the user have order have been correctly made.

It has to be not blocking anything else, it's only a "user feedback".

Something like a "Live messenger" popup(but not a the same place and with only one event possible).

How can I do this in WPF?

Thank you!
0
Comment
Question by:Nargzul
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 9
  • 7
16 Comments
 
LVL 29

Expert Comment

by:Gautham Janardhan
ID: 33646609
you can create a user control which will inherit from  window  ,put your logic in this user control

have a static method in the user control which will pop it to the user.
0
 
LVL 1

Author Comment

by:Nargzul
ID: 33647096
Sure I can, but how to:
-Create the effect(appear & disappear)
-put it on foreground without it takes the focus
-have no item in the taskbar
0
 
LVL 29

Expert Comment

by:Gautham Janardhan
ID: 33648570
If we use a pop up instead of the window then we can utilize the inherent appear/disappear animation, this will also take care of the next two requirements also (not stealing focus and not showing up in the task bar)..By setting the property StaysOpen in the popup we can make sure the popup stays open until the uses closes it or the timer runs out
0
DFW AZURE MEETUP TONIGHT FRI 6PM

We will be discussing what Azure Stack is, how does it fit into the suit of offerings that Azure has currently, and where can it fit into your organizations technology stack. We will also be discussing limitations of the platform while covering various applicable scenarios.

 
LVL 1

Author Comment

by:Nargzul
ID: 33648680
can you furnish me a sample of a creation of popup?
0
 
LVL 29

Accepted Solution

by:
Gautham Janardhan earned 2000 total points
ID: 33649506
xaml
<Window x:Class="Tes1234.Window1"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="Window1">
    <Grid x:Name="LayoutRoot">

        <Button Width="120" Height="24" Click="Button_Click">Open Popup</Button>

        <Popup x:Name="confPopUp" StaysOpen="True" PopupAnimation="Fade">
            <Border BorderBrush="Black" BorderThickness=".2" CornerRadius="5">
                <Grid Background="White" Width="350" Height="250">
                    <Grid.RowDefinitions>
                        <RowDefinition Height="Auto"/>
                        <RowDefinition Height="*"/>
                        <RowDefinition Height="Auto"/>
                    </Grid.RowDefinitions>
                    <Button HorizontalAlignment="Right" Width="20" Height="20" Content="x" Click="Button_Click_1"/>
                    <TextBlock Text="Some message" Grid.Row="1"/>
                    <StackPanel Grid.Row="2" Orientation="Horizontal" HorizontalAlignment="Right">
                        <Button Width="120" Height="24" Margin="5" Content="Ok" Click="Button_Click_2"/>
                        <Button Width="120" Height="24" Margin="5" Content="Cancel" Click="Button_Click_3"/>
                    </StackPanel>
                </Grid>
            </Border>
        </Popup>

        <!--<TreeView Name="treeView1" ItemsSource="{Binding Filters}" Grid.Row="5" Grid.ColumnSpan="3" SelectedItemChanged="treeView1_SelectedItemChanged">
            <TreeView.ItemTemplate>
                <HierarchicalDataTemplate ItemsSource="{Binding Path=SubItems}">
                    <TextBlock FontWeight="Bold" Text="{Binding Path=Category}" />
                    <HierarchicalDataTemplate.ItemTemplate>
                        <DataTemplate>
                            <TextBlock Text="{Binding Path=CommonName}"/>
                        </DataTemplate>
                    </HierarchicalDataTemplate.ItemTemplate>
                </HierarchicalDataTemplate>
            </TreeView.ItemTemplate>
        </TreeView>-->
    </Grid>
</Window>

Open in new window

0
 
LVL 29

Assisted Solution

by:Gautham Janardhan
Gautham Janardhan earned 2000 total points
ID: 33649509
code behind
public partial class Window1 : Window
    {
        public Window1()
        {
            InitializeComponent();

            Filters = new ObservableCollection<Filter>();
            Filters.Add(new Filter()
            {
                Category = "categ1",
                CommonName = "commonName 1",
                Value = "test 1234",
                SubItems = new ObservableCollection<Filter>()
                 {
                     new Filter()
                     {
                         Category = "categ2",
                         CommonName = "commonName 2",
                         Value = "test 4321",
                         SubItems = new ObservableCollection<Filter>()
                         {
                             new Filter()
                             {
                                 Category = "categ3",
                                 CommonName = "commonName 3",
                                 Value = "test 2255",
                             }
                         }
                     }
                 }
            });

            this.DataContext = this;
        }

        public ObservableCollection<Filter> Filters { get; set; }


        private void treeView1_SelectedItemChanged(object sender, RoutedPropertyChangedEventArgs<object> e)
        {
            MessageBox.Show(((Filter)(sender as TreeView).SelectedItem).CommonName);
        }

        private void Button_Click(object sender, RoutedEventArgs e)
        {
            confPopUp.PlacementTarget = this;
            confPopUp.Placement = System.Windows.Controls.Primitives.PlacementMode.Center;
            confPopUp.IsOpen = true;
        }

        private void Button_Click_1(object sender, RoutedEventArgs e)
        {
            confPopUp.IsOpen = false;
        }

        private void Button_Click_2(object sender, RoutedEventArgs e)
        {
            confPopUp.IsOpen = false;
        }

        private void Button_Click_3(object sender, RoutedEventArgs e)
        {
            confPopUp.IsOpen = false;
        }
    }

Open in new window

0
 
LVL 1

Author Comment

by:Nargzul
ID: 33659756
Thank you! Do you think I can put this in a different user-control? It has to be used in several pages
0
 
LVL 29

Expert Comment

by:Gautham Janardhan
ID: 33660056
yeh you can.. i was lazy so everything was in the same page :-)
0
 
LVL 1

Author Comment

by:Nargzul
ID: 33670619
Is there a way to specify in how much time the popup is showed?

I've a rounded corner, but the small part of the corner comes black, you know why?

0
 
LVL 29

Expert Comment

by:Gautham Janardhan
ID: 33670739
You can create a timer in the user control , and when the timer runs out you can close the popup.

Not sure about the rounded corner.Can you post the xaml for this
0
 
LVL 1

Author Comment

by:Nargzul
ID: 33670756
Excuse me, I misspoke:

I want to know, how to change the time the popup take to be fully displayed(with fading).


<UserControl x:Class="Misc.MessagePopup"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             mc:Ignorable="d" 
             d:DesignHeight="300" d:DesignWidth="300">
    <Grid Background="Transparent">
        <Popup x:Name="uxPopup" StaysOpen="True" PopupAnimation="Fade" Grid.ColumnSpan="2"  >
            <Border Name="uxBorder" BorderThickness="5" CornerRadius="10">
                <Grid Width="350" Height="150" Name="uxMainGrid">
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="20*" />
                        <ColumnDefinition Width="80*" />
                    </Grid.ColumnDefinitions>
                    <Image Name="uxIcon" Width="48" Height="48" />
                    <StackPanel Orientation="Vertical" Grid.Column="1">
                        <Label Name="uxMessage" FontSize="16">Message Here</Label>
                        <Button Name="uxCloseButton" Content="Close" Visibility="Collapsed" Click="Button_Click" />
                    </StackPanel>
                </Grid>
            </Border>
        </Popup>
    </Grid>
</UserControl>

//Code behind
using System;
using System.Timers;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Media;
using System.Windows.Media.Imaging;

namespace Misc
{
    /// <summary>
    /// Interaction logic for MessagePopup.xaml
    /// </summary>
    public partial class MessagePopup : UserControl
    {
        #region private vars
        private Timer _timer;
        private Window _window;
        private BitmapImage _okIcon;
        private BitmapImage _warningIcon;
        private BitmapImage _errorIcon;
        private delegate void StopPopupDelegate();
        #endregion

        #region constructor
        /// <summary>
        /// Initializes a new instance of the <see cref="MessagePopup"/> class.
        /// </summary>
        public MessagePopup()
        {
            InitializeComponent();
            InitIcons();
        }
        #endregion

        #region private vars
        /// <summary>
        /// Inits the icons.
        /// </summary>
        private void InitIcons()
        {
            _okIcon = new BitmapImage();
            _okIcon.BeginInit();
            _okIcon.UriSource = new Uri("pack://application:,,,/GuiResources;component/StatusIcon/ok.png");
            _okIcon.EndInit();

            _warningIcon = new BitmapImage();
            _warningIcon.BeginInit();
            _warningIcon.UriSource = new Uri("pack://application:,,,/GuiResources;component/StatusIcon/warning.png");
            _warningIcon.EndInit();

            _errorIcon = new BitmapImage();
            _errorIcon.BeginInit();
            _errorIcon.UriSource = new Uri("pack://application:,,,/GuiResources;component/StatusIcon/error.png");
            _errorIcon.EndInit();
        }


        /// <summary>
        /// Handles the Elapsed event of the _timer control.
        /// </summary>
        /// <param name="sender">The source of the event.</param>
        /// <param name="e">The <see cref="System.Timers.ElapsedEventArgs"/> instance containing the event data.</param>
        private void _timer_Elapsed(object sender, ElapsedEventArgs e)
        {
            uxPopup.Dispatcher.BeginInvoke(new StopPopupDelegate(StopPopup));
        }
        /// <summary>
        /// Stops the popup.
        /// </summary>
        private void StopPopup()
        {
            uxPopup.IsOpen = false;
        }

        /// <summary>
        /// Handles the Click event of the Button control.
        /// </summary>
        /// <param name="sender">The source of the event.</param>
        /// <param name="e">The <see cref="System.Windows.RoutedEventArgs"/> instance containing the event data.</param>
        private void Button_Click(object sender, RoutedEventArgs e)
        {
            uxPopup.IsOpen = false;
        }
        #endregion

        #region public members
        /// <summary>
        /// Opens the specified events.
        /// </summary>
        /// <param name="events">The events.</param>
        public void Open(GfKUserControlEventParameter events )
        {
            uxMessage.Content = events.Text;
            Boolean useTimer = true;
            Boolean useButton = false;
            
            switch(events.EventType)
            {
                case ViewFlowManager.Enums.EventType.Warning:
                    uxBorder.BorderBrush = Brushes.Orange;
                    uxMainGrid.Background = Brushes.SandyBrown;
                    uxIcon.Source = _warningIcon;
                    _timer = new Timer(3000);
                    break;
                case ViewFlowManager.Enums.EventType.Error:
                    uxBorder.BorderBrush = Brushes.Crimson;
                    uxMainGrid.Background = Brushes.Orchid;
                    uxIcon.Source = _errorIcon;
                    useTimer = false;
                    useButton = true;
                    break;
                case ViewFlowManager.Enums.EventType.Confirmation:
                default:
                    uxBorder.BorderBrush = Brushes.SpringGreen;
                    uxMainGrid.Background = Brushes.PaleGreen;
                    uxIcon.Source = _okIcon;
                    _timer = new Timer(1000);
                    break;
            }

            uxPopup.PlacementTarget = _window;
            uxPopup.Placement = System.Windows.Controls.Primitives.PlacementMode.Center;
            uxPopup.IsOpen = true;
            if (useTimer)
            {
                _timer.Elapsed += new ElapsedEventHandler(_timer_Elapsed);
                _timer.AutoReset = false;
                _timer.Start();
            }
            if (useButton)
            {
                uxCloseButton.Visibility = System.Windows.Visibility.Visible;
            }
            else
            {
                uxCloseButton.Visibility = System.Windows.Visibility.Collapsed;
            }

        }

        /// <summary>
        /// Sets the window.
        /// </summary>
        /// <param name="window">The window.</param>
        public void setWindow(Window window)
        {
            _window = window;
        }
        #endregion

    }
}

Open in new window

0
 
LVL 29

Expert Comment

by:Gautham Janardhan
ID: 33670833
   <Border Name="uxBorder" BorderThickness="5" CornerRadius="10" background="Transparent">
                <Grid Width="350" Height="150" Name="uxMainGrid">
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="20*" />
                        <ColumnDefinition Width="80*" />
                    </Grid.ColumnDefinitions>
                    <Image Name="uxIcon" Width="48" Height="48" />
                    <StackPanel Orientation="Vertical" Grid.Column="1">
                        <Label Name="uxMessage" FontSize="16">Message Here</Label>
                        <Button Name="uxCloseButton" Content="Close" Visibility="Collapsed" Click="Button_Click" />
                    </StackPanel>
                </Grid>
            </Border>
        </Popup>
0
 
LVL 29

Expert Comment

by:Gautham Janardhan
ID: 33670845
i made the bacground of the popup transparent ..this will take careof your rounded edges
0
 
LVL 1

Author Comment

by:Nargzul
ID: 33670884
I tried to put it on the popup but there wasn't any properties, seems you put it on border in your example, I've done that but it doesn't change anything
border.png
0
 
LVL 29

Assisted Solution

by:Gautham Janardhan
Gautham Janardhan earned 2000 total points
ID: 33674742
my bad i should have tested before posting...no VS .. try setting AllowsTransparency="True" for the Pop up it should work...
0
 
LVL 1

Author Closing Comment

by:Nargzul
ID: 33679522
Thank you!
0

Featured Post

Enroll in September's Course of the Month

This month’s featured course covers 16 hours of training in installation, management, and deployment of VMware vSphere virtualization environments. It's free for Premium Members, Team Accounts, and Qualified Experts!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

A theme is a collection of property settings that allow you to define the look of pages and controls, and then apply the look consistently across pages in an application. Themes can be made up of a set of elements: skins, style sheets, images, and o…
Whether you've completed a degree in computer sciences or you're a self-taught programmer, writing your first lines of code in the real world is always a challenge. Here are some of the most common pitfalls for new programmers.
This is Part 3 in a 3-part series on Experts Exchange to discuss error handling in VBA code written for Excel. Part 1 of this series discussed basic error handling code using VBA. http://www.experts-exchange.com/videos/1478/Excel-Error-Handlin…
This tutorial will teach you the special effect of super speed similar to the fictional character Wally West aka "The Flash" After Shake : http://www.videocopilot.net/presets/after_shake/ All lightning effects with instructions : http://www.mediaf…

670 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question