Illustrated WPF phần 6 pot

In this section, we’ll create a small program that has a custom command called Reverse, which reverses a string in a TextBox.. When the command is executed, by either the button or the k

Trang 1

Commands have, as part of their architecture, a way for the programmer to specify under what circumstances a command should be available and when it should not be available You can see this in action in the buttons in the example program Figure 9-13 shows that the buttons acting as the sources for the Cut and Paste commands are automatically enabled or disabled appropriately for their clipboard functions

no selected text in the first TextBox for the Cut command to work on and no text

on the system clipboard to be pasted by the Paste command

button has automatically become enabled

first TextBox and placing it on the system clipboard

becomes disabled

automatically becomes enabled

expect

use the Ctrl+X keyboard shortcut to cut the text

can use the Ctrl+V keyboard gesture to paste the text

Notice that there is nothing explicitly in the code to create any of this behavior, and yet it does the right things The reason these work is that this functionality was built in to the controls, to hook up with these predefined commands The command architecture allows you to build similar functionality into your own custom commands

Figure 9-13 The Cut and Paste buttons automatically become enabled or disabled appropriately for the

conditions and their functions

Trang 2

The RoutedCommand Class

The key to the WPF command architecture is the RoutedCommand class To create your own commands,

you’ll need to create an instance of this class, configure it, and bind it to the controls with which you

want to use it, as you’ll see in the next section

You might be tempted to think that this class implements the actions that should be taken

when the command is invoked It doesn’t Its main job is to raise events that trigger actions The

RoutedCommand class has two major methods, Execute and CanExecute

action of a command source

command! Instead, it raises two routed events—PreviewExecuted and

Executed

performs the implementation of the command

appropriate to make the command available

action it represents It also raises two routed commands—PreviewCanExecute

and CanExecute

determine whether to make the command available

There are also two other important members of the RoutedCommand class—CanExecuteChanged

and InputGestures Figure 9-14 shows the important members of these classes The RoutedUICommand

class derives from the RoutedCommand class and just adds a field named Text, which you can use to label controls or elements triggered by the command

CanExecuteChanged is a RoutedEvent that is raised when there are changes that might affect

whether the command should be available These signal the command source that it should call the

CanExecute method to determine whether it’s appropriate to make the command available

InputGestures is a property that returns the collection of input gestures associated with the

command

Trang 3

Creating Custom Commands

The previous example showed how to use WPF’s built-in commands with controls that have command support built in This is very powerful and can be a huge time-saver Sometimes, however, you might need to create your own custom commands In this section, we’ll create a small program that has a custom command called Reverse, which reverses a string in a TextBox

Figure 9-15 illustrates the program and shows the states of the source and target The Reverse button is the command source of the Reverse command The TextBox is the command target The other command source is the keyboard gesture Ctrl+R When the command is executed, by either the button

or the keyboard gesture, the text in the TextBox is reversed, as shown in the figure If there’s no text in the TextBox, then the button and the keyboard gesture are disabled

Figure 9-15 The window implementing the Reverse command

Figure 9-16 shows the structure you’ll need for implementing the Reverse command You’ll need to do the following things:

1 Create a new class that defines the command, including the input gestures

2 Create the command handler methods to be invoked by the Executed and

CanExecute events

3 Create a command binding to connect the command with the command handler

code

4 Connect the command source with the command

Figure 9-16 The command structure for implementing the Reverse command

Trang 4

First create the custom command inside a class called CommandReverse, which will create and

supply the command through a property Microsoft uses this pattern in its built-in commands You’ll

place this code in a separate file called ReverseCommand.cs The important things to notice are the

following:

hold the new command

keyboard shortcut, and adds it to an InputGesturesCollection, which will be

associated with the new command

private static RoutedUICommand reverse;

public static RoutedUICommand Reverse

{ get { return reverse; } }

static ReverseCommand()

{

InputGestureCollection gestures = new InputGestureCollection();

gestures.Add

( new KeyGesture(Key.R, ModifierKeys.Control, "Control-R"));

reverse = new RoutedUICommand

( "Reverse", "Reverse", typeof(ReverseCommand), gestures);

} ↑ ↑ ↑ ↑

} Description Name of The Type Registering Collection of

} the Command the Command InputGestures

Next, create the markup, which is just used to create the source and target objects All the other objects you’ll create in the code-behind This makes the markup very simple, as shown here—just a

TextBox and a Button in a StackPanel:

Trang 5

In the code-behind, create the rest of the objects, and connect the plumbing

command to the Reverse button command source

command, and assign delegates of the event handlers to the Executed and CanExecute events

bindings

Executed and CanExecute events are raised

When you run the program, you can either click the button or use Ctrl+R to reverse the text in the TextBox

// Reverses the string in txtBox

public void ReverseString_Executed( object sender,

// Checks whether there is a string in txtBox

public void ReverseString_CanExecute( object sender,

CanExecuteRoutedEventArgs args )

{

args.CanExecute = txtBox.Text.Length > 0;

}

Trang 6

Routing Commands

One thing you might have noticed in the code-behind was that you attached the code binding object to

the CommandBindings collection of the Window1 object This is perfectly fine and illustrates the routed part

of routed commands

When you click the Reverse button, this raises the Executed event WPF checks the target to see whether it has a command binding for the command If not, it routes the event up the element tree

trying to find an element with a binding for the command When it finds it, it invokes it Figure 9-17

illustrates the routing

Figure 9-17 Routed events are routed up the element tree

In determining where routing should start, WPF checks the command source to see whether

there is a CommandTarget set If so, it starts routing there If not, it starts at the element that currently has the focus

Figure 9-18 illustrates two situations where there are two TextBoxes at the same level, but the

CommandBinding is set in different places in the tree In both cases, the command source does not have a CommandTarget set In one arrangement, both TextBoxes will always find the CommandBinding In the other arrangement, one of the TextBoxes will not find it

Trang 7

Summary

In this chapter, you saw that WPF has greatly expanded the definition of how events are handled They

no longer just go to the element that raised them but are routed up and down the element tree, as bubbling events and tunneling events

You also saw that WPF provides a framework for creating and handling commands, giving a higher, more abstract model of processing events from different command sources such as buttons and input gestures

Trang 8

■ ■ ■

Other Controls and Elements

The TextBox Control

Trang 9

The TextBox Control

In Chapter 6, you learned about many of the most important WPF controls that present content In this chapter, you’ll learn about other controls and elements you’ll need to have a rich and smoothly

functioning application You’ll start with the TextBox control and continue to menus, toolbars, and miscellaneous other elements

The TextBox is designed for displaying small amounts of text to the user and allowing the user to enter small amounts of input text Figure 10-1 shows a window where the user has entered his name into the TextBox

Figure 10-1 The TextBox is useful for retrieving small bits of text from the user

The following are some important things to know about the TextBox:

TextWrapping property to true

Trang 10

The following is the markup that produces the content in the window shown in Figure 10-1

Notice the following about the markup:

well as in the Label’s binding (Chapter 6 describes how a Label can be bound to

another element, namely, by setting an accelerator key for the element.)

string in a message box

The code-behind is the following:

public partial class Window1 : Window

Trang 11

which is visible whenever the menu is visible

menu item

execute the handler whenever the user clicks the menu item

<Menu>

</Menu> ↑ ↑

The Header contains This assigns the

the menu label event handler

On the left of Figure 10-2 is a screenshot that shows a window containing this menu (The menu

in the figure is inside a StackPanel, which constrains its size.) The drawing on the right of the figure shows the menu’s structure

Figure 10-2 A menu consists of a single Menu object containing a list of MenuItem objects

Trang 12

As I stated earlier, the Menu object contains a set of MenuItem objects that comprise the top-level menu MenuItems, however, can contain nested MenuItems, which act as submenus The following markup shows two MenuItems contained in the content part of the first MenuItem:

<Menu>

Figure 10-3 “Submenus” are MenuItems nested in other MenuItems

The event handlers in this simple example just pop up message boxes The following is the

private void MenuItemNewGame_Click( object sender, RoutedEventArgs e )

{ MessageBox.Show( "Clicked New Game", "Menu Info" ); }

private void MenuItemExit_Click( object sender, RoutedEventArgs e )

{ MessageBox.Show( "Clicked Exit", "Menu Info" ); }

private void MenuItemHelp_Click( object sender, RoutedEventArgs e )

{ MessageBox.Show( "Clicked Help", "Menu Info" ); }

}

■ Remember Submenus are implemented as nested MenuItem s—not as nested Menus

Trang 13

Adorning the MenuItem

So far, the only thing you’ve seen on a menu is text The area occupied by a MenuItem, however, has space for other useful information as well, as shown in Figure 10-4

IsChecked property to true

unchecked and then change its value in the code-behind when appropriate

MenuItem by setting the MenuItem’s IsCheckable property to true With this set, you don’t have to programmatically set the value of IsChecked to true and false

property, it can be any type of image, not just an image of the icon type

You can also add text to the right of the menu label by assigning it to the InputGestureText property This is typically used to show keyboard shortcuts for the menu item Setting this text, however, doesn’t implement the functionality You must still hook up the shortcut code to the menu item yourself, which is a bit of work unless you use commands (You’ll learn more about this in a moment.)

Figure 10-4 You can set an image or a check mark to the left of the menu label and a string to the right of

the label

The following is the markup for the menu in Figure 10-4:

<Menu>

<MenuItem Header="New Game" Click="MenuItemNewGame_Click"

<MenuItem.Icon>

</MenuItem.Icon>

</MenuItem>

<MenuItem Header="Shuffle Sound" Click="MenuItemExit_Click"

IsChecked="True" InputGestureText="Alt+S"/> ← Set check and text

</MenuItem>

</Menu>

Trang 14

Định dạng
Số trang	42
Dung lượng	843,2 KB