創作內容

19 GP

C# 自訂Panel 樣式

作者:貓貓風 ฅ●ω●ฅ│2018-10-18 13:22:15│巴幣:136│人氣:2052
.



















原始C#的Panel元件大概只能選擇元件的大小跟位置,邊框顏色形狀、粗細無法自行定義

此篇主要是針對 Panel的邊框屬性進行覆寫動作,可以產生自定義的panel

用panel的邊框屬性可以組合成不同幾何圖形

首先先覆寫原本的 panel,自定義PanelEx 繼承 panel

  1. using System;
  2. using System.Collections.Generic;
  3. using System.Linq;
  4. using System.Text;
  5. using System.Windows.Forms;
  6. using System.Drawing;
  7. using System.ComponentModel;
  8. namespace panelModify
  9. {
  10.     /// <summary>
  11.     /// 邊框模式(無、單色、三維)
  12.     /// </summary>
  13.     public enum BorderMode { None, Single, ThreeD }
  14.     /// <summary>
  15.     /// 可設置邊框樣式的Panel
  16.     /// </summary>
  17.     public class PanelEx : Panel
  18.     {
  19.         private Color borderColor;
  20.         private Border3DStyle border3DStyle;
  21.         private ToolStripStatusLabelBorderSides borderSide;
  22.         private otherSide.other_side _os;
  23.         private BorderMode borderMode;
  24.         [DefaultValue(BorderMode.None), Description("邊框模式。可設置單色模式或三維
  25.         模式")]
  26.         public BorderMode BorderMode
  27.         {
  28.             get { return borderMode; }
  29.             set
  30.             {
  31.                 if (borderMode == value) { return; }
  32.                 borderMode = value;
  33.                 this.Invalidate();
  34.             }
  35.         }
  36.         [DefaultValue(typeof(Color), "Black"), Description("邊框顏色。僅當邊框為單色模式
  37.         時有效")]
  38.         public Color BorderColor
  39.         {
  40.             get { return borderColor; }
  41.             set
  42.             {
  43.                 if (borderColor == value) { return; }
  44.                 borderColor = value;
  45.                 this.Invalidate();
  46.             }
  47.         }
  48.         [DefaultValue(Border3DStyle.Etched), Description("邊框三維樣式。僅當邊框為三
  49.         維模式時有效")]
  50.         public Border3DStyle Border3DStyle
  51.         {
  52.             get { return border3DStyle; }
  53.             set
  54.             {
  55.                 if (border3DStyle == value) { return; }
  56.                 border3DStyle = value;
  57.                 this.Invalidate();
  58.             }
  59.         }

  60.         //
  61.         [DefaultValue(ToolStripStatusLabelBorderSides.All), Description("邊框位置。可自
  62.          由啟用各個方位的邊框")]
  63.         public ToolStripStatusLabelBorderSides BorderSide
  64.         {
  65.             get { return borderSide; }
  66.             set
  67.             {
  68.                 if (borderSide == value) { return; }
  69.                 borderSide = value;
  70.                 this.Invalidate();
  71.             }
  72.         }
  73.         public otherSide.other_side os
  74.         {
  75.             get { return _os; }
  76.             set
  77.             {
  78.                 if (_os == value) { return; }
  79.                 _os = value;
  80.                 this.Invalidate();
  81.             }
  82.         }
  83.      private int _BorderSize = 1;
  84.      [Browsable(true), Description("邊框粗細"), Category("自定義分類")]
  85.       public int BorderSize
  86.       {
  87.         get { return _BorderSize; }
  88.         set
  89.         {
  90.           _BorderSize = value;
  91.           this.Invalidate();
  92.         }
  93.       }
  94.         public PanelEx()
  95.         {
  96.             this.borderMode = BorderMode.None;
  97.             this.borderColor = Color.Black;
  98.             this.border3DStyle = System.Windows.Forms.Border3DStyle.Etched;
  99.             this.borderSide = ToolStripStatusLabelBorderSides.All;
  100.         }
  101.         protected override void OnPaint(PaintEventArgs e)
  102.         {
  103.             base.OnPaint(e);
  104.             if (this.BorderStyle != System.Windows.Forms.BorderStyle.None
  105.                 || BorderMode == BorderMode.None
  106.                 || BorderSide == ToolStripStatusLabelBorderSides.None)
  107.             { return; }
  108.             using (Graphics g = e.Graphics)
  109.             {
  110.                 //三維模式
  111.                 if (this.BorderMode == BorderMode.ThreeD)
  112.                 {
  113.                     ControlPaint.DrawBorder3D(g, this.ClientRectangle, this.Border3DStyle,
  114.                      (Border3DSide)BorderSide);
  115.                  //將ToolStripStatusLabelBorderSides轉換為Border3DSide
  116.                 }
  117.                 else //單色模式
  118.                 {
  119.                     using (Pen pen = new Pen(BorderColor, _BorderSize))
  120.                     {
  121.                             //2018.10.18 ovveride
  122.                             if (os == otherSide.other_side.All)
  123.                             {
  124.                                 g.DrawRectangle(pen, 0, 0, this.Width - 1, this.Height - 1);
  125.                             }
  126.                             if (os == otherSide.other_side.top)
  127.                             {
  128.                                 g.DrawLine(pen, 0, 0, this.Width - 1, 0);
  129.                             }
  130.                             if (os == otherSide.other_side.left)
  131.                             {
  132.                                 g.DrawLine(pen, 0, 0, 0, this.Height - 1);
  133.                             }
  134.                             if (os == otherSide.other_side.right)
  135.                             {
  136.                                 g.DrawLine(pen, this.Width - 1, 0, this.Width - 1, this.Height - 1);
  137.                             }
  138.                             if (os == otherSide.other_side.bottom)
  139.                             {
  140.                                 g.DrawLine(pen, 0, this.Height - 1, this.Width - 1, this.Height - 1);
  141.                             }
  142.                             if (os == otherSide.other_side.left_right)
  143.                             {
  144.                                 g.DrawLine(pen, 0, 0, 0, this.Height - 1);
  145.                                 g.DrawLine(pen, this.Width - 1, 0, this.Width - 1, this.Height - 1);
  146.                             }
  147.                             if (os == otherSide.other_side.top_bottom)
  148.                             {
  149.                                 g.DrawLine(pen, 0, 0, this.Width - 1, 0);
  150.                                 g.DrawLine(pen, 0, this.Height - 1, this.Width - 1, this.Height - 1);
  151.                             }
  152.                             if (os == otherSide.other_side.top_right)
  153.                             {
  154.                                 g.DrawLine(pen, 0, 0, this.Width - 1, 0);
  155.                                 g.DrawLine(pen, this.Width - 1, 0, this.Width - 1, this.Height - 1);
  156.                             }
  157.                             if (os == otherSide.other_side.top_left)
  158.                             {
  159.                                 g.DrawLine(pen, 0, 0, this.Width - 1, 0);
  160.                                 g.DrawLine(pen, 0, 0, 0, this.Height - 1);
  161.                             }
  162.                             if (os == otherSide.other_side.top_left_bottom)
  163.                             {
  164.                                 g.DrawLine(pen, 0, 0, this.Width - 1, 0);
  165.                                 g.DrawLine(pen, 0, 0, 0, this.Height - 1);
  166.                                 g.DrawLine(pen, 0, this.Height - 1, this.Width - 1, this.Height - 1);
  167.                             }
  168.                             if (os == otherSide.other_side.top_right_bottom)
  169.                             {
  170.                                 g.DrawLine(pen, 0, 0, this.Width - 1, 0);
  171.                                 g.DrawLine(pen, this.Width - 1, 0, this.Width - 1, this.Height - 1);
  172.                                 g.DrawLine(pen, 0, this.Height - 1, this.Width - 1, this.Height - 1);
  173.                             }
  174.                             if (os == otherSide.other_side.left_top_right)
  175.                             {
  176.                                 g.DrawLine(pen, 0, 0, 0, this.Height - 1);
  177.                                 g.DrawLine(pen, 0, 0, this.Width - 1, 0);
  178.                                 g.DrawLine(pen, this.Width - 1, 0, this.Width - 1, this.Height - 1);
  179.                             }
  180.                             if (os == otherSide.other_side.left_bottom_right)
  181.                             {
  182.                                 g.DrawLine(pen, 0, 0, 0, this.Height - 1);
  183.                                 g.DrawLine(pen, 0, this.Height - 1, this.Width - 1,  this.Height - 1);
  184.                                 g.DrawLine(pen, this.Width - 1, 0, this.Width - 1, this.Height - 1);
  185.                             }
  186.                     }
  187.                 }
  188.             }
  189.         }
  190.     }
  191. }

接著在主程式就可以直接使用剛剛定義好的panel


  1. using System;
  2. using System.Collections.Generic;
  3. using System.ComponentModel;
  4. using System.Data;
  5. using System.Drawing;
  6. using System.Linq;
  7. using System.Text;
  8. using System.Windows.Forms;
  9. namespace panelModify
  10. {
  11.     public partial class Form1 : Form
  12.     {
  13.         public Form1()
  14.         {
  15.             InitializeComponent();
  16.         }
  17.         private void Form1_Load(object sender, EventArgs e)
  18.         {
  19.             //panelEx1.BorderStyle = BorderStyle.FixedSingle;
  20.             //panelEx1.BorderSide = ToolStripStatusLabelBorderSides.Left;
  21.             panelEx1.BorderMode = BorderMode.Single;
  22.             panelEx2.BorderMode = BorderMode.Single;
  23.             panelEx3.BorderMode = BorderMode.Single;
  24.             panelEx4.BorderMode = BorderMode.Single;
  25.             panelEx5.BorderMode = BorderMode.Single;
  26.             panelEx6.BorderMode = BorderMode.Single;
  27.             panelEx7.BorderMode = BorderMode.Single;
  28.             panelEx8.BorderMode = BorderMode.Single;
  29.             panelEx9.BorderMode = BorderMode.Single;
  30.             panelEx10.BorderMode = BorderMode.Single;
  31.             panelEx11.BorderMode = BorderMode.Single;
  32.             panelEx12.BorderMode = BorderMode.Single;
  33.             panelEx13.BorderMode = BorderMode.Single;
  34.             panelEx1.BorderColor = Color.Green;
  35.             panelEx2.BorderColor = Color.Brown;
  36.             panelEx3.BorderColor = Color.Red;
  37.             panelEx4.BorderColor = Color.HotPink;
  38.             panelEx5.BorderColor = Color.IndianRed;
  39.             panelEx6.BorderColor = Color.Plum;
  40.             panelEx7.BorderColor = Color.Purple;
  41.             panelEx8.BorderColor = Color.PowderBlue;
  42.             panelEx9.BorderColor = Color.PaleGreen;
  43.             panelEx10.BorderColor = Color.MediumSeaGreen;
  44.             panelEx11.BorderColor = Color.Navy;
  45.             panelEx12.BorderColor = Color.Orange;
  46.             panelEx13.BorderColor = Color.LightBlue;
  47.             panelEx1.os = otherSide.other_side.All;
  48.             panelEx1.BorderColor = Color.Green;
  49.             panelEx1.BorderColor = Color.Green;
  50.             panelEx2.os = otherSide.other_side.bottom;
  51.             panelEx3.os = otherSide.other_side.left;
  52.             panelEx4.os = otherSide.other_side.right;
  53.             panelEx5.os = otherSide.other_side.top;
  54.             panelEx6.os = otherSide.other_side.left_right;
  55.             panelEx7.os = otherSide.other_side.top_bottom;
  56.             panelEx8.os = otherSide.other_side.top_right;
  57.             panelEx9.os = otherSide.other_side.top_left;
  58.             panelEx10.os = otherSide.other_side.left_bottom_right;
  59.             panelEx11.os = otherSide.other_side.left_top_right;
  60.             panelEx12.os = otherSide.other_side.top_left_bottom;
  61.             panelEx13.os = otherSide.other_side.top_right_bottom;
  62.         }
  63.     }
  64. }


完成後選擇自定義的元件會多出下列屬性可以選擇




以上範例的執行結果如下圖




延伸閱讀


引用網址:https://home.gamer.com.tw/TrackBack.php?sn=4165667
All rights reserved. 版權所有,保留一切權利

相關創作

同標籤作品搜尋:涼涼風|C#

留言共 10 篇留言

小刀
好棒棒![e19]

10-18 13:55

貓貓風 ฅ●ω●ฅ
桑Q ^^10-18 13:59
影晨楓
只有我看不懂嗎XDD

10-18 19:44

貓貓風 ฅ●ω●ฅ
應該也有其他人不懂吧 ><10-18 22:02
芯玥兒
感覺很深奧

10-18 20:05

貓貓風 ฅ●ω●ฅ
稍微 (? 這邊只有牽涉到元件 感覺比較不像在寫程式XD10-18 22:02
Fuwawa
這個是幹嘛ㄉ.

10-18 20:57

貓貓風 ฅ●ω●ฅ
可以拿來繪圖用或是當容器10-18 22:02
小魚
喔喔, 原來元件可以自己定義啊,
我以為WinForm只能照他原本的樣式下去做,
不過能夠做的變化應該也不多吧?
不像WPF那麼自由?

10-19 08:01

貓貓風 ฅ●ω●ฅ
要看他底層開放多少可以給你修改10-19 08:47

拜大神

10-19 13:50

貓貓風 ฅ●ω●ฅ
沒有很厲害啦 [e43]10-19 14:01
南宮佟羽
請問if的地方可以改成switch case的寫法ㄇ?

10-20 17:26

貓貓風 ฅ●ω●ฅ
可以呀10-20 21:49
南宮佟羽
謝謝~希望之後可以和大大一起討論程式相關的問題(我4資工系的菜雞)

10-20 21:54

貓貓風 ฅ●ω●ฅ
好喔OAO10-20 22:40
阿獠
大大請問一下otherSide是什麼? 會顯示找不到類型或命名空間名稱

08-22 23:28

貓貓風 ฅ●ω●ฅ
自己定義的物件名稱08-23 14:24
阿獠
感謝大大的回覆!


08-23 15:16

我要留言提醒:您尚未登入,請先登入再留言

19喜歡★s1234567 可決定是否刪除您的留言,請勿發表違反站規文字。

前一篇:C# 執行緒中更新UI方... 後一篇:東京計裝 流量控制器 控...

追蹤私訊切換新版閱覽

作品資料夾

mine0rain好緊張
明天要考檢定了好緊張看更多我要大聲說昨天18:52


face基於日前微軟官方表示 Internet Explorer 不再支援新的網路標準,可能無法使用新的應用程式來呈現網站內容,在瀏覽器支援度及網站安全性的雙重考量下,為了讓巴友們有更好的使用體驗,巴哈姆特即將於 2019年9月2日 停止支援 Internet Explorer 瀏覽器的頁面呈現和功能。
屆時建議您使用下述瀏覽器來瀏覽巴哈姆特:
。Google Chrome(推薦)
。Mozilla Firefox
。Microsoft Edge(Windows10以上的作業系統版本才可使用)

face我們了解您不想看到廣告的心情⋯ 若您願意支持巴哈姆特永續經營,請將 gamer.com.tw 加入廣告阻擋工具的白名單中,謝謝 !【教學】