MCTS 70526 - PowerPoint PPT Presentation

Loading...

PPT – MCTS 70526 PowerPoint presentation | free to download - id: 18b43e-MTg2Z



Loading


The Adobe Flash plugin is needed to view this content

Get the plugin now

View by Category
About This Presentation
Title:

MCTS 70526

Description:

... when pressed in combination with the Alt key, move the focus to the ... that allows you to define a preset pattern for accepting or rejecting user input. ... – PowerPoint PPT presentation

Number of Views:49
Avg rating:3.0/5.0
Slides: 31
Provided by: tto8
Learn more at: http://www.ottawacommunity.net
Category:

less

Write a Comment
User Comments (0)
Transcript and Presenter's Notes

Title: MCTS 70526


1
MCTS 70-526
  • Chapter 2

The design of the user interface is crucial to
the success of an application. I find that a user
interface must be internally consistent, flow
logically, and be easy for the user to use and
understand. Poorly designed user interfaces have
led to lost hours in training and use and,
ultimately, to lost productivity. Matt Stoecker
2
Chapter Summary
  • Configure controls on a Windows Form at design
    time to optimize the user interface (UI).
  • Modify control properties.
  • Configure controls in a Windows Form at run time
    to ensure that the UI complies with best
    practices.
  • Create and configure command controls on a
    Windows Form.
  • Create and configure text edit controls on a
    Windows Form.
  • Create and configure text display controls on a
    Windows Form.
  • Use the LinkLabel control to add Web-style links
    to Windows Forms applications.

3
Section One Configuring Controls in Windows
Forms(In Accordance with Best Practices)
  • Learn common properties of controls
  • How to change the properties of controls at
    design time or at run time
  • Learn how to control the layout of our controls

4
Overview of Controls
Section One
  • Controls are components that combine a graphical
    interface with pre-designed functionality
  • Controls are reusable units of code that are
    designed to fulfill particular tasks
  • All controls inherit from the base class Control
    and, as such, share a variety of properties
    relating to size, location, and other general
    aspects of controls

5
Common Properties of Controls
Section One
  • Anchor - Determines how the control is anchored
    in its parent form or container control.
  • BackColor - Gets or sets the BackColor of the
    control.
  • BackgroundImage - Represents the image that is
    painted as the background image of the control.
  • CausesValidation - Represents whether a control
    causes validation validation enables you to
    verify that user input meets specific formatting
    and value requirements.
  • ContainsFocus - Indicates whether this control
    or one of its child controls has the focus.
  • Controls - Gets the collection of controls
    contained within this control. Used only for
    containers.
  • Cursor - Represents the cursor that is used when
    the mouse pointer is over this control.
  • Dock - Determines how the control is docked in
    its parent form or container control.
  • Enabled - Gets or sets whether the control is
    enabled. If a control is not enabled, it will
    appear grey and cannot be selected or edited.
  • Font - Gets or sets the font used to display
    text by this control.
  • ForeColor - Represents the color used in the
    foreground of this control, primarily for
    displaying text.
  • HasChildren - Gets a value that indicates if this
    control has any child controls.

6
Common Properties of Controls Contd
Section One
  • Height - Represents the height of the control in
    pixels.
  • Location - Indicates the location of the upper
    left-hand corner of this control relative to the
    upper left-hand corner of its parent form or
    container control.
  • MaximumSize - Gets or sets the maximum size for
    the control.
  • MinimumSize - Gets or sets the minimum size for
    the control..
  • Name - Represents the name used to refer to the
    control in code. This property can be altered
    only at design time and cannot be modified at run
    time.
  • Parent - Gets or sets the parent form or
    container control for this control. Setting this
    property adds the control to the new parents
    controls collection.
  • Region - Gets or sets the window region
    associated with the control.
  • Size - Represents the size of the control in
    pixels.
  • TabOrder - Indicates in what order the control
    will be selected when the Tab key is used to
    navigate from control to control.
  • Tag - Enables the programmer to store a value or
    object associated with the control.
  • Text - Gets or sets the text associated with the
    control. The text might or might not be
    displayed, depending on the type of control and
    other property settings.
  • Visible - Indicates whether the control is
    visible.
  • Width - Represents the width of the control in
    pixels.

7
Modifying Control Size
Section One
  • To resize a control at design time
  • Select the control, and then drag a corner or an
    edge to the appropriate size.
  • Modify the Size property in the Property Grid by
    either changing the Size property directly or
    expanding the Size property and changing the
    Height or Width.

8
Modifying Control Location
Section One
  • To change the location of a control at design
    time
  • Grab the middle of the control with the mouse and
    drag it to the appropriate location.
  • Set the Location property of the control in the
    Property Grid, either by setting the Location
    property directly or by expanding the Location
    property and modifying the values of X or Y as
    appropriate.
  • Reposition a group of controls graphically with
    the mouse. You must first select all of the
    controls that you want to move, either by
    outlining the appropriate controls with the mouse
    or by holding down the Ctrl key and clicking each
    control in turn.

9
The Layout Toolbar
Section One
  • The Layout toolbar provides a quick and easy way
    to accomplish many of the control layout tasks
    required at design time.
  • The Layout toolbar allows you to adjust the
    vertical and horizontal spacing of a group of
    controls.
  • The Layout toolbar also contains buttons that
    allow you to align the controls in the designer.
  • The Layout toolbar also contains buttons that
    allow you to set the tab order in the designer.

10
Snaplines
Section One
  • Snaplines are new features that give you visual
    aid and feedback when locating controls on a form
    or within a container control. When a control is
    dragged onto a form or container control,
    snaplines appear, providing cues relating to
    control alignment.

11
Modifying Control Properties at Design Time
Section One
  • Although you can modify properties of controls
    such as location and size by manipulating the
    control in the designer, there are other
    mechanisms that allow you to set control
    properties in the designer, including the
    Properties window, SmartTags, and the Document
    Outline window.
  • The Properties Window

12
Modifying Control Properties at Design Time Contd
Section One
  • The Anchor Property
  • The Anchor determines which edges of the control,
    if any, maintain a constant distance from the
    edge of its parent form or container control when
    the parent is resized. This has the effect of the
    control maintaining both its position and size
    when the parent is resized. If opposite edges
    (for example, right and left) are both set in the
    Anchor property, the control will stretch when
    the parent is resized. If neither of opposite
    edges is set in the Anchor property, the control
    will float when the parent is resized.

13
Modifying Control Properties at Design Time Contd
Section One
  • The Dock Property
  • The Dock property allows you to attach a control
    to the edge of its parent. For example, a control
    docked to the top edge of a form or container
    control will always be connected to the top edge
    of the parent control and will automatically
    resize in the left and right directions when its
    parent is resized. The Dock property can also be
    set to Fill, in which case, the control will grow
    to occupy all of the available space in the
    parent control.

14
Modifying Control Properties at Design Time Contd
Section One
  • Smart Tags
  • Some controls expose their most common tasks
    through smart tags. When present, smart tags
    appear as small boxes in the upper right-hand
    corner of the control. When the smart tag is
    clicked, a box that facilitates the most common
    tasks appears,

15
Modifying Control Properties at Design Time Contd
Section One
  • Document Outline Window
  • Graphically displays all of the controls and
    container controls that reside in a form.
  • You can grab controls in the Document Outline
    window and move them from one container to
    another.
  • You can also delete controls from the form by
    deleting them in the Document Outline window and
    add them by copying them from the Toolbox.

16
Best Practices for User Interface Design
Section One
  • How your user interface is composed influences
    how easily your application can be learned and
    used. Primary considerations for user interface
    design include
  • Simplicity - A user interface should allow a user
    to quickly complete all tasks required by the
    program
  • Keep program flow and execution in mind
  • Enable default values whenever possible.
  • Position of controls - The location of controls
    on your user interface should reflect their
    relative importance and frequency of use.
  • Controls that display related information should
    be grouped together.
  • Consistency - Consistency is created from the use
    of colors, fonts, size, and types of control.
  • Decide on a visual scheme that will remain
    consistent throughout the application.
  • Aesthetics - Never rely on color alone to convey
    information and, when designing for international
    audiences, be aware that certain colors might
    have cultural significance.

17
Section Two Creating and Configuring Command and
Text Display Controls
Section Two
  • This section will focus on common properties and
    events of the Button, Label, and LinkLabel
    controls and how to use them in designing your
    user interface.
  • Text display controls such as Label and LinkLabel
    are most commonly used to convey read-only
    information to the user.
  • Command controls such as the Button are used to
    execute tasks or proceed with the application.

18
Creating and Configuring Command and Text Display
Controls Contd
Section Two
  • The Button Control
  • The Button control is the primary control that
    enables command interaction between the user and
    the user interface.
  • Display a short string on the front and respond
    to user clicks.
  • Gives a visual cue when clicked and exposes an
    event handler that allows the user to write code
    that executes when the Button is clicked

19
Important Properties of the Button Control
Section Two
  • AutoEllipsis - Enables the automatic handling of
    text that extends beyond the width of the button.
  • DialogResult - Sets a DialogResult value that
    you can associate with the button, such as
    DialogResult.OK or DialogResult.Cancel.
  • FlatAppearance - Defines styles that govern how
    the button appears and behaves when the FlatStyle
    property is set to Flat.
  • Text - Sets the text that appears on the button.
  • TextAlign - Indicates how the text displayed on
    the button will be aligned.

20
The Button Command Responding to Clicks
Section Two
  • The primary function of a Button control in the
    user interface is to respond to user mouse
    clicks.
  • You can write code to be executed when the button
    is clicked by using the Button.Click event
    handler.
  • private void button1_Click(object sender,
    EventArgs e)
  • MessageBox.Show("The Button has been clicked!")
  • You can also configure a button or other control
    to respond to other mouse clicks as well, such as
    right-clicks.
  • private void button1_MouseDown(object sender,
    MouseEventArgs e)
  • switch (e.Button)
  • case MouseButtons.Left MessageBox.Show("The
    left button was clicked") break
  • case MouseButtons.Right MessageBox.Show("The
    right button was clicked") break
  • default MessageBox.Show("Some other button
    was clicked") break

21
The Button Command FlatStyle and FlatAppearance
Section Two
  • FlatStyle Property
  • Governs whether the button has a
    three-dimensional, raised appearance, or a flat
    appearance.
  • You can give a button a flat appearance by
    setting the FlatStyle property to Flat.
  • When the FlatStyle is set to Flat, there are
    fewer built-in visual cues that allow the user to
    interact with the button.
  • BorderColor - This property sets the color of
    the button border.
  • BorderSize - This property sets the size of the
    button border.
  • MouseDownBackColor - This property sets the
    color of the button when the left mouse button
    clicks this button.
  • MouseOverBackColor - This property sets the
    color of the button when the mouse pointer is
    over the button.

22
The Label Control
Section Two
  • The Label control is primarily used to display
    read-only textual information to the user.
  • The text displayed in a Label is set in the
    Labels Text property.
  • You can set the Label to resize itself
    automatically to the size of the text by setting
    the Labels AutoSize property to True. If the
    AutoSize property is set to False, you can set
    the size of the Label by grabbing and dragging
    the control edges in the designer.
  • Label controls can be used to define access keys
    for other controls. Access keys are keys that,
    when pressed in combination with the Alt key,
    move the focus to the desired control.

23
The LinkLabel Control
Section Two
  • The LinkLabel control allows you to create a
    Web-style link in your form that opens a Web page
    or performs some other action when clicked.
  • ActiveLinkColor - Represents the color of the
    link when the link is being clicked.
  • LinkArea - Indicates the area of the LinkLabel
    that functions as a link.
  • LinkBehavior - Indicates the behavior of the
    link.
  • LinkColor - LinkColor indicates the color of the
    link before being clicked.
  • LinkVisited - Indicates whether the link has
    been visited.
  • VisitedLinkColor - The color of a link that has
    been visited.You must set the LinkVisited
    property of the LinkLabel control to True for the
    link to appear in the color indicated by the
    VisitedLinkColor property.

24
The LinkLabel Control Specifying Link Behavior
Section Two
  • The LinkBehavior property has four possible
    values
  • SystemDefault - Will display the same default
    link behavior as is specified by the system.
  • AlwaysUnderline - The link will always be
    underlined.
  • NeverUnderline - The link will never be
    underlined
  • HoverUnderline - The link will be underlined only
    when the mouse hovers over the link.
  • You can use the LinkLabel.LinkClicked event
    handler to open a new form or Web page.
  • // Opens a new Form
  • ShippingForm.Show()
  • // Opens a new web site in Internet Explorer
  • System.Diagnostics.Process.Start("www.microsoft.co
    m")
  • // Set the LinkVisited property to true
  • linkLabel1.LinkVisited true

25
Section Three Creating and Configuring Text Edit
Controls
Section Three
  • In this section, you will learn how to configure
    the TextBox and MaskedTextBox controls to receive
    and display user input.
  • TextBox controls are used to both display text to
    the user and receive textual input.
  • MaskedTextBox allows you to display text in a
    preset format and validate user input against a
    format.

26
The TextBox Control Properties
Section Three
  • AutoCompleteCustomSource - Holds a string
    collection that contains auto-complete data when
    the AutoCompleteMode is set to a value other than
    None and the AutoCompleteSource is set to Custom
  • AutoCompleteMode - Sets the AutoComplete mode of
    the control. Possible values are None, Append,
    Suggest, or Suggest-Append.
  • AutoCompleteSource - Sets the source for
    auto-complete data. Can be set to any of a
    variety of system sources or to a custom source
    provided by the AutoCompleteCustomSource
    property.
  • CharacterCasing - Indicates the casing of the
    characters in the Text-Box control. Possible
    values are Normal, Upper, or Lower.
  • Lines - Returns a string array representing the
    individual lines of the text box. This property
    is most useful when MultiLine is set to True.
    Note that a line is defined as a string that is
    terminated by a carriage return character and
    does not refer to visible lines in the UI as
    might be seen when the WordWrap property is set
    to True.
  • MaxLength - Specifies the maximum number of
    characters that can be entered into the TextBox.
  • MultiLine - Indicates whether the TextBox can
    contain only a single line of text or multiple
    lines.
  • PasswordChar - Sets the password character to be
    displayed in the Textbox instead of the actual
    characters of the text.
  • ReadOnly - Indicates whether the text in the
    TextBox can be edited.
  • ScrollBars - Indicates the scroll bars that will
    be displayed in the TextBox when the MultiLine
    property is set to True.
  • Text - Gets or sets the text contained in the
    TextBox.
  • UseSystemPasswordChar - Indicates whether to use
    the system password instead of the actual text
    character in the TextBox.
  • WordWrap - Indicates whether words automatically
    wrap from one line to the next when the MultiLine
    property is set to True.

27
The TextBox Control MultiLine PasswordChar
Property
Section Three
  • The TextBox allows you to receive text from and
    display text to the user. You can create text
    boxes that can display multiline text, and you
    can create text boxes that display a password
    character instead of the actual text.
  • TextBox controls are single-line by default, but
    you can create a multiline TextBox by setting the
    MultiLine property to True and as such several
    other properties become important.
  • Lines property - Exposes a string array that
    contains the individual lines of the TextBox.
  • ScrollBars property - Indicates whether scroll
    bars will be displayed for the TextBox and, if
    so, whether Horizontal, Vertical, or both will be
    displayed.
  • Word-Wrap property - Indicates whether words will
    automatically wrap from one line to the next.
  • You can use the PasswordChar or
    UseSystemPasswordChar properties to create a text
    box that can receive text input but display a
    masking character instead of the actual text,
    rendering the user input unreadable by
    observers.You can also set the UseSystemPasswordCh
    ar property to True, which will display the
    password character defined by the system for each
    character typed in the text box.

28
The MaskedTextBox Control
Section Three
  • The MaskedTextBox control is a modified TextBox
    that allows you to define a preset pattern for
    accepting or rejecting user input. The Mask
    property allows you to specify required or
    optional characters, or specify whether input
    characters are letters or numbers, and apply
    formatting for the display of strings.
  • AllowPromptAsInput - Indicates whether the
    prompt character is valid as input.
  • AsciiOnly - Indicates if only ASCII characters
    are valid as input. When set to True, only AZ
    and az are accepted as input.
  • BeepOnError - Indicates whether the
    MaskedTextBox sends a system beep for every input
    character it rejects.
  • CutCopyMaskFormat - Determines whether literals
    and prompt characters are included when the text
    is cut or copied.
  • HidePromptOnLeave - Indicates whether prompt
    characters are hidden when the MaskedTextBox
    loses the focus.
  • InsertKeyMode - Gets or sets the text insertion
    mode for the Masked-TextBox.
  • Mask - Defines the input mask for the
    MaskedTextBox (explained in detail in the
    following text).
  • PromptChar - Gets or sets the character used for
    the prompt.
  • RejectInputOnFirstFailure - Governs how text
    that is pasted into the MaskedTextBox is handled.
    If a string that does not match the Mask format
    is pasted into the MaskedTextBox, the
    MaskedTextBox will reject the entire string if
    the Reject-InputOnFirstFailure is set to True. If
    set to False, the MaskedTextBox will accept all
    the characters that match the Mask format.
  • ResetOnPrompt - Indicates how an input character
    that matches the prompt character should be
    handled.
  • ResetOnSpace - Determines how a space input
    character should be handled.
  • SkipLiterals - Indicates whether literals in the
    mask should be reentered or skipped.
  • TextMaskFormat - Indicates whether prompt
    characters and literal characters are included in
    the text returned by the Text property.

29
Configuring the MaskedTextBox for User Input
Section Three
  • The Mask Property
  • The Mask Property allows you to define a string
    that represents the required format of an input
    string in the MaskedTextBox. The
    MaskedTextProvider associated with the
    MaskedTextBox provides the parsing engine that
    parses the Mask format.

30
The Mask Property MaskedTextProvider Elements
Section Three
  • 0 - Represents a required digit between 0 and 9.
  • 9 - Represents an optional digit between 0 and
    9.
  • - Represents an optional digit between 0 and
    9, or a space. Plus () and minus () signs are
    also accepted.
  • L - Represents a required letter, either
    uppercase or lowercase (AZ, az).
  • ? - Represents an optional letter, uppercase or
    lowercase (AZ, az).
  • - Represents a required character. If
    AsciiOnly is set to True, this element behaves
    like the L element.
  • C - Represents an optional character. If
    AsciiOnly is set to True, this element behaves
    like the ? element.
  • A, a - Represents an optional alphanumeric
    character. If AsciiOnly is set to True, it will
    accept only AZ and az.
  • . - Decimal placeholder. Represents a decimal
    character. The actual character used will be the
    decimal character that is set by the controls
    FormatProvider.
  • , - Thousands placeholder. Represents a
    thousands separator. The actual character used
    will be the thousands separator that is set by
    the controls FormatProvider.
  • - Time separator. Represents a time separator.
    The actual character used will be the time
    separator character that is set by the controls
    FormatProvider.
  • / - Date separator. Represents a date separator.
    The actual character used will be the date
    separator that is set by the controls
    Format-Provider.
  • - Currency symbol. Represents a currency
    symbol. The actual character used will be the
    currency symbol that is set by the controls
    FormatProvider.
  • lt - Shift down. Converts all following
    characters to lowercase.
  • gt - Shift up. Converts all following characters
    to uppercase.
  • - Disables a previous shift up or shift down.
  • \ - Escapes a mask character, turning it into a
    literal character. The double slash (\\) is the
    escape sequence for a backslash.
  • All other characters appear as themselves in the
    MaskedTextBox characters and cannot be moved or
    deleted by the user.
About PowerShow.com