将徽章添加到C#winforms控件

时间:2015-04-20 18:50:24

标签: c# .net winforms

在CSS中编写时,我可以添加一类“徽章”并获得我想要的内容。一个带有一些样式的按钮或标签附近的小数字,表示此控件具有需要查看的待处理信息。

有人试图在iOS上做我想要的事情here

我想在按钮或标签上的WinForms上执行此操作。如果WPF中有更简单的解决方案,那么我可能会考虑使用它。

这是一张图片,展示了我想要实现的目标:

Buttons and controls with badges

3 个答案:

答案 0 :(得分:4)

这是一种使用静态Adorner类的方法,非常快速而且很脏......

它可以为许多控件添加标签,它包含一个点击操作,动态文本,并具有删除标签的代码。

an adorned button

向按钮添加徽章需要一行:

    public Form1()
    {
        InitializeComponent();
        // adorn one Button with a Badge Label:
        Adorner.AddBadgeTo(button1, "123");
        // if you want to you can add a click action:
        Adorner.SetClickAction(button1, dobidoo);
    }

    // a test action
    void dobidoo(Control ctl)
    {
        Console.WriteLine("You have clicked on :" + ctl.Text);
    }

以下是Adorner课程:

static class Adorner
{
    private static List<Control> controls = new List<Control>();

    static public bool AddBadgeTo(Control ctl, string Text)
    {
        if (controls.Contains(ctl)) return false;

        Badge badge = new Badge();
        badge.AutoSize = true;
        badge.Text = Text;
        badge.BackColor = Color.Transparent;
        controls.Add(ctl);
        ctl.Controls.Add(badge);
        SetPosition(badge, ctl);

        return true;
    }

    static public bool RemoveBadgeFrom(Control ctl)
    {
        Badge badge = GetBadge(ctl);
        if (badge != null)
        {
            ctl.Controls.Remove(badge);
            controls.Remove(ctl);
            return true;
        }
        else return false;
    }

    static public void SetBadgeText(Control ctl, string newText)
    {
        Badge badge = GetBadge(ctl);
        if (badge != null) 
        {
                badge.Text = newText;
                SetPosition(badge, ctl);
        }
    }

    static public string GetBadgeText(Control ctl)
    {
        Badge badge = GetBadge(ctl);
        if (badge != null) return badge.Text;
        return "";
    }

    static private void SetPosition(Badge badge, Control ctl)
    {
       badge.Location = new Point(ctl.Width  - badge.Width - 5, 
                                  ctl.Height - badge.Height - 5);
    }

    static public void SetClickAction(Control ctl, Action<Control> action)
    {
        Badge badge = GetBadge(ctl);
        if (badge != null)  badge.ClickEvent = action;
    }

    static Badge GetBadge(Control ctl)
    {
        for (int c = 0; c < ctl.Controls.Count; c++)
            if (ctl.Controls[c] is Badge) return ctl.Controls[c] as Badge;
        return null;
    }


    class Badge : Label
    {
        Color BackColor = Color.SkyBlue;
        Color ForeColor = Color.White;
        Font font = new Font("Sans Serif", 8f);

        public Action<Control> ClickEvent;

        public Badge()   {}

        protected override void OnPaint(PaintEventArgs e)
        {
            e.Graphics.FillEllipse(new SolidBrush(BackColor), this.ClientRectangle);
            e.Graphics.DrawString(Text, font, new SolidBrush(ForeColor), 3, 1);
        }

        protected override void OnClick(EventArgs e)
        {
            ClickEvent(this);
        }

    }
}

请注意,虽然您可以将其添加到大多数控件中,但并非所有工作都与Button一样。一个TabControl很难装饰,因为它Tabs实际上不是Controls而只是绘制了区域,所以就像添加'关闭X'一样,你必须user draw所有TabPages的徽章..

答案 1 :(得分:3)

实现这一目标的最简单,最好的方法是创建一个新的自定义UserControl。只需添加一个按钮,然后在右侧插入一个标签即可。然后为新getters内的控件添加settersUserControl。以下是get / set配置按钮通知的示例:

public String ButtonNotification {
   get { return yourUserControlLabel.Text; }
   set {
         if (value == null || value == "") { yourUserControlLabel.Visibility = Hidden; }
         else { yourUserControlLabel.Visibility = Visible; }

         yourUserControlLabel.Text = value;
   }
}

然后,您可以使用getter / setter自定义标签的可见性和其他属性。

答案 2 :(得分:0)

使用UserControl执行此操作的方法很简单:

public partial class btnControl : UserControl
    {
        public Label label = new Label();
        public TextBox box = new TextBox();

        public btnControl()
        {
            this.label = new System.Windows.Forms.Label();
            this.box = new System.Windows.Forms.TextBox();
            this.SuspendLayout();
            // 
            // label
            // 
            this.label.AutoSize = true;
            this.label.ForeColor = System.Drawing.Color.White;
            this.label.Location = new System.Drawing.Point(4, 7);
            this.label.Name = "label";
            this.label.Size = new System.Drawing.Size(35, 13);
            this.label.TabIndex = 0;
            this.label.Text = "label";
            // 
            // box
            // 
            this.box.Location = new System.Drawing.Point(110, 3);
            this.box.Name = "box";
            this.box.Size = new System.Drawing.Size(31, 20);
            this.box.TabIndex = 1;
            this.box.Enabled = false;
            // 
            // btnControl
            // 
            this.AutoScaleDimensions = new System.Drawing.SizeF(6F, 13F);
            this.AutoScaleMode = System.Windows.Forms.AutoScaleMode.Font;
            this.BackColor = System.Drawing.Color.Blue;
            this.Controls.Add(this.box);
            this.Controls.Add(this.label);
            this.Name = "btnControl";
            this.Size = new System.Drawing.Size(144, 26);
            this.ResumeLayout(false);
            this.PerformLayout();
        }
    }

然后把它放在你的表格中:

private void Form1_Load(object sender, EventArgs e)
        {
            btnControl Control = new btnControl();
            this.Controls.Add(Control);
            Control.label.Text = "Home";
            Control.box.Text = "42";
        }

给你:

enter image description here