上一篇我们已经绘制了九宫格与方位的显示
这里我们为九宫格的每一个图片都增加Click事件，用于点击查看详细描述
新建窗体FormNineGrid
窗体FormNineGrid设计如图：
一、新建实体类Diagram.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
namespace EightDiagramDemo
{
/// <summary>
/// 每种图的具体描述类
/// </summary>
public class Diagram
{
/// <summary>
/// 关键字:
/// 坤，震，坎，兑，艮，离，巽，乾 中的一个
/// </summary>
public string Key { get; set; }
/// <summary>
/// 图索引。我们按照爻从下往上的顺序，则：坤为0，震为1，坎为2，兑为3，艮为4，离为5，巽为6，乾为7
/// </summary>
public int DiagramIndex { get; set; }
/// <summary>
/// 二进制数格式，固定为3位二进制【十进制范围：0~7】
/// </summary>
public string BinaryNumber
{
get
{
return Convert.ToString(DiagramIndex, 2).PadLeft(3, '0');
}
}
/// <summary>
/// 代表
/// 乾代表天，坤代表地，震代表雷，巽代表风，坎代表水，离代表火，艮代表山，兑代表泽
/// </summary>
public string Represent { get; set; }
/// <summary>
/// 五行
/// </summary>
public string FiveElement { get; set; }
/// <summary>
/// 方向，方位
/// </summary>
public string Direction { get; set; }
/// <summary>
/// 奇门遁甲中的八门
/// </summary>
public string EightDoor { get; set; }
/// <summary>
/// 打印图的所有内容
/// </summary>
/// <returns></returns>
public override string ToString()
{
return $@"【{Key}】:
十进制数:【{DiagramIndex}】
二进制数:【{BinaryNumber}】
代表:{Represent}
五行:{FiveElement}
方位:{Direction}
奇门遁甲中的八门:{EightDoor}"; ;
}
}
}
二、新建操作类DrawDiagramUtil.cs
using System;
using System.Collections.Generic;
using System.Drawing;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows.Forms;
namespace EightDiagramDemo
{
/// <summary>
/// 绘制八卦图操作类
/// </summary>
public class DrawDiagramUtil
{
/// <summary>
/// 绘制某一个八卦图片
/// 八卦的每一个符号都由9个小矩形组成，
/// 实线由三个连续的宽度为40，高度为20的小矩形组成。虚线由两个宽度为40，高度为20的小矩形 与 中间的宽度和高度都为0的小矩形组成
/// </summary>
/// <param name="panel">显示的面板控件：面板宽度为200，高度为200</param>
/// <param name="diagramChar">八卦中文描述</param>
/// <param name="diagramIndex">坤为0，震为1，坎为2，兑为3，艮为4，离为5，巽为6，乾为7</param>
/// <param name="color">颜色，【乾坎艮】为绿色，【巽离】为黄色，【坤震兑】为红色</param>
public static void GenerateEightDiagramSymbol(Panel panel, string diagramChar, int diagramIndex, Color color)
{
panel.BackgroundImage = null;//清除背景
//面板宽度为200，高度为200
Bitmap bitmap = new Bitmap(panel.Width, panel.Height);
Graphics graphics = Graphics.FromImage(bitmap);
//爻是按照从下往上的顺序：坤为0，震为1，坎为2，兑为3，艮为4，离为5，巽为6，乾为7.
//阳爻：实线，由三个连续的宽度为40，高度为20的小矩形组成
//阴爻：虚线，由两个宽度为40，高度为20的小矩形 与 中间的宽度和高度都为0的小矩形组成
//因此 八卦的每一个符号都由9个小矩形组成
int lineWidth1 = 0;
int lineHeight1 = 0;
int lineWidth2 = 0;
int lineHeight2 = 0;
int lineWidth3 = 0;
int lineHeight3 = 0;
if (diagramIndex == 1)
{
lineWidth1 = 40;
lineHeight1 = 20;
}
else if (diagramIndex == 2)
{
lineWidth2 = 40;
lineHeight2 = 20;
}
else if (diagramIndex == 3)
{
lineWidth1 = 40;
lineHeight1 = 20;
lineWidth2 = 40;
lineHeight2 = 20;
}
else if (diagramIndex == 4)
{
lineWidth3 = 40;
lineHeight3 = 20;
}
else if (diagramIndex == 5)
{
lineWidth1 = 40;
lineHeight1 = 20;
lineWidth3 = 40;
lineHeight3 = 20;
}
else if (diagramIndex == 6)
{
lineWidth2 = 40;
lineHeight2 = 20;
lineWidth3 = 40;
lineHeight3 = 20;
}
else if (diagramIndex == 7)
{
lineWidth1 = 40;
lineHeight1 = 20;
lineWidth2 = 40;
lineHeight2 = 20;
lineWidth3 = 40;
lineHeight3 = 20;
}
Rectangle[] rects = new Rectangle[9]
{
new Rectangle(40, 40, 40, 20), new Rectangle(80, 40, lineWidth3, lineHeight3), new Rectangle(120, 40, 40, 20),
new Rectangle(40, 80, 40, 20), new Rectangle(80, 80, lineWidth2, lineHeight2), new Rectangle(120, 80, 40, 20),
new Rectangle(40, 120, 40, 20), new Rectangle(80, 120, lineWidth1, lineHeight1), new Rectangle(120, 120, 40, 20),
};
//奇门遁甲八门中：
//开门，休门，生门是吉祥的；绿色标识
//杜门和景门可以说是中性的，又是吉祥，有时应凶；黄色标识
//死门，惊门，伤门是三个容易应凶、出凶的门；红色标识
//开门在乾金宫，休门在坎水宫，生门在艮土宫，伤门在震木宫，
//杜门在巽木宫，景门在离火宫，死门在坤土宫，惊门在兑金宫。
graphics.FillRectangles(new SolidBrush(color), rects);
graphics.DrawRectangles(new Pen(color), rects);
SizeF sizeF = graphics.MeasureString(diagramChar, new Font("华文楷体", 25));
graphics.DrawString(diagramChar, new Font("华文楷体", 25), new SolidBrush(Color.Black), 100 - sizeF.Width / 2, 170 - sizeF.Height / 2);
graphics.Dispose();
panel.BackgroundImage = bitmap;
//增加图索引绑定【坤为0，震为1，坎为2，兑为3，艮为4，离为5，巽为6，乾为7】 斯内科 20220516
panel.Tag = diagramIndex;
}
/// <summary>
/// 生成文字：中宫五
/// </summary>
/// <param name="panel"></param>
/// <param name="diagramChar"></param>
public static void GenerateFiveCenter(Panel panel, string diagramChar)
{
panel.BackgroundImage = null;//清除背景
//面板宽度为200，高度为200
Bitmap bitmap = new Bitmap(panel.Width, panel.Height);
Graphics graphics = Graphics.FromImage(bitmap);
SizeF sizeF = graphics.MeasureString(diagramChar, new Font("华文楷体", 40));
graphics.DrawString(diagramChar, new Font("华文楷体", 40, FontStyle.Bold), new SolidBrush(Color.Black), 100 - sizeF.Width / 2, 100 - sizeF.Height / 2);
graphics.Dispose();
panel.BackgroundImage = bitmap;
//增加图索引绑定【坤为0，震为1，坎为2，兑为3，艮为4，离为5，巽为6，乾为7】 斯内科 20220516
panel.Tag = -1;//中宫无图片，按-1处理
}
/// <summary>
/// 根据索引，获取EightDiagram描述
/// </summary>
/// <param name="diagramIndex"></param>
/// <returns></returns>
public static Diagram GetEightDiagramDescription(int diagramIndex)
{
//【坤为0，震为1，坎为2，兑为3，艮为4，离为5，巽为6，乾为7】
switch (diagramIndex)
{
case 0:
return new Diagram()
{
Key = "坤",
DiagramIndex = 0,
Represent = "地",
FiveElement = "土",
Direction = "西南方",
EightDoor = "死门"
};
case 1:
return new Diagram()
{
Key = "震",
DiagramIndex = 1,
Represent = "雷",
FiveElement = "木",
Direction = "东方",
EightDoor = "伤门"
};
case 2:
return new Diagram()
{
Key = "坎",
DiagramIndex = 2,
Represent = "水",
FiveElement = "水",
Direction = "北方",
EightDoor = "休门"
};
case 3:
return new Diagram()
{
Key = "兑",
DiagramIndex = 3,
Represent = "泽",
FiveElement = "金",
Direction = "西方",
EightDoor = "惊门"
};
case 4:
return new Diagram()
{
Key = "艮",
DiagramIndex = 4,
Represent = "山",
FiveElement = "土",
Direction = "东北方",
EightDoor = "生门"
};
case 5:
return new Diagram()
{
Key = "离",
DiagramIndex = 5,
Represent = "火",
FiveElement = "火",
Direction = "南方",
EightDoor = "景门"
};
case 6:
return new Diagram()
{
Key = "巽",
DiagramIndex = 6,
Represent = "风",
FiveElement = "木",
Direction = "东南方",
EightDoor = "杜门"
};
case 7:
return new Diagram()
{
Key = "乾",
DiagramIndex = 7,
Represent = "天",
FiveElement = "金",
Direction = "西北方",
EightDoor = "开门"
};
default:
return null;
}
}
}
}
三、窗体FormNineGrid的主要代码如下：
（忽略设计器自动生成的代码）
using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows.Forms;
namespace EightDiagramDemo
{
public partial class FormNineGrid : Form
{
public FormNineGrid()
{
InitializeComponent();
//为面板绑定点击事件
rtxtDisplay.Font = new Font("宋体", 16);
rtxtDisplay.ReadOnly = true;
//设置光标和Click事件
SetCursorAndClickForPanel(panel1);
SetCursorAndClickForPanel(panel2);
SetCursorAndClickForPanel(panel3);
SetCursorAndClickForPanel(panel4);
SetCursorAndClickForPanel(panel5);
SetCursorAndClickForPanel(panel6);
SetCursorAndClickForPanel(panel7);
SetCursorAndClickForPanel(panel8);
SetCursorAndClickForPanel(panel9);
}
/// <summary>
/// 为面板设置光标和点击事件
/// </summary>
/// <param name="panel"></param>
private void SetCursorAndClickForPanel(Panel panel)
{
panel.Cursor = Cursors.Hand;
panel.Click += Panel_Click;
}
private void Panel_Click(object sender, EventArgs e)
{
Panel panel = sender as Panel;
if (panel == null)
{
return;
}
rtxtDisplay.Clear();
int diagramIndex = Convert.ToInt32(panel.Tag);
if (diagramIndex == -1)
{
//对中宫五 进行特殊处理
rtxtDisplay.Text = "【中宫】:\n五居中央";
return;
}
//图索引绑定【坤为0，震为1，坎为2，兑为3，艮为4，离为5，巽为6，乾为7】
Diagram diagram = DrawDiagramUtil.GetEightDiagramDescription(diagramIndex);
rtxtDisplay.Text = diagram.ToString();
}
private void FormNineGrid_Load(object sender, EventArgs e)
{
DrawDiagramUtil.GenerateEightDiagramSymbol(panel8, "坎一", 2, Color.Green);
DrawDiagramUtil.GenerateEightDiagramSymbol(panel3, "坤二", 0, Color.Red);
DrawDiagramUtil.GenerateEightDiagramSymbol(panel4, "震三", 1, Color.Red);
DrawDiagramUtil.GenerateEightDiagramSymbol(panel1, "巽四", 6, Color.Yellow);
DrawDiagramUtil.GenerateFiveCenter(panel5, "中宫五");
DrawDiagramUtil.GenerateEightDiagramSymbol(panel9, "乾六", 7, Color.Green);
DrawDiagramUtil.GenerateEightDiagramSymbol(panel6, "兑七", 3, Color.Red);
DrawDiagramUtil.GenerateEightDiagramSymbol(panel7, "艮八", 4, Color.Green);
DrawDiagramUtil.GenerateEightDiagramSymbol(panel2, "离九", 5, Color.Yellow);
}
}
}
四、运行如图：
929
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
