Programming in C# Windows Forms

1. Programming in C#Windows Forms CSE 494R (proposed course for 459 Programming in C#) Prof. Roger Crawfis

2. Creating a nice GUI • The next several slides will walk you thru a particular design that I like for my applications. • The design consists of a GUI panel on the left and a view panel on the right, with a status bar and a main menu.

3. Create a new Project • Select a C# Windows Application

4. Add your GUI elements • Resize the Form to be about 800 by 600, or whatever you like. • In this order, add the following elements from the Toolbox->Windows Forms. • MenuStrip • StatusStrip • SplitContainer

5. GUI design • In the Properties window you can make changes to the content and appearance of these controls. • Add some status information • Add some menu items • Change the background colors.

6. GUI Design • Build (Build->Build Solution) and run (Debug->Start without Debugging) your application. Try to achieve something that looks like this:

7. GUI Design • OK. Let’s add some functionality. • Work on these tasks: • Opening a file selected from the menu. • Hiding and displaying the user-interface panel. • Setting the text for the number of correct answers and the hint.

8. GUI Design • Your program should now look like this. New Title added Background image added

9. Examine the code • Okay. We have the basic lay-out. Notice we have not done any programming yet. • Notice that the Form1.cs file has a hierarchy. • Double-click on Form1.cs will open the designer. • Right-click on this and select view code or right-click in the designer and select view code to show the source code. • Note that it is a “partial class” and that the constructor calls InitializeComponents().

10. Examine the code • Right-click the Form1.Designer.cs and select view code. • Browse through this, but do not change it.

11. Open File Dialogue • With windows forms and .Net this is really trivial. Follow these simple steps: • Drag an OpenFileDialog control to anywhere on your Form. Notice that it places it in a special window pane below your design. • Make sure you add a menu option to open a flash card collection (whatever that is).

12. Open File Dialogue • Adjust the OpenFileDialog’s properties • Change the Title to “Select a topic to study” • In the Filter property add a string to aid in the right file type selection. Something like this: “All files (*.*)|*.*|My Flash Cards (*.mfc)|*.mfc”. Each pair here has the format (Text string to display | regular expression). Note that adding a space before the asterisk results in a different regular expression. • Set the Filter index to 1, such that mfc is the default format. • Set the AddExtension to False. • Make sure the Multiselect property is False.

13. Open File Dialogue • Okay, we have now defined everything, such that the constructor is called and the properties are set. Nothing will happen though, we need to add some logic. • Double click the “Open …” menu item. This adds some template code and brings up the source code window (Form1.cs). • Add the following clause in the template for openToolStripMenuItem_Click: if( this.openFileDialog1.ShowDialog() == DialogResult.OK) { }

14. Programming in C#Windows Forms CSE 494R (proposed course for 459 Programming in C#) Prof. Roger Crawfis