BeepPopupForm

Overview

BeepPopupForm provides a flexible popup window that can host any control or content. It is ideal for tooltips, notifications, quick forms, or contextual menus, and supports advanced theming and animation.

Built on the BeepControl foundation, BeepPopupForm features automatic positioning, fade-in/fade-out animations, click-outside-to-close functionality, theme integration, and flexible content hosting. Perfect for contextual dialogs, dropdown menus, tooltip windows, and non-intrusive notification displays.

Key Features

Visual Preview

Notification Popup

Context Menu Popup

Custom Content Popup

Basic Usage

// Create a BeepPopupForm
var popup = new BeepPopupForm();
popup.Theme = "Dark";
popup.Size = new Size(300, 200);

// Add custom content
var label = new BeepLabel { 
    Text = "This is a popup!", 
    Dock = DockStyle.Fill,
    TextAlign = ContentAlignment.MiddleCenter
};
popup.Controls.Add(label);

// Show as non-modal
popup.Show();

// Or show as modal
// popup.ShowDialog();

// Create notification popup
var notification = new BeepPopupForm
{
    Size = new Size(350, 120),
    StartPosition = FormStartPosition.Manual,
    Location = new Point(Screen.PrimaryScreen.WorkingArea.Right - 370, 50),
    ShowInTaskbar = false,
    TopMost = true
};

// Create notification content
var panel = new BeepPanel { Dock = DockStyle.Fill, Padding = new Padding(15) };

var titleLabel = new BeepLabel
{
    Text = "Notification",
    Font = new Font("Segoe UI", 10, FontStyle.Bold),
    Dock = DockStyle.Top,
    Height = 25
};

var messageLabel = new BeepLabel
{
    Text = "Your operation completed successfully!",
    Dock = DockStyle.Fill,
    TextAlign = ContentAlignment.MiddleLeft
};

panel.Controls.Add(titleLabel);
panel.Controls.Add(messageLabel);
notification.Controls.Add(panel);

// Auto-close after 3 seconds
notification.Show();
Timer autoCloseTimer = new Timer { Interval = 3000 };
autoCloseTimer.Tick += (s, e) => {
    autoCloseTimer.Stop();
    notification.Close();
};
autoCloseTimer.Start();

Properties

Core Properties

Positioning Properties

Appearance Properties

Methods

Examples

public void ShowContextMenu(Control targetControl, Point mouseLocation)
{
    var contextPopup = new BeepPopupForm
    {
        Size = new Size(180, 120),
        AutoClose = true,
        FadeEffect = true,
        ShowShadow = true
    };

    var menuPanel = new BeepPanel { Dock = DockStyle.Fill };
    
    // Add menu items
    var menuItems = new[]
    {
        new { Text = "Copy", Icon = "📋", Action = new Action(() => CopySelection()) },
        new { Text = "Cut", Icon = "✂️", Action = new Action(() => CutSelection()) },
        new { Text = "Paste", Icon = "📄", Action = new Action(() => PasteSelection()) },
        new { Text = "-", Icon = "", Action = (Action)null }, // Separator
        new { Text = "Delete", Icon = "🗑️", Action = new Action(() => DeleteSelection()) }
    };

    int y = 5;
    foreach (var item in menuItems)
    {
        if (item.Text == "-")
        {
            // Add separator
            var separator = new Panel
            {
                Height = 1,
                BackColor = Color.Gray,
                Location = new Point(10, y),
                Width = 160
            };
            menuPanel.Controls.Add(separator);
            y += 6;
        }
        else
        {
            var menuItem = new BeepPanel
            {
                Height = 25,
                Location = new Point(0, y),
                Width = 180,
                Cursor = Cursors.Hand
            };

            var iconLabel = new Label
            {
                Text = item.Icon,
                Location = new Point(10, 5),
                Size = new Size(20, 15),
                TextAlign = ContentAlignment.MiddleCenter
            };

            var textLabel = new Label
            {
                Text = item.Text,
                Location = new Point(35, 5),
                Size = new Size(140, 15),
                TextAlign = ContentAlignment.MiddleLeft
            };

            menuItem.Controls.Add(iconLabel);
            menuItem.Controls.Add(textLabel);

            // Handle click
            if (item.Action != null)
            {
                menuItem.Click += (s, e) =>
                {
                    contextPopup.Close();
                    item.Action.Invoke();
                };
            }

            menuPanel.Controls.Add(menuItem);
            y += 25;
        }
    }

    contextPopup.Controls.Add(menuPanel);
    contextPopup.ShowPopup(mouseLocation);
}

private void CopySelection() => Clipboard.SetText(GetSelectedText());
private void CutSelection() { CopySelection(); DeleteSelection(); }
private void PasteSelection() => InsertText(Clipboard.GetText());
private void DeleteSelection() => RemoveSelectedText();

public class TooltipPopup
{
    private BeepPopupForm tooltipForm;
    private Timer showTimer;
    private Timer hideTimer;

    public void ShowTooltip(Control targetControl, string text, string title = null)
    {
        HideTooltip(); // Hide any existing tooltip

        tooltipForm = new BeepPopupForm
        {
            Size = new Size(250, title != null ? 80 : 60),
            AutoClose = false,
            FadeEffect = true,
            ShowShadow = true,
            BorderRadius = 6,
            FormBorderStyle = FormBorderStyle.None
        };

        var tooltipPanel = new BeepPanel
        {
            Dock = DockStyle.Fill,
            Padding = new Padding(10),
            BackColor = Color.FromArgb(45, 45, 48),
            ForeColor = Color.White
        };

        if (!string.IsNullOrEmpty(title))
        {
            var titleLabel = new Label
            {
                Text = title,
                Dock = DockStyle.Top,
                Height = 20,
                Font = new Font("Segoe UI", 9, FontStyle.Bold),
                ForeColor = Color.White
            };
            tooltipPanel.Controls.Add(titleLabel);
        }

        var textLabel = new Label
        {
            Text = text,
            Dock = DockStyle.Fill,
            Font = new Font("Segoe UI", 8),
            ForeColor = Color.LightGray,
            TextAlign = ContentAlignment.TopLeft
        };
        tooltipPanel.Controls.Add(textLabel);

        tooltipForm.Controls.Add(tooltipPanel);

        // Show with delay
        showTimer = new Timer { Interval = 500 };
        showTimer.Tick += (s, e) =>
        {
            showTimer.Stop();
            tooltipForm.ShowPopup(targetControl, PopupPosition.AboveCenter);
        };
        showTimer.Start();

        // Auto-hide after 5 seconds
        hideTimer = new Timer { Interval = 5000 };
        hideTimer.Tick += (s, e) =>
        {
            hideTimer.Stop();
            HideTooltip();
        };
        hideTimer.Start();
    }

    public void HideTooltip()
    {
        showTimer?.Stop();
        hideTimer?.Stop();
        tooltipForm?.Close();
        tooltipForm = null;
    }
}

// Usage example
private TooltipPopup tooltipManager = new TooltipPopup();

private void Button_MouseEnter(object sender, EventArgs e)
{
    var button = sender as Button;
    tooltipManager.ShowTooltip(button, 
        "This button performs the save operation", 
        "Save Button");
}

private void Button_MouseLeave(object sender, EventArgs e)
{
    tooltipManager.HideTooltip();
}

Theming

BeepPopupForm provides comprehensive theming support with automatic application of theme colors and styling:

var popup = new BeepPopupForm
{
    Theme = "DarkTheme",
    UseThemeColors = true
};

// Theme automatically applies:
// - BackColor: Popup background
// - ForeColor: Text colors
// - BorderColor: Border styling
// - ShadowColor: Drop shadow effects

// Apply theme manually if needed
popup.ApplyTheme();

Popup-Specific Theming

• Background colors - Adaptive background based on theme
• Border styling - Theme-aware borders and shadows
• Content theming - Automatic theming of hosted controls
• Animation effects - Smooth transitions with theme colors

Best Practices

🎯 User Experience

• Keep content concise: Popups should contain focused, relevant information
• Provide clear actions: Include obvious ways to close or interact
• Consider timing: Use appropriate auto-close delays for notifications
• Position contextually: Show popups near the triggering control

🔧 Implementation

• Memory management: Properly dispose of popup forms when done
• Event handling: Clean up event handlers to prevent memory leaks
• Modal usage: Use modal popups sparingly for important decisions
• Animation performance: Keep animations smooth and lightweight

📱 Responsive Design

• Screen boundaries: Ensure popups stay within screen bounds
• Multiple monitors: Handle multi-monitor scenarios properly
• Adaptive sizing: Adjust popup size based on content and screen