1.窗体与界面设计导航菜单界面

对于一些应用工具软件，界面不但要求人性化、漂亮、还要能突出界面功能和使用方便，这样才能吸引用户。

014 OutLook 界面

一般程序的菜单栏和工具栏是不可移动的，但是只要将 MenuStrip 和 ToolStrip 控件的 AllowItem Recorder 属性设为 True 就可以移动了。

注意：在移动菜单栏和工具栏时，需要按住"Alt"键，同时用鼠标进行拖动。

1.创建一个项目，默认窗体为 Form1，向 Form1 窗体中添加 MenuStrip 控件，用来设计主菜单；添加 ToolStrip 控件，用来设计工具栏；添加 StatusStrip 控件，用来设计状态栏；添加 ImageList 控件和 TreeView 控件，用来设计树结构。

2.分别为 MenuStrip 控件、ToolStrip 控件、ImageList 空和 TreeView 控件添加子项，将 MenuStrip 控件和 ToolStrip 控件的 AllowItemRecorder 属性设置为 True，并将 ToolStrip 控件的每个子项的 DisplayStyle 属性设置为"ImageAndText"。

---

015 带导航菜单的主界面

该实例中主要使用 Button 控件和 ListView 控件制作导航菜单界面。在对 ListView 控件添加菜单信息时，必须在前面写入添加语句，例如 ListView.Items.Add，否则添加的菜单信息将替换前一条信息。单击相应的按钮时，应首先对 ListView 控件进行清空，否则在 ListView 控件中将继续上一次的添加菜单信息。

 

1.创建一个项目，默认窗体为 Form1，向 Form1 窗体上添加 MenuStrip 控件设计主菜单；添加 ToolStrip 控件设计工具栏；添加 SplitContainer 控件、ImageList 控件、3个 Button 控件和 ListView 控件用来制作左侧的导航栏。

2.分别为 MenuStrip 控件、ToolStrip 控件添加子项，将3个 Button 控件和 ListView 控件加入 SplitContainer1.panel 的左侧部分中。

namespace _015_Navigation
{
    public partial class Form1 : Form
    {
        public Form1()
        {
            InitializeComponent();
        }

        private void Form1_Load(object sender, EventArgs e)
        {
            listView1.Clear();                      //清空ListView1中的原有内容
            listView1.LargeImageList = imageList1;  //设置当前项以大图标的形式显示时用到的图像
            listView1.Items.Add("设置上下班时间","设置上下班时间",0);
            listView1.Items.Add("是否启用短信提醒", "是否启动短线提醒", 1);
            listView1.Items.Add("设置密码", "设置密码", 2);
        }

        private void button2_Click(object sender, EventArgs e)
        {
            listView1.Dock = DockStyle.None;    //设置LIstView1的绑定属性为未绑定
            button2.Dock = DockStyle.Top;       //设置button2的绑定属性为上端绑定
            button1.SendToBack();               //将控件button1发送到Z顺序的后面
            button1.Dock = DockStyle.Top;       //设置button1的绑定属性为上端绑定
            button3.Dock = DockStyle.Bottom;    //设置button3的绑定属性为底端绑定
            listView1.Dock = DockStyle.Bottom;  //设置LIstView1的绑定属性为底端绑定
            listView1.Clear();                  //清空ListView1中的原有内容
            listView1.Items.Add("近期工作记录", "近期工作记录", 3);
            listView1.Items.Add("近期工作计划", "近期工作计划", 4);
        }

        private void button3_Click(object sender, EventArgs e)
        {
            listView1.Dock = DockStyle.None;    //设置LIstView1的绑定属性为未绑定
            button3.SendToBack();               //将控件button3发送到Z顺序的后面
            button3.Dock = DockStyle.Top;       //设置button3的绑定属性为上端绑定
            button2.SendToBack();               //将控件button2发送到Z顺序的后面
            button2.Dock = DockStyle.Top;       //设置button2的绑定属性为上端绑定
            button1.SendToBack();               //将控件button1发送到Z顺序的后面
            button1.Dock = DockStyle.Top;       //设置button1的绑定属性为上端绑定
            listView1.Dock = DockStyle.Bottom;  //设置LIstView1的绑定属性为底端绑定
            listView1.Clear();                  //清空ListView1中的原有内容
            listView1.Items.Add("编辑工作进度报告", "编辑工作进度报告", 5);
            listView1.Items.Add("编辑项目设计图", "编辑项目设计图", 6);
        }

        private void button1_Click(object sender, EventArgs e)
        {
            listView1.Dock = DockStyle.None;    //设置LIstView1的绑定属性为未绑定
            button1.Dock = DockStyle.Top;       //设置button1的绑定属性为上端绑定
            button2.Dock = DockStyle.Bottom;    //设置button2的绑定属性为底端绑定
            button3.SendToBack();               //将控件button3发送到Z顺序的后面
            button3.Dock = DockStyle.Bottom;    //设置button3的绑定属性为底端绑定
            listView1.BringToFront();           //将listview1带到Z顺序的前面
            listView1.Dock = DockStyle.Bottom;  //设置LIstView1的绑定属性为底端绑定
            listView1.Clear();                  //清空ListView1中的原有内容
            listView1.Items.Add("设置上下班时间", "设置上下班时间", 0);
            listView1.Items.Add("是否启用短信提醒", "是否启用短信提醒", 1);
            listView1.Items.Add("设置密码", "设置密码", 2);
        }
    }
}

---

016 图形化的导航界面

本实例主要通过设置 Button 控件的相应属性，确定其按钮的位置、文字、显示样式和要显示的图片等。 

1.创建一个项目，默认窗体为 Form1，向 Form1 窗体上添加 MenuStrip 控件设计主菜单；添加 ToolStrip 控件设计工具栏；添加 Panel 控件、Button 控件用来设计图形化的导航按钮。

2.分别为 MenuStrip 控件、ToolStrip 控件添加子项，并为 Panel 控件选择背景图片。

3.将 Button 控件的 BackColor 属性设为"Transparent"，FlatStyle 属性设置为"Flat"，TextImageRelation 属性设置为"ImageBeforeText"。

namespace _016_ButtonNavigation
{
    public partial class Form1 : Form
    {
        public Form1()
        {
            InitializeComponent();
        }

        private void button1_Click(object sender, EventArgs e)
        {
            button5.Visible = true;
            button6.Visible = true;
            button7.Visible = true;
        }

        private void button2_Click(object sender, EventArgs e)
        {
            button8.Visible = true;
            button9.Visible = true;
            button10.Visible = true;
        }

        private void button3_Click(object sender, EventArgs e)
        {
            button11.Visible = true;
            button12.Visible = true;
            button13.Visible = true;
        }
    }
}