GUI HandfdgdOut
-
Upload
abraham-mulugeta -
Category
Documents
-
view
231 -
download
0
Transcript of GUI HandfdgdOut
-
7/26/2019 GUI HandfdgdOut
1/36
13.1 Introduction
Graphical User Interface (GUI) Gives a program distinctive look and feel
Built from GUI controls (Fig. 13.2) Objects that can display information on the screen or enable users to interact with anapplication
ImplementsIComponent interface
GUI (HU 2015/16) 1
-
7/26/2019 GUI HandfdgdOut
2/36
Cont.
Common GUI events:
mouse move
mouse click
mouse double-click
key press
button click
change in focus
window activation
GUI (HU 2015/16) 2
-
7/26/2019 GUI HandfdgdOut
3/36
13.2 Windows Forms
Windows Forms Used to create GUIs for programs
Graphical element that appears on your computers desktop Active window is the front most window
A Form is a container for controls and components
In visual programming, Visual Studio generates much of the GUI-related code
GUI (HU 2015/16) 3
-
7/26/2019 GUI HandfdgdOut
4/36
Form PropertiesProperty Description
Location Point of to left corner
Size Size of form in pixels
Text Text displayed or caption
AutoScaleDimensions DPI resolution of display it was built for. Will be scaled to look correct
on other displays.
BackColor Background color
ForeColor Foreground or drawing color
ClientSize Size of drawing area without borders or scrollbars
Controls A collection of controls owned by the form
WindowState Whether maximized, minimized or normal
DefaultSize Size when initially created
MinimumSize Minimum size window can be resized to
MaximumSize Maximum size window can be resized toGUI (HU 2015/16) 4
-
7/26/2019 GUI HandfdgdOut
5/36
Form EventsEvent Description
Load Just before form is loaded the first time
Closing Just before the form is closed
Closed When the form is actually closed
Shown Occurs when a form is first displayed
ResizeBegin Resize operation has begun
ResizeEnd Resize operation has ended
GUI (HU 2015/16) 5
-
7/26/2019 GUI HandfdgdOut
6/36
Form MethodsMethod Description
Activate Activates the window and gives it focus
Close Closes the form
Show Makes the form visible
BringToFront Moves to top of stacking order
Hide Makes the form invisible
Focus Gives the form focus
GUI (HU 2015/16) 6
-
7/26/2019 GUI HandfdgdOut
7/36
CheckBoxes
Labeled boxes which can be checked or uncheckedChecked get/set Boolean to determine if box is checked
CheckedChanged delegate called when the box ischecked or unchecked
GUI (HU 2015/16) 7
-
7/26/2019 GUI HandfdgdOut
8/36
GroupBox
Displays a border around a group of controls Can have optional label controlled by Text property
Controls can be added by Placing them within the group box in the designer
Adding to the Controls list programmatically
GUI (HU 2015/16) 8
-
7/26/2019 GUI HandfdgdOut
9/36
Panels
A panel is like a group box but does not have a text label
It contains a group of controls just like group box BorderStyle get/set border style as
BorderStyle.Fixed3D
BorderStyle.FixedSingle
BorderStyle.None
GUI (HU 2015/16) 9
-
7/26/2019 GUI HandfdgdOut
10/36
Radio Buttons
Radio buttons are similar to checkboxes, but
Appear slightly different Allow buttons to be grouped so that only one can be checked at a time
A group is formed when the radio buttons are in the samecontainer usually a group box or panel
GUI (HU 2015/16) 10
-
7/26/2019 GUI HandfdgdOut
11/36
Radio Buttons
Checked get/set Boolean indicating if the button is checked
CheckedChanged delegate invoked when the button is
checked or unchecked
GUI (HU 2015/16) 11
-
7/26/2019 GUI HandfdgdOut
12/36
TextBox
This is a single line or multi-line text editor Multiline get/set Boolean to make multiline
AcceptsReturn in a multiline box, if true then pressingReturn will create a new line. If false then the buttonreferenced by the AcceptButton property of the form,will be clicked.
PasswordChar if this is set to a char, then the boxbecomes a password box
GUI (HU 2015/16) 12
-
7/26/2019 GUI HandfdgdOut
13/36
TextBox
ReadOnly if true, the control is grayed out and will notaccept user input
ScrollBars determines which scrollbars will be used:ScrollBars.None, Vertical, Horizontal, Both
TextAlign get/set HorizontalAlignment.Left, Center, orRight
TextChanged event raised when the text is changed
GUI (HU 2015/16) 13
-
7/26/2019 GUI HandfdgdOut
14/36
File Dialog
The file dialog allows you to navigate through directories and loador save files
This is an abstract class and you useOpenFileDialogSaveFileDialog
You should create the dialog once and reuse it so that it willremember the last directory the user had navigated to
GUI (HU 2015/16) 14
-
7/26/2019 GUI HandfdgdOut
15/36
File Dialog
InitialDirectory string representing the directory to start in
Filter a string indicating the different types of files to be
displayed A set of pairs of display name and pattern separated by vertical bars
Windows Bitmap|*.bmp|JPEG|*.jpg|GIF|*.gif
FilterIndex the filter to use as an origin 1 index
GUI (HU 2015/16) 15
-
7/26/2019 GUI HandfdgdOut
16/36
File Dialog
FileName the name of the file selected
ShowDialog a method to show the dialog and block until cancel orOK is clicked
if (openDialog.ShowDialog() == DialogResult.OK) {
Image img = Image.FromFile(openDialog.FileName);
pictureBox1.Image = img;
}
GUI (HU 2015/16) 16
-
7/26/2019 GUI HandfdgdOut
17/36
Image Class
An abstract class that can store an image
Several concrete classes are used for image types such as
BMP, GIF, or JPGFromFile(string fname) loads any supported imageformat from a file
FromStream(stream) loads an image from a streamHeight image heightWidth image width
GUI (HU 2015/16) 17
-
7/26/2019 GUI HandfdgdOut
18/36
PictureBox Class
This displays an imageImage assigned an Image object to display
SizeMode determines what to do if the image does not fit into thewindow
Normal
StretchImage
AutoSize
CenterImage
Zoom
GUI (HU 2015/16) 18
-
7/26/2019 GUI HandfdgdOut
19/36
ToolTips
These are the small pop-up boxes which explain the purpose of acontrol
To use Create a new tooltip in the designer
Drop the tooltip onto the form
The tooltip will appear on a tray below the form
GUI (HU 2015/16) 19
-
7/26/2019 GUI HandfdgdOut
20/36
ToolTips
GUI (HU 2015/16) 20
-
7/26/2019 GUI HandfdgdOut
21/36
ToolTips
After the tooltip appears in the tray, a new tooltip property appearsfor every component
This can be assigned different text for each component That text will be displayed when the mouse hovers over that
component
GUI (HU 2015/16) 21
-
7/26/2019 GUI HandfdgdOut
22/36
NumericUpDown
This allows the selection of an integer from a limited range
Also called a spinnerMinimum smallest selectable value
Maximum largest selectable value
Increment size of increment per click
Value the selected value
ValueChanged event raised when the value changes
GUI (HU 2015/16) 22
-
7/26/2019 GUI HandfdgdOut
23/36
MonthCalendar
A control which displays a calendar for the selection
of a range of datesMinDate the first selectable date
MaxDate the last selectable date
SelectionStart DateTime of start of selection
SelectionEnd DateTime of end of selection
DateChanged event raised when date is changed
GUI (HU 2015/16) 23
-
7/26/2019 GUI HandfdgdOut
24/36
DateTimePicker
Similar to a month calendar but Calendar pulls down and selection displayed
More configurable
Selects a single value, not a range
Properties/methodsFormat Long, Short, Time, CustomValue DateTime value selectedValueChanged event which fires when date or time changes
GUI (HU 2015/16) 24
-
7/26/2019 GUI HandfdgdOut
25/36
System.DateTime Structure
A structure representing a date and time
Constructors
DateTime(int d, int m, int y)DateTime(int d, int m, int y, int h, int m, int s)
PropertiesNow returns a DateTime object set to the current local time
GUI (HU 2015/16) 25
-
7/26/2019 GUI HandfdgdOut
26/36
DateTime
Day day from 1-31
Month month from 1-12
Year tear from 1-9999Hour from 0-23
Minute minute from 0 -59
Second second from 0 -59
Millisecond millisecond from 0-999
GUI (HU 2015/16) 26
-
7/26/2019 GUI HandfdgdOut
27/36
DateTime
DayOfWeek get enumeration of Sunday, Monday,
DayOfYear day of year from 1 366
MethodsDateTime AddYears(double value)DateTime AddMonths(double value)
DateTime AddDays(double value)
DateTime AddHours(double value)
DateTime AddSeconds(double value)
DateTime AddMilliseconds(double value)
GUI (HU 2015/16) 27
-
7/26/2019 GUI HandfdgdOut
28/36
DateTime
TimeSpan Subtract(DateTime)
int CompareTo(DateTime)
static DateTime Parse(string)
ToLongDateString()
ToShortDateString()
ToLongTimeString()
ToShortTimeString()
GUI (HU 2015/16) 28
-
7/26/2019 GUI HandfdgdOut
29/36
ListBox
The ListBox presents a list of items which can beselected
A scrollbar is displayed if neededMultiColumn displays list as multiple columnsSelectedIndex index of selected item
SelectedIndices collection of selected indices
SelectedItem the selected item
GUI (HU 2015/16) 29
-
7/26/2019 GUI HandfdgdOut
30/36
ListBox
SelectedItems collection of selected items
SelectionMode how items can be selectedNone no selection
One single selection
MultiSimple each click selects additional item
MultiExtended uses shift and control keys
Sorted if true the items will be sorted alphabetically
GUI (HU 2015/16) 30
-
7/26/2019 GUI HandfdgdOut
31/36
ListBox
Items a collection of items in the list box
ClearSelected method to clear selection
GetSelected returns true if the parameter passed is selectedSelectedIndexChanged event when selection changes
GUI (HU 2015/16) 31
-
7/26/2019 GUI HandfdgdOut
32/36
Populating a ListBox
Any object can be placed into a ListBox
The display is generated by ToString()
for(int i = 0; i < 50; i++) {
listBox1.Items.Add(
"Item " + i.ToString());
}
GUI (HU 2015/16) 32
-
7/26/2019 GUI HandfdgdOut
33/36
ComboBox
A combo box is like a list but lets you displays a selected value.
The list pulls down when a selection is being made.
Options allow the selected text to be editable or to require it to beselected from the drop-down list
GUI (HU 2015/16) 33
-
7/26/2019 GUI HandfdgdOut
34/36
ComboBox
DropDownStyleSimple text is editable & list always visible
DropDown default indicating text is editable & user must click to see list
DropDownList value is not editable & user must click to see list
Items the collection of items in the list
GUI (HU 2015/16) 34
-
7/26/2019 GUI HandfdgdOut
35/36
ComboBox
MaxDropDownItems max number of items in pulldown beforescrollbar used
SelectedIndex index of selectionSelectedItem selected item
Sorted whether entries are sorted
SelectedIndexChanged event raised when selection changes
GUI (HU 2015/16) 35
-
7/26/2019 GUI HandfdgdOut
36/36
Code-behind
Events are handled by methods that live behind GUI our job is to program these methods
GUI (HU 2015/16) 36