();In the Loaded event of your window, fill the list of images and then set the Image control source to the first image in the list.<\/p>\n
private void MainWindow_OnLoaded( object sender, RoutedEventArgs e)
Next, implement the previous and next handlers to loop through the images. If the user gets to the end of the list, start them back at the beginning and vice versa.<\/p>\n
private void btnPreviousImage_Click( object sender, RoutedEventArgs e)
At this point, you can run your program and flip through each picture.<\/p>\n
Embedding Application Resources
Figure 28-2. Configuring the images to be embedded resources<\/p>\n
Now, using Visual Studio\u2019s Build menu, select the Clean Solution option to wipe out the current contents of \\bin\\Debug\\Images and then rebuild your project. Refresh Solution Explorer and observe the absence of data in your \\bin\\Debug\\Images directory. With the current build options, your graphical data is no longer copied to the output folder and is now embedded within the assembly itself. This ensures that the resources exist but also increases the size of your compiled assembly.
\/\/ Extract from the assembly and then load images
In this case, you no longer need to determine the installation path and can simply list the resources by name, which considers the name of the original subdirectory. Also notice, when you create your Uri objects, you specify a UriKind value of Relative. At this point, your executable is a stand-alone entity that can be run from any location on the machine because all the compiled data is within the binary.<\/p>\n
Working with Object (Logical) Resources
The worst thing you could do is to copy and paste the XAML to every control. Clearly, this would be a nightmare to maintain, as you would need to make numerous changes any time you wanted to tweak the look and feel of the brush.
The Role of the Resources Property
Defining Window-wide Resources
Now, click the OK button and set the Background color property to a custom brush type using the integrated Brushes editor (discussed in Chapter 27). After you have done so, notice how the brush is embedded within the scope of the and <\/Button> tags, as shown here:<\/p>\nTo allow the Cancel button to use this brush as well, you should promote the scope of your<\/p>\n
to a parent element\u2019s resource dictionary. For example, if you move it to the, both buttons can use the same brush because they are child elements of the layout manager. Even better, you could package the brush into the resource dictionary of the Window itself so the window\u2019s content can use it.Figure 28-3. Moving a complex object into a resource container<\/p>\n
You are asked to name your resource (myBrush) and specify where to place it. For this example, leave the default selection of the current document (see Figure 28-4).<\/p>\n
Figure 28-4. Naming the object resource<\/p>\n
When you are done, you will see the brush has been moved inside the Window.Resources tag.<\/p>\n
And the Button control\u2019s Background has been updated to use a new resource.<\/p>\n
The Create Resource Wizard creates the new resource as a DynamicResource. You will learn about
To see the benefit, update the Cancel Button\u2019s Background property to the same StaticResource, and you can see the reuse in action.<\/p>\n
The {StaticResource} Markup Extension
<\/p>\nNext, add the following code to the Ok_OnClick() event handler:<\/p>\n
private void Ok_OnClick(object sender, RoutedEventArgs e)
\u25a0Note you are using the Resources indexer to locate a resource by name here. Be aware, however, that this will throw a runtime exception if the resource cannot be found. you could also use the
When you run the program and click the OK Button, you see the gradients change appropriately. Now add the following code to the Cancel_OnClick() event handler:<\/p>\n
private void Cancel_OnClick(object sender, RoutedEventArgs e)
Run the program again, click the Cancel Button, and nothing happens!<\/p>\n
The {DynamicResource} Markup Extension
<\/p>\nThis time, when you click the Cancel Button, the background for the Cancel Button changes, but the background for the OK Button remains the same. This is because the {DynamicResource} markup extension can detect whether the underlying keyed object has been replaced with a new object. As you might guess,<\/p>\n
this requires some extra runtime infrastructure, so you should typically stick to using {StaticResource} unless you know you have an object resource that will be swapped with a different object at runtime and you want all items using that resource to be informed.<\/p>\n
Application-Level Resources scope and place it in the scope in your App.xaml file.Figure 28-5. Applying application-level resources<\/p>\n
\u25a0Note placing the resources at the application level and assigning it to a control\u2019s property will freeze the resource, preventing changing values at runtime. the resource can be cloned, and the clone can be updated.<\/p>\n
Defining Merged Resource Dictionaries
Figure 28-6. Inserting a new merged resource dictionary<\/p>\n
In the new MyBrushes.xaml file, cut the current resources in the Application.Resources scope and move them into your dictionary, like so:<\/p>\n
Even though this resource dictionary is part of your project, all resource dictionaries must be merged (typically at the application level) into an existing resource dictionary to be used. To do this, use the following format in the App.xaml file (note that multiple resource dictionaries can be merged by adding multiple elements within the scope):<\/p>\n<\/p>\nThe problem with this approach is that each resource file must be added to each project that needs the resources. A better approach for sharing resources is to define a .NET class library to share between projects, which you will do next.<\/p>\n
Defining a Resource-Only Assembly
Compile your User Control Library project. Now, merge these binary resources into the application- level resource dictionary of the ObjectResourcesApp project. Doing so, however, requires some rather funky syntax, shown here:<\/p>\n
First, be aware that this string is space sensitive. If you have extra whitespace around your semicolon or forward slashes, you will generate errors. The first part of the string is the friendly name of the external library (no file extension). After the semicolon, type in the word Component followed by the name of the compiled binary resource, which will be identical to the original XAML resource dictionary.
Understanding WPF\u2019s Animation Services
\u25a0Note Visual studio has no support for authoring animations using Gui animation tools. if you author an animation with Visual studio, you will do so by typing in the Xaml directly. however, Blend for Visual studio (the companion product that ships with Visual studio 2019) does indeed have a built-in animation editor that can simplify your life a good deal.<\/p>\n
The Role of the Animation Class Types
Now, obviously, these classes are not used to somehow provide an animation sequence directly to a variable of a particular data type (after all, how exactly could you animate the value \u201c9\u201d using an Int32Animation?).
The To, From, and By Properties). Again, given that there are so many underlying data types (colors, vectors, ints, strings, etc.) used to animated dependency properties, it would not be as clean a solution as you might expect (not to mention XAML has only limited support for generic types).<\/p>\nThe Role of the Timeline Base Class
Table 28-1. Key Members of the Timeline Base Class<\/p>\n
Properties Meaning in Life
Authoring an Animation in C# Code
<\/p>\nIn the code-behind file, import the System.Windows.Media.Animation namespace and add the following code in the window\u2019s C# code file:
\/\/ Now, animation the RotateTransform object.
}<\/p>\n
The first major task of this method is to configure a DoubleAnimation object, which will start at the value 0 and end at the value 360. Notice that you are handling the Completed event on this object as well, to toggle a class-level bool variable that is used to ensure that if an animation is currently being performed, you don\u2019t \u201creset\u201d it to start again.
private void btnSpinner_OnClick( object sender, RoutedEventArgs e)
Here, you are changing the Opacity property value to fade the button out of view. Currently, however, this is hard to do, as the button is spinning very fast! How, then, can you control the pace of an animation? Glad you asked.<\/p>\n
Controlling the Pace of an Animation
private void btnSpinner_MouseEnter( object sender, MouseEventArgs e)
\/\/ Make a double animation object, and register
\/\/ Button has four seconds to finish the spin!
...
With this adjustment, you should have a fighting chance of clicking the button while it is spinning, at which point it will fade away.<\/p>\n
\u25a0Note the BeginTime property of an Animation class also takes a TimeSpan object. recall that this property can be set to establish a wait time before starting an animation sequence.<\/p>\n
Reversing and Looping an Animation
private void btnSpinner_OnClick(object sender, RoutedEventArgs e)
If you would like to have an animation repeat some number of times (or to never stop once activated), you can do so using the RepeatBehavior property, which is common to all Animation classes. If you pass in a simple numerical value to the constructor, you can specify a hard-coded number of times to repeat.<\/p>\n
On the other hand, if you pass in a TimeSpan object to the constructor, you can establish an amount of time the animation should repeat. Finally, if you want an animation to loop ad infinitum, you can simply specify RepeatBehavior.Forever. Consider the following ways you could change the repeat behaviors of either of the DoubleAnimation objects used in this example:<\/p>\n
\/\/ Loop forever.
\/\/ Loop three times.
\/\/ Loop for 30 seconds.
That wraps up your investigation about how to animate aspects of an object using C# code and the WPF animation API. Next, you will learn how to do the same using XAML.<\/p>\n
Authoring Animations in XAML
\u25a0Note you will find a number of Xaml files in the XamlAnimations folder of the downloadable source code. as you go through the next several pages, copy these markup files into your custom Xaml editor or into the Kaxaml editor to see the results.<\/p>\n
For the most part, creating an animation is like what you saw already. You still configure an Animation object and associate it to an object\u2019s property. One big difference, however, is that WPF is not function call friendly. As a result, instead of calling BeginAnimation(), you use a storyboard as a layer of indirection.
<\/p>\nNow, let\u2019s break this example down, bit by bit.<\/p>\n
The Role of Storyboards element, which makes use of the same properties you set in procedural code (From, To, Duration, and RepeatBehavior).<\/p>\n<\/p>\nAs mentioned, Animation elements are placed within a element, which is used to map the animation object to a given property on the parent type via the TargetProperty property, which in this case is FontSize. A is always wrapped in a parent element named .<\/p>\nThe Role of Event Triggers element has been defined, you need to specify some sort of action that will cause the animation to begin executing. WPF has a few different ways to respond to runtime conditions in markup, one of which is termed a trigger. From a high level, you can consider a trigger a way of responding to an event condition in XAML, without the need for procedural code. is placed in the Label\u2019s trigger collection.<\/p>\n<\/p>\nLet\u2019s see another example of defining an animation in XAML, this time using a key frame animation.<\/p>\n
Animation Using Discrete Key Frames
First, notice that you have defined an event trigger for your button to ensure that your storyboard executes when the button has loaded into memory. The StringAnimationUsingKeyFrames class oversees changing the content of the button, via the Storyboard.TargetProperty value. element, you define four DiscreteStringKeyFrame elements, which change the button\u2019s Content property over the course of two seconds (note that the duration established by StringAnimationUsingKeyFrames is a total of three seconds, so you will see a slight pause between the final ! and looping O).Understanding the Role of WPF Styles
Defining and Applying a Style