Notepad interface design

1. Open VS, file – New – Project

2. Change the name of the new project to Notepad

3. Set the properties of the form: change the text property to “Notepad”

4. Place controls

(1) MenuStrip menu control

Click on the left side of the form to appear toolbox → find menuStrip → drag to form

Click the menu bar → Properties in the lower right corner → Change the Name property to “mnusNotepad”

Set up [file (F)], [edit (E)], [format (O)], [check (V)] and attributes – > click the help (H) 】 【 【 file (F)], [edit (E)], [format (O)], [check (V)], and [help (H)] find corresponding properties window, set according to the following table

(2) ToolStrip (Toolbar control)

Click on the left side of the form to bring up the toolbox → find “ToolStrip” → drag into the form

Click toolbar → Properties in lower right corner → Change Name property to “tlsNotepad”

Right click toolbar → Insert standard items as shown in the figure

Right click toolbar → Edit item to see our button members here we can delete or add, for beginners to learn, we only set a few simple functions (new, open, save, cut, paste, copy). We won’t set anything else.

(3) RichTextBox (multi-format text box control)

Click on the left side of the form will appear toolbox → find “RichTextBox” → drag to form

Click the toolbar → Properties in the lower right corner → Modify the Name property to “rtxtNotepad” as shown in the figure

Select the “Top, Bottom, Left, Right” Anchor property so that when the form size changes, the size of the RichTextBox control changes as well

StatusStrip (Status bar control)

Add the StatusStrip control, set its Name property to “stsNotepad”, Dock property to “Bottom” and Anchor property to “Bottom, Left, Right”. Then click on the right of Item… Button to open the item Set Editor dialog box, as shown in the figure.

Keep the default option “StatusLabel” in the drop-down list, and then click “Add” button to add two statusLabels in turn and name them “tssLbl1” and “tssLbl2” respectively. Then set the Text attribute of tssLbl1 to “Ready”. TssLbl2 Text property set to “Show date and time”

(5) OpenFileDialog

When the user clicks the [File] → [Open] menu item of Notepad, open the file using the Open dialog box OpenFileDialog. OpenFileDialog controls the Name attribute of the “odlgNotepad”, the Filter attribute set to “| RTF files. All files RTF | |. *”.

(6) Save dialog

When the user clicks the “File → save” (or “Save as”) menu item of Notepad, use the save dialog box SaveFileDialog to save the file. SaveFileDialog controls the Name attribute of the “sdlgNotepad”, FileName attribute to “no title”, the Filter attribute set to “RTF file | *. The RTF”.

(7) FontDialog

When the user clicks the [format] → [font] menu item of notepad, use the FontDialog box FontDialog to set the text font. The Name property of the FontDialog control is “fdlgNotepad”.

(8) Timer control

The Notepad described in this chapter displays the clock in the status bar, using a Timer control to do this. Set the Name attribute of the Timer control to “tmrNotepad”, the Enabled attribute to “True”, and the Interval attribute to “1000”, indicating that the Tick event is triggered once every second, that is, the clock is changed once every second.

Final interface display:

Place the code

1. First declare the following two public variables in the generic section of the code. They are both Boolean, “B” to determine whether the file is new or opened from disk, and “S” to determine whether the file is saved. Double-click the form to enter the code area and fill in the following code

/ / * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * / * Boolean variable b is used to judge the file new or from the disk, open true said file from disk to open, False indicates that a file is created. The default value is false*/ bool b = false. /* bool s = true; /* bool s = true; / / * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *Copy the code

When the text in the multi-format text box is changed, the Boolean variable “S” should be set to false, indicating that the file is not saved. Therefore, the code of the multi-format text box TextChanged event is written as follows:

/ / * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * / / rich text box the TextChanged event code //************************************************************************* private void rtxtNotepad_TextChanged(object Sender, EventArgs e) {// Set s to false, indicating that the file is not saved. } / / * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *Copy the code

3. [New (N)] menu item

When clicking this menu item to create a blank document, you should first determine whether the file was opened from disk or new, and set the previously defined variable (b) to “true” if it is opened from disk, or “false” otherwise. Doing so allows you to do something to the file based on this variable. And each time the file is saved, set the previously defined variable (s) to “true”, indicating that the file has been saved.

When you click the New menu, if the current file is opened from disk and has been modified, save the file in the path of the OpenFileDialog control.

If the file is new and the contents are not empty, the SaveFileDialog control will be used to save the file. The code for the [New (N)] menu item is as follows:

Double click “New”, enter the code area to fill in the following code

Private void tsmiNew_Click(object sender, EventArgs e) {private void tsmiNew_Click(object sender, EventArgs e) { Documents have not been saved and the if (b = = true | | rtxtNotepad. Text. The Trim ()! If (s == false) {string result; Result = messagebox.show (" file not saved, save?") , "save file", MessageBoxButtons YesNoCancel). The ToString (); switch (result) { case "Yes": If (b == true) {rtxtNotepad.savefile (odlgNotepad.filename); } else if (sdlgNotepad.showdialog () == dialogresult.ok) {rtxtNotepad.savefile (sdlgNotepad.filename); } s = true; rtxtNotepad.Text = ""; break; case "No": b = false; rtxtNotepad.Text = ""; break; }}}}Copy the code

4. [Open (O)] menu item

When you click this menu item, if you want to open the “*.rtf” file from disk or other device, you also need to make a judgment, except that after the judgment, you need to open the file with the OpenFileDialog control, and after each save, you need to set the previously defined variable (s) to “true” to indicate that the file has been saved. The code is as follows:

Double-click “Open”, enter the code area to fill in the following code

/ / open 】 【 menu code / / * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * private void tsmiOpen_Click(object sender, EventArgs e) { if (b == true || rtxtNotepad.Text.Trim() ! = "") { if (s == false) { string result; Result = messagebox.show (" file not saved, save?") , "save file", MessageBoxButtons YesNoCancel). The ToString (); switch (result) { case "Yes": if (b == true) { rtxtNotepad.SaveFile(odlgNotepad.FileName); } else if (sdlgNotepad.ShowDialog() == DialogResult.OK) { rtxtNotepad.SaveFile(sdlgNotepad.FileName); } s = true; break; case "No": b = false; rtxtNotepad.Text = ""; break; } } } odlgNotepad.RestoreDirectory = true; if ((odlgNotepad.ShowDialog() == DialogResult.OK) && odlgNotepad.FileName ! = "") { rtxtNotepad.LoadFile(odlgNotepad.FileName); // open the code statement b = true; } s = true; }Copy the code

5. [Save (S)] Menu item

Click this menu item to save the contents of the text box. You need to check whether the file is opened from the disk or a new one. If the file is opened from the disk, check whether the file is changed. If it is a new document, call SaveFileDialog to save the file, change bool b to “true”, and assign the SaveFileDialog file path to OpenFileDialog so that the next time you open the file, By default, the file path is the path where the file was just saved. After each file is saved, the variable (s) defined previously must be set to true, indicating that the file has been saved. The code is as follows:

Double-click “Save”, enter the code area to fill in the following code

/ / [save] menu code / / * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * private void TsmiSave_Click (object sender, EventArgs e) {// If (b == true && rtxtNotepad.modified == true) {rtxtNotepad.savefile (odlgNotepad.filename); if (b == true && rtxtNotepad.modified == true) {rtxtNotepad.savefile (odlgNotepad.filename); s = true; } else if (b == false && rtxtNotepad.Text.Trim() ! = "" && sdlgNotepad.ShowDialog() == DialogResult.OK) { rtxtNotepad.SaveFile(sdlgNotepad.FileName); // save the statement s = true; b = true; odlgNotepad.FileName = sdlgNotepad.FileName; }}Copy the code

6. [Save as (A)] Menu item

After saving the file as, set the previously defined variable (s) to “true” to indicate that the file has been saved. The code for this menu item is as follows: Double-click “Save as” to enter the code area and fill in the following code

private void tsmiSaveAs_Click(object sender, EventArgs e) { if (sdlgNotepad.ShowDialog() == DialogResult.OK) { rtxtNotepad.SaveFile(sdlgNotepad.FileName); s = true; }}Copy the code

7. [Exit (X)] menu item

The function of this menu item is to exit the Notepad program, the code is as follows: Double-click “Exit” to fill in the following code

/ [out of] the menu code / / * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * private void tsmiClose_Click(object sender, EventArgs e) { Application.Exit(); // End of program}Copy the code

8. [Edit (E)] Menu

Used to complete cancellation (a recent to edit the text frame’s operation), copy (copy the selected text content), cut (shear selected text content), paste, paste the contents of the clipboard), future generations (rich text box selected all of the content) and append to a text file of the date of the current function. [Edit (E)] Click event codes of menu items are as follows:

/ / click on the edit menu 】 each menu item code / / * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * / / undo menu code 】 private void tsmiUndo_Click(object sender, EventArgs e) { rtxtNotepad.Undo(); Private void tsmiCopy_Click(Object sender, EventArgs e) {rtxtNotepad.copy (); Private void tsmiCut_Click(object sender, EventArgs e) {rtxtNotepad.cut (); Private void tsmiPaste_Click(object sender, EventArgs e) {rtxtNotepad.paste (); Private void tsmiSelectAll_Click(object sender, EventArgs e) {rtxtNotepad.selectAll (); Private void tsmiDate_Click(object sender, EventArgs e) { rtxtNotepad.AppendText(System.DateTime.Now.ToString()); // Display the current date}Copy the code

9. [Wrap (W)] menu item

The Checked property of this menu item defaults to “True”, the text content is wrapped according to the width of the text box, otherwise only the paragraph marks the wrap. The code for the [wrap (W)] menu item is as follows:

/ / menu code word wrap 】 【 / / * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * private void tsmiAuto_Click(object sender, EventArgs e) { if (tsmiAuto.Checked == false) { tsmiAuto.Checked = true; // Select the menu item rtxtNotepad.WordWrap = true; } else {tsmiAuto.Checked = false; rtxtNotepad.WordWrap = false; }}Copy the code

10, font (F) 】 menu item

When you click this menu item, the Font dialog box pops up to adjust the font, color, and other properties of the selection. So you need to use the FontDialog control you added earlier. Click event code of menu item is as follows:

/ / "font" menu code / / * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * private void tsmiFont_Click(object sender, EventArgs e) { fdlgNotepad.ShowColor = true; if (fdlgNotepad.ShowDialog() == DialogResult.OK) { rtxtNotepad.SelectionColor = fdlgNotepad.Color; rtxtNotepad.SelectionFont = fdlgNotepad.Font; }}Copy the code

11. [Toolbar (T)] Menu item

This menu item controls the display and hiding of the toolbar. The toolbar is displayed by default. The position and height of the multi-format text box should be changed when the toolbar is hidden. The code is as follows:

/ / "toolbar" menu code (not necessary) / / * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * private void tsmiToolStrip_Click(object sender, EventArgs e) { Point point; If (tsmitoolstrip.checked == true) {// When hiding the toolbar, set the coordinate to (0, 24) because the menu height is 24 point = new Point(0, 24); tsmiToolStrip.Checked = false; tlsNotepad.Visible = false; Rtxtnotepad. Location = point; Rtxtnotepad. Height += tlsnotepad. Height; } else {/* New point (0, 49);} else {/* New point (0, 49); tsmiToolStrip.Checked = true; tlsNotepad.Visible = true; rtxtNotepad.Location = point; rtxtNotepad.Height -= tlsNotepad.Height; }}Copy the code

12. Help (H) menu

This menu has only one menu item [About Notepad (A)], which calls A form (frmAbout) to display some information about this program. Use the LinkLabel control to set up links that make it easy to send e-mails to authors. The design of the frmAbout form is covered in detail in the next section (17.3.3 About Notepad).

After the frmAbout form is designed, in order to display the form, the click event code of the [About Notepad (A)] menu item needs to be written as follows:

private void tsmiAbout_Click(object sender, EventArgs e)
{
    frmAbout ob_FrmAbout = new frmAbout();
    ob_FrmAbout.Show();
}
Copy the code

About Notepad

Next click the Visual C# 2013 [project] → [add Windows forms] menu item to add a form named “frmAbout”, as shown in the figure.

Then add several Label, Button, LinkLabel and PictrueBox controls to the form “frmAbout”. The program interface after setting the properties according to the information in Figure 3.1 is shown as follows.

Private void btnOk_Click(object sender, EventArgs e) {this.close (); } private void llblEmail_LinkClicked(object sender, LinkLabelLinkClickedEventArgs e) {System. Diagnostics. Process. The Start (" http://www.baidu.com "); }Copy the code

1. Toolbar code

The toolbar provides some shortcut buttons to facilitate user operations. When a user presses the button, it selects a menu item. The switch statement is as follows.

private void tlsNotepad_ItemClicked(object sender, ToolStripItemClickedEventArgs e) { int n; // The variable n is used to receive the index number of the pressed button starting from 0 n = tlsnotepad.items.indexof (e.lickedItem); Switch (n) {case 0: FToolStripMenuItem_Click(sender, e); break; case 1: tsmiOpen_Click(sender, e); break; case 2: tsmiSave_Click(sender, e); break; /*case 3: tsmiCopy_Click(sender, e); break; Case3 case 4: tsmiCut_Click(sender, e); break; case 5: tsmiPaste_Click(sender, e); break; /*case 6: tsmiPaste_Click(sender, e); break; Case6 case 7: tsmiAbout_Click(sender, e); break; }}Copy the code

Timer code

To display the current time in tssLbl2 of the status bar, code the timer control’s Tick event (which fires every second) as follows

        private void tmrNotepad_Tick(object sender, EventArgs e)
        {
            tssLbl2.Text = System.DateTime.Now.ToString();
        }
Copy the code

The results