【转】自制一个简单的标签云TagCloud控件（Winform)

jcwx

转自CSDN：


标签云（TagCloud）是一种通过按照热门程度确定字体的大小和颜色来表示内容的信息标签集合，是一套相关的标签以及与此相应的权重。典型的标签云有30至150个标签。权影响使用的字体大小或其他视觉效果。
典型的标签云就像这样

作为非专业人士，在WinForm中实现标签云，需要首先分析它的行为和现象：
1.文字大小由权值决定
2.文字颜色由权值决定
3.文字流式布局
4.文字可点击
现在动手开始做控件。
先检查需要的命名空间

1. using System.Windows.Forms;
   
2. using System.Drawing;

复制代码

然后新建一个类，这是个控件，继承自Control类

1. public class TagCloudControl : System.Windows.Forms.Control
   
2. { }

复制代码

先看第3条：文字流式布局
我在很早之前介绍过一个WinForm控件：FlowLayoutPanel，流式布局面板，以前的帖子还在，只是图片随着CSDN升级早已丢失：点击看帖。
如果使用FlowLayoutPanel，很显然上面的第3条就很容易满足，不需要多费心思了，所以，在控件里加上一个FlowLayoutPanel。

1. public class TagCloudControl : System.Windows.Forms.Control
   
2. {
   
3.     // 流布局面板
   
4.     private FlowLayoutPanel flow = null;
   
5.     // 初始化流布局面板
   
6.     private void InitiateFlow()
   
7.     {
   
8.         flow = new FlowLayoutPanel();
   
9.         flow.AutoScroll = true;
   
10.         flow.BackColor = Color.White;
    
11.         flow.Padding = new System.Windows.Forms.Padding(5);
    
12.         flow.Dock = DockStyle.Fill;
    
13.         flow.WrapContents = true;
    
14.         this.Controls.Add(flow);
    
15.     }
    
16.     // 标签云的构造函数flow.Padding = new System.Windows.Forms.Padding(5);
    
17.      public TagCloudControl()
    
18.     {
    
19.         InitiateFlow();
    
20.     }
    
21. }

复制代码

接下来，对于第1、2条，这个权值，应该是对应着字体大小和颜色的。如果可能，用一个类似字典的查询表存储权值及其对应的颜色（调色板）。但为了简单起见，我把这项工作丢给各位使用者，由你们来决定字体大小和颜色。注意最后的EventHandler参数，通过这个委托，使得可以直接指定标签的点击事件处理程序，这样就可以使每个标签都是可点击的了。

1. public void Add(string tag, float size, Color color, EventHandler action)
   
2. {
   
3.     if (string.IsNullOrEmpty(tag) == true) return;
   
4.     if (size < 6) size = 6;
   
5.     // 用普通标签表示一个tag
   
6.     Label label = new Label();
   
7.     label.AutoSize = true;
   
8.     label.Cursor = Cursors.Hand;
   
9.     label.ForeColor = color;
   
10.     label.Text = tag;
    
11.     label.Font = new System.Drawing.Font(label.Font.FontFamily, size);
    
12.     if(action != null) label.Click += action;
    
13.     flow.Controls.Add(label);
    
14. }

复制代码

现在，这个标签云就有了最最最最最基本的功能了：添加并显示。
下面来试试这个做出来的标签云怎么样。
随便找个窗口类，比如Form1，然后在里面添加这些代码：
标签内容就暂时用这些：

1. string[] tags = { "天才", "大傻逼", "平凡的人", "男神", "女神", "女屌丝", "笨蛋", "学生狗" };

复制代码

然后颜色用这几种：

1. Color[] colors = {
   
2.                         Color.OrangeRed,
   
3.                         Color.DeepSkyBlue,
   
4.                         Color.LawnGreen,
   
5.                         Color.Violet,
   
6.                         Color.MediumSlateBlue
   
7.                     };

复制代码

现在，就可以随机添加点标签进去了。在Form1的构造函数中这样写：

1. public Form1()
   
2. {
   
3.     InitializeComponent();
   
4.     Random rand = new Random();
   
5.     for (int i = 0; i < 30; i++)
   
6.     {
   
7.         string tag = tags[rand.Next(0, tags.Length - 1)];
   
8.         Color color = colors[rand.Next(0, colors.Length - 1)];
   
9.         tagCloud1.Add(
   
10.             tag,
    
11.             (float)rand.Next(10, 30),
    
12.             color,
    
13.             delegate(object sender, EventArgs e) { MessageBox.Show("我是一个" + tag); }
    
14.             );
    
15.     }
    
16. }

复制代码

运行这个程序，可以看到标签云已经基本成型了


点击某个标签，可以看到每个标签都可以响应各自的事件处理程序。



So，剩下的就是完善了。比如加上删除、查找等功能，添加调色板，完善事件机制等等等等。自己思考吧。

最后是源代码（.NET 2.0，VS2012，其他版本可以直接导入.csproj使用）：点击下载

羽叶

请不要纯粹的复制粘贴，编辑好了再发。
可以先粘贴到记事本里 再从记事本里复制。

jcwx

你真快啊，我刚发完你就看到了
编辑好了

mwylaoma

不错的一个控件，不过可否结合DEV来使用？

hngs

有点启发,谢谢!

l0711

学习啦,谢谢