基于C#設(shè)計一個帶導(dǎo)航菜單的主界面
在C#中,可以使用Windows Forms或WPF來設(shè)計帶有導(dǎo)航菜單的主界面。
一、關(guān)于導(dǎo)航菜單
導(dǎo)航菜單是一種用戶界面元素,用于幫助用戶在應(yīng)用程序的不同部分之間進行導(dǎo)航。它通常包含一個或多個菜單項,每個菜單項都表示一個特定的功能或操作。當(dāng)用戶單擊某個菜單項時,應(yīng)用程序會執(zhí)行相應(yīng)的操作或顯示與該操作相關(guān)的子菜單。
導(dǎo)航菜單可以出現(xiàn)在應(yīng)用程序的頂部、底部或側(cè)邊,具體取決于應(yīng)用程序的設(shè)計和平臺。例如,在Web應(yīng)用程序中,導(dǎo)航菜單通常出現(xiàn)在頁面的頂部或側(cè)邊,而在移動應(yīng)用程序中,導(dǎo)航菜單可能出現(xiàn)在屏幕的底部或頂部。
導(dǎo)航菜單的主要目的是提供一個直觀且一致的方式來訪問應(yīng)用程序的主要功能和特性。它可以幫助用戶快速找到他們需要的信息或完成特定的任務(wù),從而提高應(yīng)用程序的可用性和用戶體驗。
二、設(shè)計一個帶導(dǎo)航菜單的主界面
在窗體中添加一個MenuStrip控件,用來設(shè)計菜單欄;添加一個SplitContainer控件,用來將窗體分為兩部分;添加一個ListView控件和3個Button控件,并將它們加入SqlitContainer1的左側(cè)部分,用來制作窗體左側(cè)的導(dǎo)航欄;添加一個ImageList組件,用來為ListView列表項提供圖標(biāo)。
1.Resources.Designer.cs設(shè)計
在圖片資源管理器中設(shè)計項目需要的背景圖片和ImageList組件的圖片。
如何加載圖片資源詳見本文作者寫的其他文章:C#手動改變自制窗體的大小
// Resources.Designer.cs //------------------------------------------------------------------------------ // <auto-generated> // 此代碼由工具生成。 // 運行時版本:4.0.30319.42000 // // 對此文件的更改可能會導(dǎo)致不正確的行為,并且如果 // 重新生成代碼,這些更改將會丟失。 // </auto-generated> //------------------------------------------------------------------------------ namespace _176.Properties { using System; /// <summary> /// 一個強類型的資源類,用于查找本地化的字符串等。 /// </summary> // 此類是由 StronglyTypedResourceBuilder // 類通過類似于 ResGen 或 Visual Studio 的工具自動生成的。 // 若要添加或移除成員,請編輯 .ResX 文件,然后重新運行 ResGen // (以 /str 作為命令選項),或重新生成 VS 項目。 [global::System.CodeDom.Compiler.GeneratedCodeAttribute("System.Resources.Tools.StronglyTypedResourceBuilder", "17.0.0.0")] [global::System.Diagnostics.DebuggerNonUserCodeAttribute()] [global::System.Runtime.CompilerServices.CompilerGeneratedAttribute()] internal class Resources { private static global::System.Resources.ResourceManager resourceMan; private static global::System.Globalization.CultureInfo resourceCulture; [global::System.Diagnostics.CodeAnalysis.SuppressMessageAttribute("Microsoft.Performance", "CA1811:AvoidUncalledPrivateCode")] internal Resources() { } /// <summary> /// 返回此類使用的緩存的 ResourceManager 實例。 /// </summary> [global::System.ComponentModel.EditorBrowsableAttribute(global::System.ComponentModel.EditorBrowsableState.Advanced)] internal static global::System.Resources.ResourceManager ResourceManager { get { if (object.ReferenceEquals(resourceMan, null)) { global::System.Resources.ResourceManager temp = new global::System.Resources.ResourceManager("_176.Properties.Resources", typeof(Resources).Assembly); resourceMan = temp; } return resourceMan; } } /// <summary> /// 重寫當(dāng)前線程的 CurrentUICulture 屬性,對 /// 使用此強類型資源類的所有資源查找執(zhí)行重寫。 /// </summary> [global::System.ComponentModel.EditorBrowsableAttribute(global::System.ComponentModel.EditorBrowsableState.Advanced)] internal static global::System.Globalization.CultureInfo Culture { get { return resourceCulture; } set { resourceCulture = value; } } /// <summary> /// 查找 System.Drawing.Bitmap 類型的本地化資源。 /// </summary> internal static System.Drawing.Bitmap _1 { get { object obj = ResourceManager.GetObject("_1", resourceCulture); return ((System.Drawing.Bitmap)(obj)); } } /// <summary> /// 查找 System.Drawing.Bitmap 類型的本地化資源。 /// </summary> internal static System.Drawing.Bitmap _2 { get { object obj = ResourceManager.GetObject("_2", resourceCulture); return ((System.Drawing.Bitmap)(obj)); } } /// <summary> /// 查找 System.Drawing.Bitmap 類型的本地化資源。 /// </summary> internal static System.Drawing.Bitmap _3 { get { object obj = ResourceManager.GetObject("_3", resourceCulture); return ((System.Drawing.Bitmap)(obj)); } } /// <summary> /// 查找 System.Drawing.Bitmap 類型的本地化資源。 /// </summary> internal static System.Drawing.Bitmap _4 { get { object obj = ResourceManager.GetObject("_4", resourceCulture); return ((System.Drawing.Bitmap)(obj)); } } /// <summary> /// 查找 System.Drawing.Bitmap 類型的本地化資源。 /// </summary> internal static System.Drawing.Bitmap _5 { get { object obj = ResourceManager.GetObject("_5", resourceCulture); return ((System.Drawing.Bitmap)(obj)); } } /// <summary> /// 查找 System.Drawing.Bitmap 類型的本地化資源。 /// </summary> internal static System.Drawing.Bitmap _6 { get { object obj = ResourceManager.GetObject("_6", resourceCulture); return ((System.Drawing.Bitmap)(obj)); } } /// <summary> /// 查找 System.Drawing.Bitmap 類型的本地化資源。 /// </summary> internal static System.Drawing.Bitmap _7 { get { object obj = ResourceManager.GetObject("_7", resourceCulture); return ((System.Drawing.Bitmap)(obj)); } } /// <summary> /// 查找 System.Drawing.Bitmap 類型的本地化資源。 /// </summary> internal static System.Drawing.Bitmap _8 { get { object obj = ResourceManager.GetObject("_8", resourceCulture); return ((System.Drawing.Bitmap)(obj)); } } /// <summary> /// 查找 System.Drawing.Bitmap 類型的本地化資源。 /// </summary> internal static System.Drawing.Bitmap _9 { get { object obj = ResourceManager.GetObject("_9", resourceCulture); return ((System.Drawing.Bitmap)(obj)); } } /// <summary> /// 查找 System.Drawing.Bitmap 類型的本地化資源。 /// </summary> internal static System.Drawing.Bitmap C_編程詞典 { get { object obj = ResourceManager.GetObject("C_編程詞典", resourceCulture); return ((System.Drawing.Bitmap)(obj)); } } internal static Bitmap GetObject(string v) { return v switch { "C_編程詞典" => C_編程詞典, "_9" => _9, "_8" => _8, "_7" => _7, "_6" => _6, "_5" => _5, "_4" => _4, "_3" => _3, "_2" => _2, "_1" => _1, _ => null }; } } }
2.主要的設(shè)計步驟
(1)窗體靜態(tài)設(shè)計
設(shè)計一個窗體;
在窗體中設(shè)計一個menustrip1控件,默認的控件位于Form1的頂部,重要的設(shè)置menustrip1控件的Dock屬性設(shè)置為Top;最后設(shè)計3個MenuItem子控件:設(shè)置、打開、編輯;
在窗體剩余空間中添加一個 splitContainer控件,之所以說剩余空間,就是要保證menustrip1控件不被 splitContainer控件包含,這哈斯有menustrip1的Dock屬性保證的;
設(shè)計圖片資源管理器,并給右側(cè)的splitContainer2添加背景圖片,Stretch布局;
在左側(cè)的splitContainer2控件里,添加3個button控件,并命名為:設(shè)置、打開、編輯;設(shè)置控件的Dock屬性為Top,設(shè)置編輯控件的Dock屬性為Top,最后,設(shè)置打開按鈕的Dock屬性為Top;結(jié)果是,設(shè)置按鈕位于splitContainer2控件頂部,編輯按鈕位于splitContainer2控件底部,打開按鈕位于編輯按鈕的頂部;這樣的設(shè)置很重要;
在左側(cè)的splitContainer2控件里設(shè)置按鈕和打開按鈕之間添加 listView1控件,其Dock屬性設(shè)置為Fill,這很重要;
添加imageList1控件,并為其添加圖片集;
設(shè)置 listView1控件的屬性,右上角的尖角,選擇大圖標(biāo)、imageList1、imageList1;
創(chuàng)建窗體、按鈕1~3的Click事件;
// Form1.Designer.cs namespace _176 { partial class Form1 { /// <summary> /// Required designer variable. /// </summary> private System.ComponentModel.IContainer components = null; /// <summary> /// Clean up any resources being used. /// </summary> /// <param name="disposing">true if managed resources should be disposed; otherwise, false.</param> protected override void Dispose(bool disposing) { if (disposing && (components != null)) { components.Dispose(); } base.Dispose(disposing); } #region Windows Form Designer generated code /// <summary> /// Required method for Designer support - do not modify /// the contents of this method with the code editor. /// </summary> private void InitializeComponent() { components = new System.ComponentModel.Container(); System.ComponentModel.ComponentResourceManager resources = new System.ComponentModel.ComponentResourceManager(typeof(Form1)); imageList1 = new ImageList(components); menuStrip1 = new MenuStrip(); toolStripMenuItem1 = new ToolStripMenuItem(); toolStripMenuItem2 = new ToolStripMenuItem(); toolStripMenuItem3 = new ToolStripMenuItem(); splitContainer1 = new SplitContainer(); listView1 = new ListView(); button3 = new Button(); button2 = new Button(); button1 = new Button(); menuStrip1.SuspendLayout(); ((System.ComponentModel.ISupportInitialize)splitContainer1).BeginInit(); splitContainer1.Panel1.SuspendLayout(); splitContainer1.SuspendLayout(); SuspendLayout(); // // imageList1 // imageList1.ColorDepth = ColorDepth.Depth32Bit; imageList1.ImageStream = (ImageListStreamer)resources.GetObject("imageList1.ImageStream"); imageList1.TransparentColor = Color.Transparent; imageList1.Images.SetKeyName(0, "1.png"); imageList1.Images.SetKeyName(1, "2.jpg"); imageList1.Images.SetKeyName(2, "3.png"); imageList1.Images.SetKeyName(3, "4.png"); imageList1.Images.SetKeyName(4, "5.png"); imageList1.Images.SetKeyName(5, "6.png"); imageList1.Images.SetKeyName(6, "7.png"); imageList1.Images.SetKeyName(7, "8.png"); imageList1.Images.SetKeyName(8, "9.png"); // // menuStrip1 // menuStrip1.Items.AddRange(new ToolStripItem[] { toolStripMenuItem1, toolStripMenuItem2, toolStripMenuItem3 }); menuStrip1.Location = new Point(0, 0); menuStrip1.Name = "menuStrip1"; menuStrip1.Size = new Size(434, 25); menuStrip1.TabIndex = 0; menuStrip1.Text = "menuStrip1"; // // toolStripMenuItem1 // toolStripMenuItem1.Name = "toolStripMenuItem1"; toolStripMenuItem1.Size = new Size(44, 21); toolStripMenuItem1.Text = "設(shè)置"; // // toolStripMenuItem2 // toolStripMenuItem2.Name = "toolStripMenuItem2"; toolStripMenuItem2.Size = new Size(44, 21); toolStripMenuItem2.Text = "打開"; // // toolStripMenuItem3 // toolStripMenuItem3.Name = "toolStripMenuItem3"; toolStripMenuItem3.Size = new Size(44, 21); toolStripMenuItem3.Text = "編輯"; // // splitContainer1 // splitContainer1.Dock = DockStyle.Fill; splitContainer1.Location = new Point(0, 25); splitContainer1.Name = "splitContainer1"; // // splitContainer1.Panel1 // splitContainer1.Panel1.Controls.Add(listView1); splitContainer1.Panel1.Controls.Add(button3); splitContainer1.Panel1.Controls.Add(button2); splitContainer1.Panel1.Controls.Add(button1); // // splitContainer1.Panel2 // splitContainer1.Panel2.BackgroundImage = Properties.Resources.C_編程詞典; splitContainer1.Panel2.BackgroundImageLayout = ImageLayout.Stretch; splitContainer1.Size = new Size(434, 276); splitContainer1.SplitterDistance = 144; splitContainer1.TabIndex = 1; // // listView1 // listView1.Dock = DockStyle.Fill; listView1.LargeImageList = imageList1; listView1.Location = new Point(0, 23); listView1.Name = "listView1"; listView1.Size = new Size(144, 207); listView1.SmallImageList = imageList1; listView1.TabIndex = 3; listView1.UseCompatibleStateImageBehavior = false; // // button3 // button3.Dock = DockStyle.Bottom; button3.Location = new Point(0, 230); button3.Name = "button3"; button3.Size = new Size(144, 23); button3.TabIndex = 2; button3.Text = "編輯"; button3.UseVisualStyleBackColor = true; button3.Click += Button3_Click; // // button2 // button2.Dock = DockStyle.Bottom; button2.Location = new Point(0, 253); button2.Name = "button2"; button2.Size = new Size(144, 23); button2.TabIndex = 1; button2.Text = "打開"; button2.UseVisualStyleBackColor = true; button2.Click += Button2_Click; // // button1 // button1.Dock = DockStyle.Top; button1.Location = new Point(0, 0); button1.Name = "button1"; button1.Size = new Size(144, 23); button1.TabIndex = 0; button1.Text = "設(shè)置"; button1.UseVisualStyleBackColor = true; button1.Click += Button1_Click; // // Form1 // AutoScaleDimensions = new SizeF(7F, 17F); AutoScaleMode = AutoScaleMode.Font; ClientSize = new Size(434, 301); Controls.Add(splitContainer1); Controls.Add(menuStrip1); MainMenuStrip = menuStrip1; Name = "Form1"; StartPosition = FormStartPosition.CenterScreen; Text = "帶導(dǎo)航菜單的窗體"; Load += Form1_Load; menuStrip1.ResumeLayout(false); menuStrip1.PerformLayout(); splitContainer1.Panel1.ResumeLayout(false); ((System.ComponentModel.ISupportInitialize)splitContainer1).EndInit(); splitContainer1.ResumeLayout(false); ResumeLayout(false); PerformLayout(); } #endregion private ImageList imageList1; private MenuStrip menuStrip1; private ToolStripMenuItem toolStripMenuItem1; private ToolStripMenuItem toolStripMenuItem2; private ToolStripMenuItem toolStripMenuItem3; private SplitContainer splitContainer1; private ListView listView1; private Button button3; private Button button2; private Button button1; } }
(2)事件的動作設(shè)計
// Form1.cs namespace _176 { public partial class Form1 : Form { public Form1() { InitializeComponent(); } /// <summary> /// 默認設(shè)置 /// </summary> private void Form1_Load(object sender, EventArgs e) { listView1.Clear(); listView1.LargeImageList = imageList1; //設(shè)置當(dāng)前項以大圖標(biāo)的形式顯示時用到的圖像 listView1.Items.Add("設(shè)置上下班時間", "設(shè)置上下班時間", 0); //向listView1中添加項“設(shè)置上下班時間” listView1.Items.Add("是否啟用短信提醒", "是否啟用短信提醒", 1);//向listView1中添加項“是否啟用短信提醒” listView1.Items.Add("設(shè)置密碼", "設(shè)置密碼", 2); //向listView1中添加項“設(shè)置密碼” } /// <summary> /// 設(shè)置 /// </summary> private void Button1_Click(object sender, EventArgs e) { listView1.Dock = DockStyle.None; //設(shè)置listView1的綁定屬性為未綁定 button1.Dock = DockStyle.Top; //設(shè)置button1的綁定屬性為上端綁定 button2.Dock = DockStyle.Bottom; //設(shè)置button2的綁定屬性為底端綁定 button3.SendToBack(); //將button3發(fā)送到Z順序的后面 button3.Dock = DockStyle.Bottom; //設(shè)置button3的綁定屬性為底端綁定 listView1.BringToFront(); //將listView1帶到Z順序的前面 listView1.Dock = DockStyle.Bottom; //設(shè)置listView1的綁定屬性為底端綁定 listView1.Clear(); listView1.Items.Add("設(shè)置上下班時間", "設(shè)置上下班時間", 0); listView1.Items.Add("是否啟用短信提醒", "是否啟用短信提醒", 1); listView1.Items.Add("設(shè)置密碼", "設(shè)置密碼", 2); } /// <summary> /// 打開 /// </summary> private void Button2_Click(object sender, EventArgs e) { listView1.Dock = DockStyle.None; //設(shè)置listView1的綁定屬性為未綁定 button2.Dock = DockStyle.Top; //設(shè)置button2的綁定屬性為上端綁定 button1.SendToBack(); //將控件button1發(fā)送到Z順序的后面 button1.Dock = DockStyle.Top; //設(shè)置button1的綁定屬性為上端綁定 button3.Dock = DockStyle.Bottom; //設(shè)置button3的綁定屬性為底端綁定 listView1.Dock = DockStyle.Bottom;//設(shè)置listView1的綁定屬性為底端綁定 listView1.Clear(); listView1.Items.Add("近期工作記錄", "近期工作記錄", 3); listView1.Items.Add("近期工作計劃", "近期工作計劃", 4); } /// <summary> /// 編輯 /// </summary> private void Button3_Click(object sender, EventArgs e) { listView1.Dock = DockStyle.None; //設(shè)置listView1的綁定屬性為未綁定 button3.SendToBack(); //將button3發(fā)送到Z順序的后面 button3.Dock = DockStyle.Top; //設(shè)置button3的綁定屬性為上端綁定 button2.SendToBack(); //將button2發(fā)送到Z順序的后面 button2.Dock = DockStyle.Top; //設(shè)置button2的綁定屬性為上端綁定 button1.SendToBack(); //將button1發(fā)送到Z順序的后面 button1.Dock = DockStyle.Top; //設(shè)置button1的綁定屬性為上端綁定 listView1.Dock = DockStyle.Bottom; //設(shè)置listView1的綁定屬性為底端綁定 listView1.Clear(); listView1.Items.Add("編輯工作進度報告", "編輯工作進度報告", 5); listView1.Items.Add("編輯項目設(shè)計圖", "編輯項目設(shè)計圖", 6); } } }
3.涉及到的主要知識點
(1)Control.SendToBack 方法
將控件發(fā)送到 Z 順序的后面。
public void SendToBack ();
控件移動到 z 順序的后面。 如果控件是另一個控件的子控件,則子控件將移動到 z 順序的后面。 如果控件是頂級控件,則除非控件處于活動狀態(tài),否則此方法將無法正常工作。 頂級控件是一個控件,如 Form,它不是另一個控件的子控件。 活動控件是具有輸入焦點的可見控件。 若要將 SendToBack 方法與非活動頂級控件一起使用,請先對 控件調(diào)用 BringToFront 方法。
(2)Control.BringToFront 方法
將控件帶到 Z 順序的前面。
public void BringToFront ();
控件將移動到 z 順序的前面。 如果控件是另一個控件的子控件,則子控件將移動到 z 順序的前面。 BringToFront 不會使控件成為頂級控件,也不會引發(fā) Paint 事件。
(3)Control.UpdateZOrder 方法
按其父級的 z 順序更新控件。
protected void UpdateZOrder ();
UpdateZOrder 方法更新控件在其父控件的 z 順序中的位置。例如,如果此控件是添加到 Control.ControlCollection 中的新創(chuàng)建的控件,則 z 順序?qū)⒏聻樘砑拥胶竺娴男驴丶?/p>
(4) ListView控件的Items.Add方法
ListView控件的Items屬性用來獲取包含控件中所有項的集合,其Add方法用來將項添加到ListView列表中。
public virtual ListViewltem Add(string key,string text,int imagelndex)
參 數(shù) | 說 明 | 參 數(shù) | 說 明 |
---|---|---|---|
key | 項的名稱 | imageIndex | 要為該項顯示的圖像的索引 |
text | 項的文本 | 返回值 | 添加到集合中的ListViewItem |
5) Z-Order
C# 中的 Z-Order 是一種確定窗口或控件在屏幕上的堆疊順序的方式。它由窗口或控件在坐標(biāo)系中的 Z 值決定。具有更高 Z 值的窗口或控件位于具有較低 Z 值的窗口或控件之上。
在 C# 中,您可以使用 SendToBack 方法將指定控件發(fā)送到 Z-Order 的末尾,這意味著它將位于所有其他控件之后。這在您想要創(chuàng)建一個透明窗口或控件,并且需要將其放在其他所有控件之后的情況下非常有用。
到此這篇關(guān)于基于C#設(shè)計一個帶導(dǎo)航菜單的主界面的文章就介紹到這了,更多相關(guān)C#帶導(dǎo)航菜單界面內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
.Net WInform開發(fā)筆記(二)Winform程序運行結(jié)構(gòu)圖及TCP協(xié)議在Winform中的應(yīng)用
中午沒事,把去年剛畢業(yè)那會畫的幾張圖翻出來了,大概介紹Winform應(yīng)用程序運行的過程,以及TCP協(xié)議在Winform中的應(yīng)用。感興趣的朋友可以了解下;如果有Windows消息機制等基礎(chǔ),很好理解這兩張2013-01-01C#實現(xiàn)讀取二維數(shù)組集合并輸出到Word預(yù)設(shè)表格
這篇文章主要為大家詳細介紹了如何使用C#實現(xiàn)讀取二維數(shù)組集合并輸出到Word預(yù)設(shè)表格,文中的示例代碼講解詳細,感興趣的小伙伴可以跟隨小編一起學(xué)習(xí)一下2024-03-03C#判斷頁面中的多個文本框輸入值是否有重復(fù)的實現(xiàn)方法
這篇文章主要介紹了C#判斷頁面中的多個文本框輸入值是否有重復(fù)的實現(xiàn)方法,是一個非常簡單實用的技巧,需要的朋友可以參考下2014-10-10C#使用RestSharp實現(xiàn)封裝常用的http請求方法
這篇文章主要為大家詳細介紹了C#如何使用RestSharp實現(xiàn)封裝常用的http請求方法,文中的示例代碼講解詳細,感興趣的小伙伴可以了解一下2024-02-02