[C#] Hướng dẫn tạo Overlay Modal Dialog Winform

Xin chào các bạn, bài viết hôm nay mình sẽ hướng dẫn các bạn cách overlay background, khi show dialog winform c# giống Modal trên Website.

Thường các bạn thấy các hộp thoại Modal trên website, khi show dialoag thì sẽ có một background overlay màu đen bao quanh Dialog.

Dưới đây là giao diện Overlay Modal Dialog khi show winform

Bươc 1: Các bạn tạo một class MaskedDialog.cs với source code C# bên dưới

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows.Forms;

namespace Modal_Dialog
{
    class MaskedDialog : Form
    {
        static MaskedDialog mask;
        static Form frmContainer;

        private Form dialog;
        private UserControl ucDialog;

        private MaskedDialog(Form parent, Form dialog)
        {
            this.dialog = dialog;
            this.FormBorderStyle = FormBorderStyle.None;
            this.BackColor = System.Drawing.Color.Black;
            this.Opacity = 0.50;
            this.ShowInTaskbar = false;
            this.StartPosition = FormStartPosition.Manual;
            this.Size = parent.ClientSize;
            this.Location = parent.PointToScreen(System.Drawing.Point.Empty);
            parent.Move += AdjustPosition;
            parent.SizeChanged += AdjustPosition;
        }

        private MaskedDialog(Form parent, UserControl ucDialog)
        {
            this.ucDialog = ucDialog;
            this.FormBorderStyle = FormBorderStyle.None;
            this.BackColor = System.Drawing.Color.Black;
            this.Opacity = 0.50;
            this.ShowInTaskbar = false;
            this.StartPosition = FormStartPosition.Manual;
            this.Size = parent.ClientSize;
            this.Location = parent.PointToScreen(System.Drawing.Point.Empty);
            parent.Move += AdjustPosition;
            parent.SizeChanged += AdjustPosition;
        }

        private void AdjustPosition(object sender, EventArgs e)
        {
            Form parent = sender as Form;
            this.Location = parent.PointToScreen(System.Drawing.Point.Empty);
            this.ClientSize = parent.ClientSize;
        }

        //
        public static DialogResult ShowDialog(Form parent, Form dialog)
        {
            mask = new MaskedDialog(parent, dialog);
            dialog.StartPosition = FormStartPosition.CenterParent;
            mask.MdiParent = parent.MdiParent;
            mask.Show();
            DialogResult result = dialog.ShowDialog(mask);
            mask.Close();
            return result;
        }

        public static DialogResult ShowDialog(Form parent, UserControl dialog)
        {
            mask = new MaskedDialog(parent, dialog);
            frmContainer = new Form();
            frmContainer.ShowInTaskbar = false;
            frmContainer.FormBorderStyle = System.Windows.Forms.FormBorderStyle.None;
            frmContainer.StartPosition = FormStartPosition.CenterScreen;
            frmContainer.Height = dialog.Height;
            frmContainer.Width = dialog.Width;

            frmContainer.Controls.Add(dialog);
            mask.MdiParent = parent.MdiParent;
            mask.Show();
            DialogResult result = frmContainer.ShowDialog(mask);
            frmContainer.Close();
            mask.Close();
            return result;
        }

        public static void CloseDialog()
        {
            if (frmContainer != null)
            {
                frmContainer.Close();
            }
        }

        private void InitializeComponent()
        {
            this.SuspendLayout();
            // 
            // MaskedDialog
            // 
            this.ClientSize = new System.Drawing.Size(783, 490);
            this.Name = "MaskedDialog";
            this.FormClosing += new System.Windows.Forms.FormClosingEventHandler(this.MaskedDialog_FormClosing);
            this.Load += new System.EventHandler(this.MaskedDialog_Load);
            this.ResumeLayout(false);

        }

        private void MaskedDialog_Load(object sender, EventArgs e)
        {
        }

        private void MaskedDialog_FormClosing(object sender, FormClosingEventArgs e)
        {
        }

        private void button1_Click(object sender, EventArgs e)
        {

        }
    }
}

Bước 2: Viết sự kiện cho nút show Form

 private void button1_Click(object sender, EventArgs e)
{
    var f2 = new Form2();
    MaskedDialog.ShowDialog(this, f2);
    f2.Dispose();
    f2 = null;
}

HAPPY CODING 

SOURCE CODE