mirror of
https://github.com/Stone-Red-Code/docs-desktop.git
synced 2026-09-06 07:56:06 +02:00
WPF publish initial content (#1032)
* Add overview article for new WPF (#178) * Remove previous WPF .NET 5 content * Overview article * New article: Create new WPF project (#183) * Basic index file * Finish article for new project. * acro * markdown fix * Fix build errors * fix code lang * fix code lang * Add differences article for WPF (#186) * Fix VS version for create app * Add differences article * Minor * fix overview styles code * Add code langs for overview * Port Window Overview WPF article (#1011) * Add Window overview article * Add TOC * Remove temp code * Fix headers * Port final Windows related articles (#1015) * Initial test commit * Add system dialogs * 75% complete * Add images * Fix linter * Add to toc * Add more howto * Fix code * Add get/set main window * Add missing code * Add to toc * Fix warnings * Fix warnings * missing code * Update see also * fix xref * Migrate wpf net core controls-styles articles (#1023) * Migrate control-styles * Fix links * Fix links * Port databinding article. (#1022) * Migrated databinding overview * update toc * Fix links/snippets * fix links * Move to correct folder * Port initial resources docs (#1026) * initial resources docs * Build errors * Update dotnet-desktop-guide/net/wpf/systems/xaml-resources-overview.md Co-authored-by: Genevieve Warren <[email protected]> * Apply suggestions from code review Co-authored-by: Genevieve Warren <[email protected]> * Feedback * Add app article * Add system article * Minor * meta * fix toc * Apply suggestions from code review Co-authored-by: Genevieve Warren <[email protected]> Co-authored-by: Genevieve Warren <[email protected]> * Add xaml article * reformat redirect * Redirects * WPF update XAML article (#1031) * convert snippets * minor edits * minor * Fix warnings * Fixes #1028 * Fixes #1028 * Apply suggestions from code review Co-authored-by: Genevieve Warren <[email protected]> * update redirects Co-authored-by: Genevieve Warren <[email protected]> * minor updates to link * Readd migration article * Warning fixes * Fix lint * Minor updates * Fix warnings for TOC/YML * last warnings Co-authored-by: Genevieve Warren <[email protected]>
This commit is contained in:
Andy (Steve) De George
co-authored by
Genevieve Warren
Genevieve Warren
parent
a3b012ae99
commit
ea8529f082
@@ -0,0 +1,107 @@
|
||||
---
|
||||
title: How to create a style for a control
|
||||
description: Learn how to create and reference a control style in Windows Presentation Foundation and .NET.
|
||||
author: adegeo
|
||||
ms.author: adegeo
|
||||
ms.date: 04/15/2021
|
||||
ms.topic: conceptual
|
||||
dev_langs:
|
||||
- "csharp"
|
||||
- "vb"
|
||||
#no-loc: [TextBlock, Setter]
|
||||
---
|
||||
|
||||
# How to create a style for a control (WPF .NET)
|
||||
|
||||
With Windows Presentation Foundation (WPF), you can customize an existing control's appearance with your own reusable style. Styles can be applied globally to your app, windows and pages, or directly to controls.
|
||||
|
||||
[!INCLUDE [desktop guide under construction](../../includes/desktop-guide-preview-note.md)]
|
||||
|
||||
## Create a style
|
||||
|
||||
You can think of a <xref:System.Windows.Style> as a convenient way to apply a set of property values to one or more elements. You can use a style on any element that derives from <xref:System.Windows.FrameworkElement> or <xref:System.Windows.FrameworkContentElement> such as a <xref:System.Windows.Window> or a <xref:System.Windows.Controls.Button>.
|
||||
|
||||
The most common way to declare a style is as a resource in the `Resources` section in a XAML file. Because styles are resources, they obey the same scoping rules that apply to all resources. Put simply, where you declare a style affects where the style can be applied. For example, if you declare the style in the root element of your app definition XAML file, the style can be used anywhere in your app.
|
||||
|
||||
:::code language="xaml" source="./snippets/how-to-create-apply-style/csharp/App.xaml" id="AppResources":::
|
||||
|
||||
If you declare the style in one of the app's XAML files, the style can be used only in that XAML file. For more information about scoping rules for resources, see [Overview of XAML resources](../systems/xaml-resources-overview.md).
|
||||
|
||||
:::code language="xaml" source="./snippets/how-to-create-apply-style/csharp/WindowSingleResource.xaml" id="WindowResources":::
|
||||
|
||||
A style is made up of `<Setter>` child elements that set properties on the elements the style is applied to. In the example above, notice that the style is set to apply to `TextBlock` types through the `TargetType` attribute. The style will set the <xref:System.Windows.Controls.Control.FontSize%2A> to `15` and the <xref:System.Windows.Controls.Control.FontWeight%2A> to `ExtraBold`. Add a `<Setter>` for each property the style changes.
|
||||
|
||||
## Apply a style implicitly
|
||||
|
||||
A <xref:System.Windows.Style> is a convenient way to apply a set of property values to more than one element. For example, consider the following <xref:System.Windows.Controls.TextBlock> elements and their default appearance in a window.
|
||||
|
||||
:::code language="xaml" source="./snippets/how-to-create-apply-style/csharp/Window1.xaml" id="SnippetTextBlocks":::
|
||||
|
||||
:::image type="content" source="./media/how-to-create-apply-style/stylingintro-textblocksbefore.png" alt-text="Styling sample screenshot before":::
|
||||
|
||||
You can change the default appearance by setting properties, such as <xref:System.Windows.Controls.Control.FontSize%2A> and <xref:System.Windows.Controls.Control.FontFamily%2A>, on each <xref:System.Windows.Controls.TextBlock> element directly. However, if you want your <xref:System.Windows.Controls.TextBlock> elements to share some properties, you can create a <xref:System.Windows.Style> in the `Resources` section of your XAML file, as shown here.
|
||||
|
||||
:::code language="xaml" source="./snippets/how-to-create-apply-style/csharp/Window1.xaml" id="SnippetDefaultTextBlockStyle":::
|
||||
|
||||
When you set the <xref:System.Windows.Style.TargetType%2A> of your style to the <xref:System.Windows.Controls.TextBlock> type and omit the `x:Key` attribute, the style is applied to all the <xref:System.Windows.Controls.TextBlock> elements scoped to the style, which is generally the XAML file itself.
|
||||
|
||||
Now the <xref:System.Windows.Controls.TextBlock> elements appear as follows.
|
||||
|
||||
:::image type="content" source="./media/how-to-create-apply-style/stylingintro-textblocksbasestyle.png" alt-text="Styling sample screenshot base style":::
|
||||
|
||||
## Apply a style explicitly
|
||||
|
||||
If you add an `x:Key` attribute with value to the style, the style is no longer implicitly applied to all elements of <xref:System.Windows.Style.TargetType%2A>. Only elements that explicitly reference the style will have the style applied to them.
|
||||
|
||||
Here is the style from the previous section, but declared with the `x:Key` attribute.
|
||||
|
||||
:::code language="xaml" source="./snippets/how-to-create-apply-style/csharp/WindowExplicitStyle.xaml" id="ExplicitStyleDeclare":::
|
||||
|
||||
To apply the style, set the <xref:System.Windows.FrameworkElement.Style%2A> property on the element to the `x:Key` value, using a [StaticResource markup extension](../../../framework/wpf/advanced/staticresource-markup-extension.md), as shown here.
|
||||
|
||||
:::code language="xaml" source="./snippets/how-to-create-apply-style/csharp/WindowExplicitStyle.xaml" id="ExplicitStyleReference":::
|
||||
|
||||
Notice that the first <xref:System.Windows.Controls.TextBlock> element has the style applied to it while the second TextBlock element remains unchanged. The implicit style from the previous section was changed to a style that declared the `x:Key` attribute, meaning, the only element affected by the style is the one that referenced the style directly.
|
||||
|
||||
:::image type="content" source="./media/how-to-create-apply-style/create-a-style-explicit-textblock.png" alt-text="Styling sample screenshot textblock":::
|
||||
|
||||
Once a style is applied, explicitly or implicitly, it becomes sealed and can't be changed. If you want to change a style that has been applied, create a new style to replace the existing one. For more information, see the <xref:System.Windows.Style.IsSealed%2A> property.
|
||||
|
||||
You can create an object that chooses a style to apply based on custom logic. For an example, see the example provided for the <xref:System.Windows.Controls.StyleSelector> class.
|
||||
|
||||
## Apply a style programmatically
|
||||
|
||||
To assign a named style to an element programmatically, get the style from the resources collection and assign it to the element's <xref:System.Windows.FrameworkElement.Style%2A> property. The items in a resources collection are of type <xref:System.Object>. Therefore, you must cast the retrieved style to a <xref:System.Windows.Style?displayProperty=fullName> before assigning it to the `Style` property. For example, the following code sets the style of a `TextBlock` named `textblock1` to the defined style `TitleText`.
|
||||
|
||||
:::code language="csharp" source="./snippets/how-to-create-apply-style/csharp/Window2.xaml.cs" id="SnippetSetStyleCode":::
|
||||
:::code language="vb" source="./snippets/how-to-create-apply-style/vb/MainWindow.xaml.vb" id="SnippetSetStyleCode":::
|
||||
|
||||
## Extend a style
|
||||
|
||||
Perhaps you want your two <xref:System.Windows.Controls.TextBlock> elements to share some property values, such as the <xref:System.Windows.Controls.Control.FontFamily%2A> and the centered <xref:System.Windows.FrameworkElement.HorizontalAlignment%2A>. But you also want the text **My Pictures** to have some additional properties. You can do that by creating a new style that is based on the first style, as shown here.
|
||||
|
||||
:::code language="xaml" source="./snippets/how-to-create-apply-style/csharp/Window2.xaml" id="SnippetDefaultTextBlockStyleBasedOn":::
|
||||
|
||||
:::code language="xaml" source="./snippets/how-to-create-apply-style/csharp/Window2.xaml" id="SnippetTextBlocksExplicit":::
|
||||
|
||||
This `TextBlock` style is now centered, uses a `Comic Sans MS` font with a size of `26`, and the foreground color set to the <xref:System.Windows.Media.LinearGradientBrush> shown in the example. Notice that it overrides the <xref:System.Windows.Controls.Control.FontSize%2A> value of the base style. If there's more than one <xref:System.Windows.Setter> pointing to the same property in a <xref:System.Windows.Style>, the `Setter` that is declared last takes precedence.
|
||||
|
||||
The following shows what the <xref:System.Windows.Controls.TextBlock> elements now look like:
|
||||
|
||||
:::image type="content" source="./media/how-to-create-apply-style/stylingintro-textblocks.png" alt-text="Styled TextBlocks":::
|
||||
|
||||
This `TitleText` style extends the style that has been created for the <xref:System.Windows.Controls.TextBlock> type, referenced with `BasedOn="{StaticResource {x:Type TextBlock}}"`. You can also extend a style that has an `x:Key` by using the `x:Key` of the style. For example, if there was a style named `Header1` and you wanted to extend that style, you would use `BasedOn="{StaticResource Header1}"`.
|
||||
|
||||
## Relationship of the TargetType property and the x:Key attribute
|
||||
|
||||
As previously shown, setting the <xref:System.Windows.Style.TargetType%2A> property to `TextBlock` without assigning the style an `x:Key` causes the style to be applied to all <xref:System.Windows.Controls.TextBlock> elements. In this case, the `x:Key` is implicitly set to `{x:Type TextBlock}`. This means that if you explicitly set the `x:Key` value to anything other than `{x:Type TextBlock}`, the <xref:System.Windows.Style> isn't applied to all `TextBlock` elements automatically. Instead, you must apply the style (by using the `x:Key` value) to the `TextBlock` elements explicitly. If your style is in the resources section and you don't set the `TargetType` property on your style, then you must set the `x:Key` attribute.
|
||||
|
||||
In addition to providing a default value for the `x:Key`, the `TargetType` property specifies the type to which setter properties apply. If you don't specify a `TargetType`, you must qualify the properties in your <xref:System.Windows.Setter> objects with a class name by using the syntax `Property="ClassName.Property"`. For example, instead of setting `Property="FontSize"`, you must set <xref:System.Windows.Setter.Property%2A> to `"TextBlock.FontSize"` or `"Control.FontSize"`.
|
||||
|
||||
Also note that many WPF controls consist of a combination of other WPF controls. If you create a style that applies to all controls of a type, you might get unexpected results. For example, if you create a style that targets the <xref:System.Windows.Controls.TextBlock> type in a <xref:System.Windows.Window>, the style is applied to all `TextBlock` controls in the window, even if the `TextBlock` is part of another control, such as a <xref:System.Windows.Controls.ListBox>.
|
||||
|
||||
## See also
|
||||
|
||||
- [How to create a template for a control](how-to-create-apply-template.md)
|
||||
- [Overview of XAML resources](../systems/xaml-resources-overview.md)
|
||||
- [XAML overview](../xaml/index.md)
|
||||
@@ -0,0 +1,187 @@
|
||||
---
|
||||
title: How to create a template
|
||||
description: Learn how to create and reference a control template in Windows Presentation Foundation and .NET Core.
|
||||
author: adegeo
|
||||
ms.author: adegeo
|
||||
ms.date: 04/15/2021
|
||||
no-loc: ["<Window>", "<ControlTemplate>", "<Ellipse>", "<ContentPresenter>", "<Trigger>", "<Setter>", "<PropertyTrigger>", "<Grid>", "<VisualStateManager.VisualStateGroups>", "<VisualStateGroup>", "<VisualState>", "<Storyboard>", "SizeToContent", "MinWidth", "TargetType", "Title"]
|
||||
ms.topic: how-to
|
||||
helpviewer_keywords:
|
||||
- "control contract [WPF]"
|
||||
- "controls [WPF], visual structure changes"
|
||||
- "ControlTemplate [WPF], customizing for existing controls"
|
||||
- "skinning controls [WPF]"
|
||||
- "controls [WPF], appearance specified by state"
|
||||
- "templates [WPF], custom for existing controls"
|
||||
---
|
||||
|
||||
# How to create a template for a control (WPF.NET)
|
||||
|
||||
With Windows Presentation Foundation (WPF), you can customize an existing control's visual structure and behavior with your own reusable template. Templates can be applied globally to your application, windows and pages, or directly to controls. Most scenarios that require you to create a new control can be covered by instead creating a new template for an existing control.
|
||||
|
||||
[!INCLUDE [desktop guide under construction](../../includes/desktop-guide-preview-note.md)]
|
||||
|
||||
In this article, you'll explore creating a new <xref:System.Windows.Controls.ControlTemplate> for the <xref:System.Windows.Controls.Button> control.
|
||||
|
||||
## When to create a ControlTemplate
|
||||
|
||||
Controls have many properties, such as <xref:System.Windows.Controls.Border.Background%2A>, <xref:System.Windows.Controls.Control.Foreground%2A>, and <xref:System.Windows.Controls.Control.FontFamily%2A>. These properties control different aspects of the control's appearance, but the changes that you can make by setting these properties are limited. For example, you can set the <xref:System.Windows.Controls.Control.Foreground%2A> property to blue and <xref:System.Windows.Controls.Control.FontStyle%2A> to italic on a <xref:System.Windows.Controls.CheckBox>. When you want to customize the control's appearance beyond what setting the other properties on the control can do, you create a <xref:System.Windows.Controls.ControlTemplate>.
|
||||
|
||||
In most user interfaces, a button has the same general appearance: a rectangle with some text. If you wanted to create a rounded button, you could create a new control that inherits from the button or recreates the functionality of the button. In addition, the new user control would provide the circular visual.
|
||||
|
||||
You can avoid creating new controls by customizing the visual layout of an existing control. With a rounded button, you create a <xref:System.Windows.Controls.ControlTemplate> with the desired visual layout.
|
||||
|
||||
On the other hand, if you need a control with new functionality, different properties, and new settings, you would create a new <xref:System.Windows.Controls.UserControl>.
|
||||
|
||||
## Prerequisites
|
||||
|
||||
Create a new WPF application and in *MainWindow.xaml* (or another window of your choice) set the following properties on the **\<Window>** element:
|
||||
|
||||
| Property | Value |
|
||||
|-------------------|-------------------------|
|
||||
| **Title** | `Template Intro Sample` |
|
||||
| **SizeToContent** | `WidthAndHeight` |
|
||||
| **MinWidth** | `250` |
|
||||
|
||||
Set the content of the **\<Window>** element to the following XAML:
|
||||
|
||||
:::code language="xaml" source="./snippets/how-to-create-apply-template/csharp/Window1.xaml" id="Initial":::
|
||||
|
||||
In the end, the *MainWindow.xaml* file should look similar to the following:
|
||||
|
||||
:::code language="xaml" source="./snippets/how-to-create-apply-template/csharp/Window1.xaml" id="InitialWhole":::
|
||||
|
||||
If you run the application, it looks like the following:
|
||||
|
||||
:::image type="content" source="media/how-to-create-apply-template/unstyled-button.png" alt-text="WPF window with two unstyled buttons":::
|
||||
|
||||
## Create a ControlTemplate
|
||||
|
||||
The most common way to declare a <xref:System.Windows.Controls.ControlTemplate> is as a resource in the `Resources` section in a XAML file. Because templates are resources, they obey the same scoping rules that apply to all resources. Put simply, where you declare a template affects where the template can be applied. For example, if you declare the template in the root element of your application definition XAML file, the template can be used anywhere in your application. If you define the template in a window, only the controls in that window can use the template.
|
||||
|
||||
To start with, add a `Window.Resources` element to your *MainWindow.xaml* file:
|
||||
|
||||
:::code language="xaml" source="./snippets/how-to-create-apply-template/csharp/Window2.xaml" id="WindowResStart":::
|
||||
|
||||
Create a new **\<ControlTemplate>** with the following properties set:
|
||||
|
||||
| Property | Value |
|
||||
|----------------|---------------|
|
||||
| **x:Key** | `roundbutton` |
|
||||
| **TargetType** | `Button` |
|
||||
|
||||
This control template will be simple:
|
||||
|
||||
- a root element for the control, a <xref:System.Windows.Controls.Grid>
|
||||
- an <xref:System.Windows.Shapes.Ellipse> to draw the rounded appearance of the button
|
||||
- a <xref:System.Windows.Controls.ContentPresenter> to display the user-specified button content
|
||||
|
||||
:::code language="xaml" source="./snippets/how-to-create-apply-template/csharp/Window3.xaml" id="ControlTemplate":::
|
||||
|
||||
### TemplateBinding
|
||||
|
||||
When you create a new <xref:System.Windows.Controls.ControlTemplate>, you still might want to use the public properties to change the control's appearance. The [TemplateBinding](../../../framework/wpf/advanced/templatebinding-markup-extension.md) markup extension binds a property of an element that is in the <xref:System.Windows.Controls.ControlTemplate> to a public property that is defined by the control. When you use a [TemplateBinding](../../../framework/wpf/advanced/templatebinding-markup-extension.md), you enable properties on the control to act as parameters to the template. That is, when a property on a control is set, that value is passed on to the element that has the [TemplateBinding](../../../framework/wpf/advanced/templatebinding-markup-extension.md) on it.
|
||||
|
||||
### Ellipse
|
||||
|
||||
Notice that the **:::no-loc text="Fill":::** and **:::no-loc text="Stroke":::** properties of the **\<Ellipse>** element are bound to the control's <xref:System.Windows.Controls.Control.Foreground> and <xref:System.Windows.Controls.Control.Background> properties.
|
||||
|
||||
### ContentPresenter
|
||||
|
||||
A [\<ContentPresenter>](xref:System.Windows.Controls.ContentPresenter) element is also added to the template. Because this template is designed for a button, take into consideration that the button inherits from <xref:System.Windows.Controls.ContentControl>. The button presents the content of the element. You can set anything inside of the button, such as plain text or even another control. Both of the following are valid buttons:
|
||||
|
||||
```xaml
|
||||
<Button>My Text</Button>
|
||||
|
||||
<!-- and -->
|
||||
|
||||
<Button>
|
||||
<CheckBox>Checkbox in a button</CheckBox>
|
||||
</Button>
|
||||
```
|
||||
|
||||
In both of the previous examples, the text and the checkbox are set as the [Button.Content](xref:System.Windows.Controls.ContentControl.Content) property. Whatever is set as the content can be presented through a **\<ContentPresenter>**, which is what the template does.
|
||||
|
||||
If the <xref:System.Windows.Controls.ControlTemplate> is applied to a <xref:System.Windows.Controls.ContentControl> type, such as a `Button`, a <xref:System.Windows.Controls.ContentPresenter> is searched for in the element tree. If the `ContentPresenter` is found, the template automatically binds the control's <xref:System.Windows.Controls.ContentControl.Content> property to the `ContentPresenter`.
|
||||
|
||||
## Use the template
|
||||
|
||||
Find the buttons that were declared at the start of this article.
|
||||
|
||||
:::code language="xaml" source="./snippets/how-to-create-apply-template/csharp/Window1.xaml" id="Initial":::
|
||||
|
||||
Set the second button's <xref:System.Windows.Controls.Control.Template> property to the `roundbutton` resource:
|
||||
|
||||
:::code language="xaml" source="./snippets/how-to-create-apply-template/csharp/Window3.xaml" id="StyledButton":::
|
||||
|
||||
If you run the project and look at the result, you'll see that the button has a rounded background.
|
||||
|
||||
:::image type="content" source="media/how-to-create-apply-template/styled-button.png" alt-text="WPF window with one template oval button":::
|
||||
|
||||
You may have noticed that the button isn't a circle but is skewed. Because of the way the **\<Ellipse>** element works, it always expands to fill the available space. Make the circle uniform by changing the button's **:::no-loc text="width":::** and **:::no-loc text="height":::** properties to the same value:
|
||||
|
||||
:::code language="xaml" source="./snippets/how-to-create-apply-template/csharp/Window3.xaml" id="StyledButtonSize":::
|
||||
|
||||
:::image type="content" source="media/how-to-create-apply-template/styled-uniform-button.png" alt-text="WPF window with one template circular button":::
|
||||
|
||||
## Add a Trigger
|
||||
|
||||
Even though a button with a template applied looks different, it behaves the same as any other button. If you press the button, the <xref:System.Windows.Controls.Primitives.ButtonBase.Click> event fires. However, you may have noticed that when you move your mouse over the button, the button's visuals don't change. These visual interactions are all defined by the template.
|
||||
|
||||
With the dynamic event and property systems that WPF provides, you can watch a specific property for a value and then restyle the template when appropriate. In this example, you'll watch the button's <xref:System.Windows.UIElement.IsMouseOver> property. When the mouse is over the control, style the **\<Ellipse>** with a new color. This type of trigger is known as a *PropertyTrigger*.
|
||||
|
||||
For this to work, you'll need to add a name to the **\<Ellipse>** that you can reference. Give it the name of **backgroundElement**.
|
||||
|
||||
:::code language="xaml" source="./snippets/how-to-create-apply-template/csharp/Window4.xaml" id="EllipseName":::
|
||||
|
||||
Next, add a new <xref:System.Windows.Trigger> to the [ControlTemplate.Triggers](xref:System.Windows.Controls.ControlTemplate.Triggers) collection. The trigger will watch the `IsMouseOver` event for the value `true`.
|
||||
|
||||
[!code-xaml[ControlTemplate](./snippets/how-to-create-apply-template/csharp/Window4.xaml?name=ControlTemplate&highlight=6-10)]
|
||||
|
||||
Next, add a **\<Setter>** to the **\<Trigger>** that changes the **Fill** property of the **\<Ellipse>** to a new color.
|
||||
|
||||
:::code language="xaml" source="./snippets/how-to-create-apply-template/csharp/Window5.xaml" id="MouseOver":::
|
||||
|
||||
Run the project. Notice that when you move the mouse over the button, the color of the **\<Ellipse>** changes.
|
||||
|
||||
:::image type="content" source="media/how-to-create-apply-template/mouse-move-over-button.gif" alt-text="mouse moves over WPF button to change the fill color":::
|
||||
|
||||
## Use a VisualState
|
||||
|
||||
Visual states are defined and triggered by a control. For example, when the mouse is moved on top of the control, the `CommonStates.MouseOver` state is triggered. You can animate property changes based on the current state of the control. In the previous section, a **\<PropertyTrigger>** was used to change the foreground of the button to `AliceBlue` when the `IsMouseOver` property was `true`. Instead, create a visual state that animates the change of this color, providing a smooth transition. For more information about *VisualStates*, see [Styles and templates in WPF](styles-templates-overview.md#visual-states).
|
||||
|
||||
To convert the **\<PropertyTrigger>** to an animated visual state, First, remove the **\<ControlTemplate.Triggers>** element from your template.
|
||||
|
||||
:::code language="xaml" source="./snippets/how-to-create-apply-template/csharp/Window5.xaml" id="CleanTemplate":::
|
||||
|
||||
Next, in the **\<Grid>** root of the control template, add the **\<VisualStateManager.VisualStateGroups>** element with a **\<VisualStateGroup>** for `CommonStates`. Define two states, `Normal` and `MouseOver`.
|
||||
|
||||
:::code language="xaml" source="./snippets/how-to-create-apply-template/csharp/Window6.xaml" id="VisualState":::
|
||||
|
||||
Any animations defined in a **\<VisualState>** are applied when that state is triggered. Create animations for each state. Animations are put inside of a **\<Storyboard>** element. For more information about storyboards, see [Storyboards Overview](../../../framework/wpf/graphics-multimedia/storyboards-overview.md).
|
||||
|
||||
- Normal
|
||||
|
||||
This state animates the ellipse fill, restoring it to the control's `Background` color.
|
||||
|
||||
:::code language="xaml" source="./snippets/how-to-create-apply-template/csharp/Window6.xaml" id="NormalState":::
|
||||
|
||||
- MouseOver
|
||||
|
||||
This state animates the ellipse `Background` color to a new color: `Yellow`.
|
||||
|
||||
:::code language="xaml" source="./snippets/how-to-create-apply-template/csharp/Window6.xaml" id="MouseOverState":::
|
||||
|
||||
The **\<ControlTemplate>** should now look like the following.
|
||||
|
||||
:::code language="xaml" source="./snippets/how-to-create-apply-template/csharp/Window7.xaml" id="FinalTemplate":::
|
||||
|
||||
Run the project. Notice that when you move the mouse over the button, the color of the **\<Ellipse>** animates.
|
||||
|
||||
:::image type="content" source="media/how-to-create-apply-template/mouse-move-over-button-visualstate.gif" alt-text="mouse moves over WPF button to change the fill color with a visual state":::
|
||||
|
||||
## Next steps
|
||||
|
||||
- [Create a style for a control](how-to-create-apply-style.md)
|
||||
- [Styles and templates](styles-templates-overview.md)
|
||||
- [Overview of XAML resources](../systems/xaml-resources-overview.md)
|
||||
BIN
Binary file not shown.
|
After Width: | Height: | Size: 2.6 KiB |
BIN
Binary file not shown.
|
After Width: | Height: | Size: 5.1 KiB |
BIN
Binary file not shown.
|
After Width: | Height: | Size: 2.8 KiB |
BIN
Binary file not shown.
|
After Width: | Height: | Size: 2.4 KiB |
BIN
Binary file not shown.
|
After Width: | Height: | Size: 92 KiB |
BIN
Binary file not shown.
|
After Width: | Height: | Size: 86 KiB |
BIN
Binary file not shown.
|
After Width: | Height: | Size: 3.8 KiB |
BIN
Binary file not shown.
|
After Width: | Height: | Size: 4.3 KiB |
BIN
Binary file not shown.
|
After Width: | Height: | Size: 2.5 KiB |
BIN
Binary file not shown.
|
After Width: | Height: | Size: 86 KiB |
BIN
Binary file not shown.
|
After Width: | Height: | Size: 20 KiB |
BIN
Binary file not shown.
|
After Width: | Height: | Size: 298 KiB |
BIN
Binary file not shown.
|
After Width: | Height: | Size: 5.1 KiB |
BIN
Binary file not shown.
|
After Width: | Height: | Size: 78 KiB |
+14
@@ -0,0 +1,14 @@
|
||||
// // Copyright (c) Microsoft. All rights reserved.
|
||||
// // Licensed under the MIT license. See LICENSE file in the project root for full license information.
|
||||
|
||||
using System.Windows;
|
||||
|
||||
namespace IntroToStylingAndTemplating
|
||||
{
|
||||
/// <summary>
|
||||
/// Interaction logic for App.xaml
|
||||
/// </summary>
|
||||
public partial class App : Application
|
||||
{
|
||||
}
|
||||
}
|
||||
+18
@@ -0,0 +1,18 @@
|
||||
<!--<AppResources>-->
|
||||
<Application x:Class="IntroToStylingAndTemplating.App"
|
||||
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
|
||||
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
|
||||
xmlns:local="clr-namespace:IntroToStylingAndTemplating"
|
||||
StartupUri="WindowExplicitStyle.xaml">
|
||||
<Application.Resources>
|
||||
<ResourceDictionary>
|
||||
|
||||
<Style x:Key="Header1" TargetType="TextBlock">
|
||||
<Setter Property="FontSize" Value="15" />
|
||||
<Setter Property="FontWeight" Value="ExtraBold" />
|
||||
</Style>
|
||||
|
||||
</ResourceDictionary>
|
||||
</Application.Resources>
|
||||
</Application>
|
||||
<!--</AppResources>-->
|
||||
+29
@@ -0,0 +1,29 @@
|
||||
<Project Sdk="Microsoft.NET.Sdk">
|
||||
|
||||
<PropertyGroup>
|
||||
<OutputType>WinExe</OutputType>
|
||||
<TargetFramework>net5.0-windows</TargetFramework>
|
||||
<RootNamespace>IntroToStylingAndTemplating</RootNamespace>
|
||||
<UseWpf>true</UseWpf>
|
||||
<AssemblyName>IntroToStylingAndTemplating</AssemblyName>
|
||||
</PropertyGroup>
|
||||
|
||||
<ItemGroup>
|
||||
<None Include="images\flower1.jpg">
|
||||
<CopyToOutputDirectory>Always</CopyToOutputDirectory>
|
||||
</None>
|
||||
<None Include="images\flower2.jpg">
|
||||
<CopyToOutputDirectory>Always</CopyToOutputDirectory>
|
||||
</None>
|
||||
<None Include="images\leaf1.jpg">
|
||||
<CopyToOutputDirectory>Always</CopyToOutputDirectory>
|
||||
</None>
|
||||
<None Include="images\leaf2.jpg">
|
||||
<CopyToOutputDirectory>Always</CopyToOutputDirectory>
|
||||
</None>
|
||||
<None Include="images\winter1.jpg">
|
||||
<CopyToOutputDirectory>Always</CopyToOutputDirectory>
|
||||
</None>
|
||||
</ItemGroup>
|
||||
|
||||
</Project>
|
||||
+27
@@ -0,0 +1,27 @@
|
||||
// // Copyright (c) Microsoft. All rights reserved.
|
||||
// // Licensed under the MIT license. See LICENSE file in the project root for full license information.
|
||||
|
||||
using System.Windows;
|
||||
using System.Windows.Data;
|
||||
|
||||
namespace IntroToStylingAndTemplating
|
||||
{
|
||||
/// <summary>
|
||||
/// Interaction logic for MainWindow.xaml
|
||||
/// </summary>
|
||||
public partial class MainWindow : Window
|
||||
{
|
||||
private PhotoList _photos;
|
||||
|
||||
public MainWindow()
|
||||
{
|
||||
InitializeComponent();
|
||||
}
|
||||
|
||||
private void WindowLoaded(object sender, RoutedEventArgs e)
|
||||
{
|
||||
_photos = (PhotoList) (Resources["MyPhotos"] as ObjectDataProvider).Data;
|
||||
_photos.Path = "images";
|
||||
}
|
||||
}
|
||||
}
|
||||
+106
@@ -0,0 +1,106 @@
|
||||
<Window x:Class="IntroToStylingAndTemplating.MainWindow"
|
||||
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
|
||||
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
|
||||
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
|
||||
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
|
||||
xmlns:local="clr-namespace:IntroToStylingAndTemplating"
|
||||
mc:Ignorable="d"
|
||||
Title="Style Intro Sample" Loaded="WindowLoaded" SizeToContent="WidthAndHeight">
|
||||
<Window.Resources>
|
||||
<ObjectDataProvider x:Key="MyPhotos" ObjectType="{x:Type local:PhotoList}"/>
|
||||
|
||||
<!--A Style that affects all TextBlocks-->
|
||||
<Style TargetType="TextBlock">
|
||||
<Setter Property="HorizontalAlignment" Value="Center" />
|
||||
<Setter Property="FontFamily" Value="Comic Sans MS"/>
|
||||
<Setter Property="FontSize" Value="14"/>
|
||||
</Style>
|
||||
|
||||
<!--A Style that extends the previous TextBlock Style-->
|
||||
<!--This is a "named style" with an x:Key of TitleText-->
|
||||
<Style BasedOn="{StaticResource {x:Type TextBlock}}"
|
||||
TargetType="TextBlock"
|
||||
x:Key="TitleText">
|
||||
<Setter Property="FontSize" Value="26"/>
|
||||
<Setter Property="Foreground">
|
||||
<Setter.Value>
|
||||
<LinearGradientBrush StartPoint="0.5,0" EndPoint="0.5,1">
|
||||
<LinearGradientBrush.GradientStops>
|
||||
<GradientStop Offset="0.0" Color="#90DDDD" />
|
||||
<GradientStop Offset="1.0" Color="#5BFFFF" />
|
||||
</LinearGradientBrush.GradientStops>
|
||||
</LinearGradientBrush>
|
||||
</Setter.Value>
|
||||
</Setter>
|
||||
</Style>
|
||||
|
||||
<!--Horizontal ListBox Control Template-->
|
||||
<Style TargetType="ListBox">
|
||||
<Setter Property="Template">
|
||||
<Setter.Value>
|
||||
<ControlTemplate TargetType="ListBox">
|
||||
<Border CornerRadius="5" Background="{TemplateBinding ListBox.Background}">
|
||||
<ScrollViewer HorizontalScrollBarVisibility="Auto">
|
||||
<StackPanel Orientation="Horizontal"
|
||||
VerticalAlignment="Center"
|
||||
HorizontalAlignment="Center"
|
||||
IsItemsHost="True"/>
|
||||
</ScrollViewer>
|
||||
</Border>
|
||||
</ControlTemplate>
|
||||
</Setter.Value>
|
||||
</Setter>
|
||||
</Style>
|
||||
|
||||
<!--DataTemplate to display Photos as images
|
||||
instead of text strings of Paths-->
|
||||
<DataTemplate DataType="{x:Type local:Photo}">
|
||||
<Border Margin="3">
|
||||
<Image Source="{Binding Source}"/>
|
||||
</Border>
|
||||
</DataTemplate>
|
||||
|
||||
<Style TargetType="ListBoxItem">
|
||||
<Setter Property="Opacity" Value="0.5" />
|
||||
<Setter Property="MaxHeight" Value="75" />
|
||||
<Style.Triggers>
|
||||
<Trigger Property="IsSelected" Value="True">
|
||||
<Trigger.Setters>
|
||||
<Setter Property="Opacity" Value="1.0" />
|
||||
</Trigger.Setters>
|
||||
</Trigger>
|
||||
<EventTrigger RoutedEvent="Mouse.MouseEnter">
|
||||
<EventTrigger.Actions>
|
||||
<BeginStoryboard>
|
||||
<Storyboard>
|
||||
<DoubleAnimation
|
||||
Duration="0:0:0.2"
|
||||
Storyboard.TargetProperty="MaxHeight"
|
||||
To="90" />
|
||||
</Storyboard>
|
||||
</BeginStoryboard>
|
||||
</EventTrigger.Actions>
|
||||
</EventTrigger>
|
||||
<EventTrigger RoutedEvent="Mouse.MouseLeave">
|
||||
<EventTrigger.Actions>
|
||||
<BeginStoryboard>
|
||||
<Storyboard>
|
||||
<DoubleAnimation
|
||||
Duration="0:0:1"
|
||||
Storyboard.TargetProperty="MaxHeight" />
|
||||
</Storyboard>
|
||||
</BeginStoryboard>
|
||||
</EventTrigger.Actions>
|
||||
</EventTrigger>
|
||||
</Style.Triggers>
|
||||
</Style>
|
||||
|
||||
</Window.Resources>
|
||||
<StackPanel Margin="10">
|
||||
<TextBlock Style="{StaticResource TitleText}" Name="textblock1">My Pictures</TextBlock>
|
||||
<TextBlock>Check out my new pictures!</TextBlock>
|
||||
|
||||
<ListBox ItemsSource="{Binding Source={StaticResource MyPhotos}}"
|
||||
Background="Silver" Width="600" Margin="10" SelectedIndex="0"/>
|
||||
</StackPanel>
|
||||
</Window>
|
||||
+19
@@ -0,0 +1,19 @@
|
||||
// // Copyright (c) Microsoft. All rights reserved.
|
||||
// // Licensed under the MIT license. See LICENSE file in the project root for full license information.
|
||||
|
||||
namespace IntroToStylingAndTemplating
|
||||
{
|
||||
// <PhotoClass>
|
||||
public class Photo
|
||||
{
|
||||
public Photo(string path)
|
||||
{
|
||||
Source = path;
|
||||
}
|
||||
|
||||
public string Source { get; }
|
||||
|
||||
public override string ToString() => Source;
|
||||
}
|
||||
// </PhotoClass>
|
||||
}
|
||||
+55
@@ -0,0 +1,55 @@
|
||||
// // Copyright (c) Microsoft. All rights reserved.
|
||||
// // Licensed under the MIT license. See LICENSE file in the project root for full license information.
|
||||
|
||||
using System.Collections.ObjectModel;
|
||||
using System.IO;
|
||||
|
||||
namespace IntroToStylingAndTemplating
|
||||
{
|
||||
public class PhotoList : ObservableCollection<Photo>
|
||||
{
|
||||
private DirectoryInfo _directory;
|
||||
|
||||
public PhotoList()
|
||||
{
|
||||
}
|
||||
|
||||
public PhotoList(string path) : this(new DirectoryInfo(path))
|
||||
{
|
||||
}
|
||||
|
||||
public PhotoList(DirectoryInfo directory)
|
||||
{
|
||||
_directory = directory;
|
||||
Update();
|
||||
}
|
||||
|
||||
public string Path
|
||||
{
|
||||
set
|
||||
{
|
||||
_directory = new DirectoryInfo(value);
|
||||
Update();
|
||||
}
|
||||
get { return _directory.FullName; }
|
||||
}
|
||||
|
||||
public DirectoryInfo Directory
|
||||
{
|
||||
set
|
||||
{
|
||||
_directory = value;
|
||||
Update();
|
||||
}
|
||||
get { return _directory; }
|
||||
}
|
||||
|
||||
private void Update()
|
||||
{
|
||||
foreach (var f in _directory.GetFiles("*.jpg"))
|
||||
{
|
||||
Add(new Photo(f.FullName));
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
+25
@@ -0,0 +1,25 @@
|
||||
<Window x:Class="IntroToStylingAndTemplating.Window1"
|
||||
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
|
||||
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
|
||||
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
|
||||
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
|
||||
xmlns:local="clr-namespace:IntroToStylingAndTemplating"
|
||||
mc:Ignorable="d"
|
||||
Title="Window1" Height="450" Width="800">
|
||||
<!--<SnippetDefaultTextBlockStyle>-->
|
||||
<Window.Resources>
|
||||
<!--A Style that affects all TextBlocks-->
|
||||
<Style TargetType="TextBlock">
|
||||
<Setter Property="HorizontalAlignment" Value="Center" />
|
||||
<Setter Property="FontFamily" Value="Comic Sans MS"/>
|
||||
<Setter Property="FontSize" Value="14"/>
|
||||
</Style>
|
||||
</Window.Resources>
|
||||
<!--</SnippetDefaultTextBlockStyle>-->
|
||||
<!--<SnippetTextBlocks>-->
|
||||
<StackPanel>
|
||||
<TextBlock>My Pictures</TextBlock>
|
||||
<TextBlock>Check out my new pictures!</TextBlock>
|
||||
</StackPanel>
|
||||
<!--</SnippetTextBlocks>-->
|
||||
</Window>
|
||||
+25
@@ -0,0 +1,25 @@
|
||||
using System;
|
||||
using System.Collections.Generic;
|
||||
using System.Text;
|
||||
using System.Windows;
|
||||
using System.Windows.Controls;
|
||||
using System.Windows.Data;
|
||||
using System.Windows.Documents;
|
||||
using System.Windows.Input;
|
||||
using System.Windows.Media;
|
||||
using System.Windows.Media.Imaging;
|
||||
using System.Windows.Shapes;
|
||||
|
||||
namespace IntroToStylingAndTemplating
|
||||
{
|
||||
/// <summary>
|
||||
/// Interaction logic for Window1.xaml
|
||||
/// </summary>
|
||||
public partial class Window1 : Window
|
||||
{
|
||||
public Window1()
|
||||
{
|
||||
InitializeComponent();
|
||||
}
|
||||
}
|
||||
}
|
||||
+44
@@ -0,0 +1,44 @@
|
||||
<Window x:Class="IntroToStylingAndTemplating.Window2"
|
||||
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
|
||||
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
|
||||
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
|
||||
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
|
||||
xmlns:local="clr-namespace:IntroToStylingAndTemplating"
|
||||
mc:Ignorable="d"
|
||||
Title="Window2" Height="450" Width="800" Loaded="Window_Loaded">
|
||||
<!--<SnippetDefaultTextBlockStyleBasedOn>-->
|
||||
<Window.Resources>
|
||||
<!-- .... other resources .... -->
|
||||
|
||||
<!--A Style that affects all TextBlocks-->
|
||||
<Style TargetType="TextBlock">
|
||||
<Setter Property="HorizontalAlignment" Value="Center" />
|
||||
<Setter Property="FontFamily" Value="Comic Sans MS"/>
|
||||
<Setter Property="FontSize" Value="14"/>
|
||||
</Style>
|
||||
|
||||
<!--A Style that extends the previous TextBlock Style with an x:Key of TitleText-->
|
||||
<Style BasedOn="{StaticResource {x:Type TextBlock}}"
|
||||
TargetType="TextBlock"
|
||||
x:Key="TitleText">
|
||||
<Setter Property="FontSize" Value="26"/>
|
||||
<Setter Property="Foreground">
|
||||
<Setter.Value>
|
||||
<LinearGradientBrush StartPoint="0.5,0" EndPoint="0.5,1">
|
||||
<LinearGradientBrush.GradientStops>
|
||||
<GradientStop Offset="0.0" Color="#90DDDD" />
|
||||
<GradientStop Offset="1.0" Color="#5BFFFF" />
|
||||
</LinearGradientBrush.GradientStops>
|
||||
</LinearGradientBrush>
|
||||
</Setter.Value>
|
||||
</Setter>
|
||||
</Style>
|
||||
</Window.Resources>
|
||||
<!--</SnippetDefaultTextBlockStyleBasedOn>-->
|
||||
<!--<SnippetTextBlocksExplicit>-->
|
||||
<StackPanel>
|
||||
<TextBlock Style="{StaticResource TitleText}" Name="textblock1">My Pictures</TextBlock>
|
||||
<TextBlock>Check out my new pictures!</TextBlock>
|
||||
</StackPanel>
|
||||
<!--</SnippetTextBlocksExplicit>-->
|
||||
</Window>
|
||||
+32
@@ -0,0 +1,32 @@
|
||||
using System;
|
||||
using System.Collections.Generic;
|
||||
using System.Text;
|
||||
using System.Windows;
|
||||
using System.Windows.Controls;
|
||||
using System.Windows.Data;
|
||||
using System.Windows.Documents;
|
||||
using System.Windows.Input;
|
||||
using System.Windows.Media;
|
||||
using System.Windows.Media.Imaging;
|
||||
using System.Windows.Shapes;
|
||||
|
||||
namespace IntroToStylingAndTemplating
|
||||
{
|
||||
/// <summary>
|
||||
/// Interaction logic for Window2.xaml
|
||||
/// </summary>
|
||||
public partial class Window2 : Window
|
||||
{
|
||||
public Window2()
|
||||
{
|
||||
InitializeComponent();
|
||||
}
|
||||
|
||||
private void Window_Loaded(object sender, RoutedEventArgs e)
|
||||
{
|
||||
// <SnippetSetStyleCode>
|
||||
textblock1.Style = (Style)Resources["TitleText"];
|
||||
// </SnippetSetStyleCode>
|
||||
}
|
||||
}
|
||||
}
|
||||
+20
@@ -0,0 +1,20 @@
|
||||
<Window x:Class="IntroToStylingAndTemplating.Window3"
|
||||
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
|
||||
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
|
||||
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
|
||||
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
|
||||
xmlns:local="clr-namespace:IntroToStylingAndTemplating"
|
||||
mc:Ignorable="d"
|
||||
Title="Window3" Height="450" Width="800">
|
||||
<Window.Resources>
|
||||
<ObjectDataProvider x:Key="MyPhotos" ObjectType="{x:Type local:PhotoList}"/>
|
||||
</Window.Resources>
|
||||
<StackPanel>
|
||||
<TextBlock>My Pictures</TextBlock>
|
||||
<TextBlock>Check out my new pictures!</TextBlock>
|
||||
<!--<SnippetListBox>-->
|
||||
<ListBox ItemsSource="{Binding Source={StaticResource MyPhotos}}"
|
||||
Background="Silver" Width="600" Margin="10" SelectedIndex="0"/>
|
||||
<!--</SnippetListBox>-->
|
||||
</StackPanel>
|
||||
</Window>
|
||||
+25
@@ -0,0 +1,25 @@
|
||||
using System;
|
||||
using System.Collections.Generic;
|
||||
using System.Text;
|
||||
using System.Windows;
|
||||
using System.Windows.Controls;
|
||||
using System.Windows.Data;
|
||||
using System.Windows.Documents;
|
||||
using System.Windows.Input;
|
||||
using System.Windows.Media;
|
||||
using System.Windows.Media.Imaging;
|
||||
using System.Windows.Shapes;
|
||||
|
||||
namespace IntroToStylingAndTemplating
|
||||
{
|
||||
/// <summary>
|
||||
/// Interaction logic for Window3.xaml
|
||||
/// </summary>
|
||||
public partial class Window3 : Window
|
||||
{
|
||||
public Window3()
|
||||
{
|
||||
InitializeComponent();
|
||||
}
|
||||
}
|
||||
}
|
||||
+26
@@ -0,0 +1,26 @@
|
||||
<Window x:Class="IntroToStylingAndTemplating.Window4"
|
||||
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
|
||||
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
|
||||
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
|
||||
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
|
||||
xmlns:local="clr-namespace:IntroToStylingAndTemplating"
|
||||
mc:Ignorable="d"
|
||||
Title="Window4" Height="450" Width="800">
|
||||
<!--<SnippetDataTemplate>-->
|
||||
<Window.Resources>
|
||||
<!-- .... other resources .... -->
|
||||
|
||||
<!--DataTemplate to display Photos as images
|
||||
instead of text strings of Paths-->
|
||||
<DataTemplate DataType="{x:Type local:Photo}">
|
||||
<Border Margin="3">
|
||||
<Image Source="{Binding Source}"/>
|
||||
</Border>
|
||||
</DataTemplate>
|
||||
</Window.Resources>
|
||||
<!--</SnippetDataTemplate>-->
|
||||
<StackPanel>
|
||||
<TextBlock>My Pictures</TextBlock>
|
||||
<TextBlock>Check out my new pictures!</TextBlock>
|
||||
</StackPanel>
|
||||
</Window>
|
||||
+25
@@ -0,0 +1,25 @@
|
||||
using System;
|
||||
using System.Collections.Generic;
|
||||
using System.Text;
|
||||
using System.Windows;
|
||||
using System.Windows.Controls;
|
||||
using System.Windows.Data;
|
||||
using System.Windows.Documents;
|
||||
using System.Windows.Input;
|
||||
using System.Windows.Media;
|
||||
using System.Windows.Media.Imaging;
|
||||
using System.Windows.Shapes;
|
||||
|
||||
namespace IntroToStylingAndTemplating
|
||||
{
|
||||
/// <summary>
|
||||
/// Interaction logic for Window4.xaml
|
||||
/// </summary>
|
||||
public partial class Window4 : Window
|
||||
{
|
||||
public Window4()
|
||||
{
|
||||
InitializeComponent();
|
||||
}
|
||||
}
|
||||
}
|
||||
+30
@@ -0,0 +1,30 @@
|
||||
<Window x:Class="IntroToStylingAndTemplating.Window5"
|
||||
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
|
||||
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
|
||||
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
|
||||
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
|
||||
xmlns:local="clr-namespace:IntroToStylingAndTemplating"
|
||||
mc:Ignorable="d"
|
||||
Title="Window5" Height="450" Width="800">
|
||||
<!--<SnippetPropertyTrigger>-->
|
||||
<Window.Resources>
|
||||
<!-- .... other resources .... -->
|
||||
|
||||
<Style TargetType="ListBoxItem">
|
||||
<Setter Property="Opacity" Value="0.5" />
|
||||
<Setter Property="MaxHeight" Value="75" />
|
||||
<Style.Triggers>
|
||||
<Trigger Property="IsSelected" Value="True">
|
||||
<Trigger.Setters>
|
||||
<Setter Property="Opacity" Value="1.0" />
|
||||
</Trigger.Setters>
|
||||
</Trigger>
|
||||
</Style.Triggers>
|
||||
</Style>
|
||||
</Window.Resources>
|
||||
<!--</SnippetPropertyTrigger>-->
|
||||
<StackPanel>
|
||||
<TextBlock>My Pictures</TextBlock>
|
||||
<TextBlock>Check out my new pictures!</TextBlock>
|
||||
</StackPanel>
|
||||
</Window>
|
||||
+25
@@ -0,0 +1,25 @@
|
||||
using System;
|
||||
using System.Collections.Generic;
|
||||
using System.Text;
|
||||
using System.Windows;
|
||||
using System.Windows.Controls;
|
||||
using System.Windows.Data;
|
||||
using System.Windows.Documents;
|
||||
using System.Windows.Input;
|
||||
using System.Windows.Media;
|
||||
using System.Windows.Media.Imaging;
|
||||
using System.Windows.Shapes;
|
||||
|
||||
namespace IntroToStylingAndTemplating
|
||||
{
|
||||
/// <summary>
|
||||
/// Interaction logic for Window5.xaml
|
||||
/// </summary>
|
||||
public partial class Window5 : Window
|
||||
{
|
||||
public Window5()
|
||||
{
|
||||
InitializeComponent();
|
||||
}
|
||||
}
|
||||
}
|
||||
+53
@@ -0,0 +1,53 @@
|
||||
<Window x:Class="IntroToStylingAndTemplating.Window6"
|
||||
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
|
||||
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
|
||||
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
|
||||
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
|
||||
xmlns:local="clr-namespace:IntroToStylingAndTemplating"
|
||||
mc:Ignorable="d"
|
||||
Title="Window6" Height="450" Width="800">
|
||||
<Window.Resources>
|
||||
<!-- .... other resources .... -->
|
||||
|
||||
<Style TargetType="ListBoxItem">
|
||||
<Setter Property="Opacity" Value="0.5" />
|
||||
<Setter Property="MaxHeight" Value="75" />
|
||||
<!--<SnippetStyleEventTriggers>-->
|
||||
<Style.Triggers>
|
||||
<Trigger Property="IsSelected" Value="True">
|
||||
<Trigger.Setters>
|
||||
<Setter Property="Opacity" Value="1.0" />
|
||||
</Trigger.Setters>
|
||||
</Trigger>
|
||||
<EventTrigger RoutedEvent="Mouse.MouseEnter">
|
||||
<EventTrigger.Actions>
|
||||
<BeginStoryboard>
|
||||
<Storyboard>
|
||||
<DoubleAnimation
|
||||
Duration="0:0:0.2"
|
||||
Storyboard.TargetProperty="MaxHeight"
|
||||
To="90" />
|
||||
</Storyboard>
|
||||
</BeginStoryboard>
|
||||
</EventTrigger.Actions>
|
||||
</EventTrigger>
|
||||
<EventTrigger RoutedEvent="Mouse.MouseLeave">
|
||||
<EventTrigger.Actions>
|
||||
<BeginStoryboard>
|
||||
<Storyboard>
|
||||
<DoubleAnimation
|
||||
Duration="0:0:1"
|
||||
Storyboard.TargetProperty="MaxHeight" />
|
||||
</Storyboard>
|
||||
</BeginStoryboard>
|
||||
</EventTrigger.Actions>
|
||||
</EventTrigger>
|
||||
</Style.Triggers>
|
||||
<!--</SnippetStyleEventTriggers>-->
|
||||
</Style>
|
||||
</Window.Resources>
|
||||
<StackPanel>
|
||||
<TextBlock>My Pictures</TextBlock>
|
||||
<TextBlock>Check out my new pictures!</TextBlock>
|
||||
</StackPanel>
|
||||
</Window>
|
||||
+25
@@ -0,0 +1,25 @@
|
||||
using System;
|
||||
using System.Collections.Generic;
|
||||
using System.Text;
|
||||
using System.Windows;
|
||||
using System.Windows.Controls;
|
||||
using System.Windows.Data;
|
||||
using System.Windows.Documents;
|
||||
using System.Windows.Input;
|
||||
using System.Windows.Media;
|
||||
using System.Windows.Media.Imaging;
|
||||
using System.Windows.Shapes;
|
||||
|
||||
namespace IntroToStylingAndTemplating
|
||||
{
|
||||
/// <summary>
|
||||
/// Interaction logic for Window6.xaml
|
||||
/// </summary>
|
||||
public partial class Window6 : Window
|
||||
{
|
||||
public Window6()
|
||||
{
|
||||
InitializeComponent();
|
||||
}
|
||||
}
|
||||
}
|
||||
+25
@@ -0,0 +1,25 @@
|
||||
<Window x:Class="IntroToStylingAndTemplating.ExplicitStyle"
|
||||
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
|
||||
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
|
||||
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
|
||||
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
|
||||
xmlns:local="clr-namespace:IntroToStylingAndTemplating"
|
||||
mc:Ignorable="d"
|
||||
Height="100" Width="300"
|
||||
Title="Style Intro Sample">
|
||||
<!--<ExplicitStyleDeclare>-->
|
||||
<Window.Resources>
|
||||
<Style x:Key="TitleText" TargetType="TextBlock">
|
||||
<Setter Property="HorizontalAlignment" Value="Center" />
|
||||
<Setter Property="FontFamily" Value="Comic Sans MS"/>
|
||||
<Setter Property="FontSize" Value="14"/>
|
||||
</Style>
|
||||
</Window.Resources>
|
||||
<!--</ExplicitStyleDeclare>-->
|
||||
<!--<ExplicitStyleReference>-->
|
||||
<StackPanel>
|
||||
<TextBlock Style="{StaticResource TitleText}">My Pictures</TextBlock>
|
||||
<TextBlock>Check out my new pictures!</TextBlock>
|
||||
</StackPanel>
|
||||
<!--</ExplicitStyleReference>-->
|
||||
</Window>
|
||||
+25
@@ -0,0 +1,25 @@
|
||||
using System;
|
||||
using System.Collections.Generic;
|
||||
using System.Text;
|
||||
using System.Windows;
|
||||
using System.Windows.Controls;
|
||||
using System.Windows.Data;
|
||||
using System.Windows.Documents;
|
||||
using System.Windows.Input;
|
||||
using System.Windows.Media;
|
||||
using System.Windows.Media.Imaging;
|
||||
using System.Windows.Shapes;
|
||||
|
||||
namespace IntroToStylingAndTemplating
|
||||
{
|
||||
/// <summary>
|
||||
/// Interaction logic for ExplicitStyle.xaml
|
||||
/// </summary>
|
||||
public partial class ExplicitStyle : Window
|
||||
{
|
||||
public ExplicitStyle()
|
||||
{
|
||||
InitializeComponent();
|
||||
}
|
||||
}
|
||||
}
|
||||
+20
@@ -0,0 +1,20 @@
|
||||
<!--<WindowResources>-->
|
||||
<Window x:Class="IntroToStylingAndTemplating.WindowSingleResource"
|
||||
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
|
||||
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
|
||||
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
|
||||
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
|
||||
xmlns:local="clr-namespace:IntroToStylingAndTemplating"
|
||||
mc:Ignorable="d"
|
||||
Title="WindowSingleResource" Height="450" Width="800">
|
||||
<Window.Resources>
|
||||
|
||||
<Style x:Key="Header1" TargetType="TextBlock">
|
||||
<Setter Property="FontSize" Value="15" />
|
||||
<Setter Property="FontWeight" Value="ExtraBold" />
|
||||
</Style>
|
||||
|
||||
</Window.Resources>
|
||||
<Grid />
|
||||
</Window>
|
||||
<!--</WindowResources>-->
|
||||
+25
@@ -0,0 +1,25 @@
|
||||
using System;
|
||||
using System.Collections.Generic;
|
||||
using System.Text;
|
||||
using System.Windows;
|
||||
using System.Windows.Controls;
|
||||
using System.Windows.Data;
|
||||
using System.Windows.Documents;
|
||||
using System.Windows.Input;
|
||||
using System.Windows.Media;
|
||||
using System.Windows.Media.Imaging;
|
||||
using System.Windows.Shapes;
|
||||
|
||||
namespace IntroToStylingAndTemplating
|
||||
{
|
||||
/// <summary>
|
||||
/// Interaction logic for WindowSingleResource.xaml
|
||||
/// </summary>
|
||||
public partial class WindowSingleResource : Window
|
||||
{
|
||||
public WindowSingleResource()
|
||||
{
|
||||
InitializeComponent();
|
||||
}
|
||||
}
|
||||
}
|
||||
BIN
Binary file not shown.
|
After Width: | Height: | Size: 47 KiB |
BIN
Binary file not shown.
|
After Width: | Height: | Size: 45 KiB |
BIN
Binary file not shown.
|
After Width: | Height: | Size: 54 KiB |
BIN
Binary file not shown.
|
After Width: | Height: | Size: 152 KiB |
BIN
Binary file not shown.
|
After Width: | Height: | Size: 102 KiB |
+9
@@ -0,0 +1,9 @@
|
||||
<Application x:Class="Application"
|
||||
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
|
||||
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
|
||||
xmlns:local="clr-namespace:IntroToStylingAndTemplating"
|
||||
StartupUri="MainWindow.xaml">
|
||||
<Application.Resources>
|
||||
|
||||
</Application.Resources>
|
||||
</Application>
|
||||
+6
@@ -0,0 +1,6 @@
|
||||
Class Application
|
||||
|
||||
' Application-level events, such as Startup, Exit, and DispatcherUnhandledException
|
||||
' can be handled in this file.
|
||||
|
||||
End Class
|
||||
+33
@@ -0,0 +1,33 @@
|
||||
<Window x:Class="MainWindow"
|
||||
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
|
||||
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
|
||||
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
|
||||
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
|
||||
xmlns:local="clr-namespace:IntroToStylingAndTemplating"
|
||||
mc:Ignorable="d"
|
||||
Title="MainWindow" Height="450" Width="800" Loaded="Window_Loaded">
|
||||
<Window.Resources>
|
||||
<!-- .... other resources .... -->
|
||||
|
||||
<!--A Style that extends the previous TextBlock Style-->
|
||||
<!--This is a "named style" with an x:Key of TitleText-->
|
||||
<Style BasedOn="{StaticResource {x:Type TextBlock}}"
|
||||
TargetType="TextBlock"
|
||||
x:Key="TitleText">
|
||||
<Setter Property="FontSize" Value="26"/>
|
||||
<Setter Property="Foreground">
|
||||
<Setter.Value>
|
||||
<LinearGradientBrush StartPoint="0.5,0" EndPoint="0.5,1">
|
||||
<LinearGradientBrush.GradientStops>
|
||||
<GradientStop Offset="0.0" Color="#90DDDD" />
|
||||
<GradientStop Offset="1.0" Color="#5BFFFF" />
|
||||
</LinearGradientBrush.GradientStops>
|
||||
</LinearGradientBrush>
|
||||
</Setter.Value>
|
||||
</Setter>
|
||||
</Style>
|
||||
</Window.Resources>
|
||||
<Grid>
|
||||
<TextBlock Name="textblock1">My Pictures</TextBlock>
|
||||
</Grid>
|
||||
</Window>
|
||||
+7
@@ -0,0 +1,7 @@
|
||||
Class MainWindow
|
||||
Private Sub Window_Loaded(sender As Object, e As Windows.RoutedEventArgs)
|
||||
'<SnippetSetStyleCode>
|
||||
textblock1.Style = CType(Resources("TitleText"), Windows.Style)
|
||||
'</SnippetSetStyleCode>
|
||||
End Sub
|
||||
End Class
|
||||
@@ -0,0 +1,13 @@
|
||||
' <PhotoClass>
|
||||
Public Class Photo
|
||||
Sub New(ByVal path As String)
|
||||
Source = path
|
||||
End Sub
|
||||
|
||||
Public ReadOnly Property Source As String
|
||||
|
||||
Public Overrides Function ToString() As String
|
||||
Return Source
|
||||
End Function
|
||||
End Class
|
||||
' </PhotoClass>
|
||||
+11
@@ -0,0 +1,11 @@
|
||||
<Project Sdk="Microsoft.NET.Sdk">
|
||||
|
||||
<PropertyGroup>
|
||||
<OutputType>WinExe</OutputType>
|
||||
<TargetFramework>net5.0-windows</TargetFramework>
|
||||
<RootNamespace>IntroToStylingAndTemplating</RootNamespace>
|
||||
<UseWpf>true</UseWpf>
|
||||
<AssemblyName>IntroToStylingAndTemplating</AssemblyName>
|
||||
</PropertyGroup>
|
||||
|
||||
</Project>
|
||||
+14
@@ -0,0 +1,14 @@
|
||||
// // Copyright (c) Microsoft. All rights reserved.
|
||||
// // Licensed under the MIT license. See LICENSE file in the project root for full license information.
|
||||
|
||||
using System.Windows;
|
||||
|
||||
namespace IntroToStylingAndTemplating
|
||||
{
|
||||
/// <summary>
|
||||
/// Interaction logic for App.xaml
|
||||
/// </summary>
|
||||
public partial class App : Application
|
||||
{
|
||||
}
|
||||
}
|
||||
+18
@@ -0,0 +1,18 @@
|
||||
<!--<AppResources>-->
|
||||
<Application x:Class="IntroToStylingAndTemplating.App"
|
||||
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
|
||||
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
|
||||
xmlns:local="clr-namespace:IntroToStylingAndTemplating"
|
||||
StartupUri="MainWindow.xaml">
|
||||
<Application.Resources>
|
||||
<ResourceDictionary>
|
||||
|
||||
<Style x:Key="Header1" TargetType="TextBlock">
|
||||
<Setter Property="FontSize" Value="15" />
|
||||
<Setter Property="FontWeight" Value="ExtraBold" />
|
||||
</Style>
|
||||
|
||||
</ResourceDictionary>
|
||||
</Application.Resources>
|
||||
</Application>
|
||||
<!--</AppResources>-->
|
||||
+11
@@ -0,0 +1,11 @@
|
||||
<Project Sdk="Microsoft.NET.Sdk">
|
||||
|
||||
<PropertyGroup>
|
||||
<OutputType>WinExe</OutputType>
|
||||
<TargetFramework>net5.0-windows</TargetFramework>
|
||||
<RootNamespace>IntroToStylingAndTemplating</RootNamespace>
|
||||
<UseWpf>true</UseWpf>
|
||||
<AssemblyName>IntroToStylingAndTemplating</AssemblyName>
|
||||
</PropertyGroup>
|
||||
|
||||
</Project>
|
||||
+28
@@ -0,0 +1,28 @@
|
||||
// // Copyright (c) Microsoft. All rights reserved.
|
||||
// // Licensed under the MIT license. See LICENSE file in the project root for full license information.
|
||||
|
||||
using System.Windows;
|
||||
using System.Windows.Data;
|
||||
|
||||
namespace IntroToStylingAndTemplating
|
||||
{
|
||||
/// <summary>
|
||||
/// Interaction logic for MainWindow.xaml
|
||||
/// </summary>
|
||||
public partial class MainWindow : Window
|
||||
{
|
||||
public MainWindow()
|
||||
{
|
||||
InitializeComponent();
|
||||
}
|
||||
|
||||
private void WindowLoaded(object sender, RoutedEventArgs e)
|
||||
{
|
||||
}
|
||||
|
||||
private void Button_Click(object sender, RoutedEventArgs e)
|
||||
{
|
||||
MessageBox.Show("Clicked");
|
||||
}
|
||||
}
|
||||
}
|
||||
+43
@@ -0,0 +1,43 @@
|
||||
<Window x:Class="IntroToStylingAndTemplating.MainWindow"
|
||||
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
|
||||
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
|
||||
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
|
||||
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
|
||||
xmlns:local="clr-namespace:IntroToStylingAndTemplating"
|
||||
mc:Ignorable="d"
|
||||
Title="Template Intro Sample" Loaded="WindowLoaded" SizeToContent="WidthAndHeight" MinWidth="250">
|
||||
<Window.Resources>
|
||||
<ControlTemplate x:Key="roundbutton" TargetType="Button">
|
||||
<Grid>
|
||||
<VisualStateManager.VisualStateGroups>
|
||||
<VisualStateGroup Name="CommonStates">
|
||||
<VisualState Name="Normal">
|
||||
<Storyboard>
|
||||
<ColorAnimation Storyboard.TargetName="backgroundElement"
|
||||
Storyboard.TargetProperty="(Shape.Fill).(SolidColorBrush.Color)"
|
||||
To="{TemplateBinding Background}"
|
||||
Duration="0:0:0.3"/>
|
||||
</Storyboard>
|
||||
</VisualState>
|
||||
<VisualState Name="MouseOver">
|
||||
<Storyboard>
|
||||
<ColorAnimation Storyboard.TargetName="backgroundElement"
|
||||
Storyboard.TargetProperty="(Shape.Fill).(SolidColorBrush.Color)"
|
||||
To="Yellow"
|
||||
Duration="0:0:0.3"/>
|
||||
</Storyboard>
|
||||
</VisualState>
|
||||
</VisualStateGroup>
|
||||
</VisualStateManager.VisualStateGroups>
|
||||
<Ellipse Name="backgroundElement" Fill="{TemplateBinding Background}" Stroke="{TemplateBinding Foreground}" />
|
||||
<ContentPresenter x:Name="contentPresenter" HorizontalAlignment="Center" VerticalAlignment="Center" />
|
||||
</Grid>
|
||||
</ControlTemplate>
|
||||
</Window.Resources>
|
||||
<StackPanel Margin="10">
|
||||
<Label>Unstyled Button</Label>
|
||||
<Button>Button 1</Button>
|
||||
<Label>Rounded Button</Label>
|
||||
<Button Template="{StaticResource roundbutton}" Width="65" Height="65" Click="Button_Click">Button 2</Button>
|
||||
</StackPanel>
|
||||
</Window>
|
||||
+19
@@ -0,0 +1,19 @@
|
||||
<!--<SnippetInitialWhole>-->
|
||||
<Window x:Class="IntroToStylingAndTemplating.Window1"
|
||||
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
|
||||
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
|
||||
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
|
||||
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
|
||||
xmlns:local="clr-namespace:IntroToStylingAndTemplating"
|
||||
mc:Ignorable="d"
|
||||
Title="Template Intro Sample" SizeToContent="WidthAndHeight" MinWidth="250">
|
||||
<!--<SnippetInitial>-->
|
||||
<StackPanel Margin="10">
|
||||
<Label>Unstyled Button</Label>
|
||||
<Button>Button 1</Button>
|
||||
<Label>Rounded Button</Label>
|
||||
<Button>Button 2</Button>
|
||||
</StackPanel>
|
||||
<!--</SnippetInitial>-->
|
||||
</Window>
|
||||
<!--</SnippetInitialWhole>-->
|
||||
+25
@@ -0,0 +1,25 @@
|
||||
using System;
|
||||
using System.Collections.Generic;
|
||||
using System.Text;
|
||||
using System.Windows;
|
||||
using System.Windows.Controls;
|
||||
using System.Windows.Data;
|
||||
using System.Windows.Documents;
|
||||
using System.Windows.Input;
|
||||
using System.Windows.Media;
|
||||
using System.Windows.Media.Imaging;
|
||||
using System.Windows.Shapes;
|
||||
|
||||
namespace IntroToStylingAndTemplating
|
||||
{
|
||||
/// <summary>
|
||||
/// Interaction logic for Window1.xaml
|
||||
/// </summary>
|
||||
public partial class Window1 : Window
|
||||
{
|
||||
public Window1()
|
||||
{
|
||||
InitializeComponent();
|
||||
}
|
||||
}
|
||||
}
|
||||
+20
@@ -0,0 +1,20 @@
|
||||
<!--<SnippetWindowResStart>-->
|
||||
<Window x:Class="IntroToStylingAndTemplating.Window2"
|
||||
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
|
||||
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
|
||||
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
|
||||
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
|
||||
xmlns:local="clr-namespace:IntroToStylingAndTemplating"
|
||||
mc:Ignorable="d"
|
||||
Title="Template Intro Sample" SizeToContent="WidthAndHeight" MinWidth="250">
|
||||
<Window.Resources>
|
||||
|
||||
</Window.Resources>
|
||||
<StackPanel Margin="10">
|
||||
<Label>Unstyled Button</Label>
|
||||
<Button>Button 1</Button>
|
||||
<Label>Rounded Button</Label>
|
||||
<Button>Button 2</Button>
|
||||
</StackPanel>
|
||||
</Window>
|
||||
<!--</SnippetWindowResStart>-->
|
||||
+25
@@ -0,0 +1,25 @@
|
||||
using System;
|
||||
using System.Collections.Generic;
|
||||
using System.Text;
|
||||
using System.Windows;
|
||||
using System.Windows.Controls;
|
||||
using System.Windows.Data;
|
||||
using System.Windows.Documents;
|
||||
using System.Windows.Input;
|
||||
using System.Windows.Media;
|
||||
using System.Windows.Media.Imaging;
|
||||
using System.Windows.Shapes;
|
||||
|
||||
namespace IntroToStylingAndTemplating
|
||||
{
|
||||
/// <summary>
|
||||
/// Interaction logic for Window2.xaml
|
||||
/// </summary>
|
||||
public partial class Window2 : Window
|
||||
{
|
||||
public Window2()
|
||||
{
|
||||
InitializeComponent();
|
||||
}
|
||||
}
|
||||
}
|
||||
+38
@@ -0,0 +1,38 @@
|
||||
<Window x:Class="IntroToStylingAndTemplating.Window3"
|
||||
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
|
||||
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
|
||||
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
|
||||
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
|
||||
xmlns:local="clr-namespace:IntroToStylingAndTemplating"
|
||||
mc:Ignorable="d"
|
||||
Title="Window3" SizeToContent="WidthAndHeight" MinWidth="250">
|
||||
<Window.Resources>
|
||||
<!--<SnippetControlTemplate>-->
|
||||
<ControlTemplate x:Key="roundbutton" TargetType="Button">
|
||||
<Grid>
|
||||
<Ellipse Fill="{TemplateBinding Background}" Stroke="{TemplateBinding Foreground}" />
|
||||
<ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" />
|
||||
</Grid>
|
||||
</ControlTemplate>
|
||||
<!--</SnippetControlTemplate>-->
|
||||
</Window.Resources>
|
||||
<Grid>
|
||||
<!--<SnippetStyledButton>-->
|
||||
<StackPanel Margin="10">
|
||||
<Label>Unstyled Button</Label>
|
||||
<Button>Button 1</Button>
|
||||
<Label>Rounded Button</Label>
|
||||
<Button Template="{StaticResource roundbutton}">Button 2</Button>
|
||||
</StackPanel>
|
||||
<!--</SnippetStyledButton>-->
|
||||
|
||||
<!--<SnippetStyledButtonSize>-->
|
||||
<StackPanel Margin="10">
|
||||
<Label>Unstyled Button</Label>
|
||||
<Button>Button 1</Button>
|
||||
<Label>Rounded Button</Label>
|
||||
<Button Template="{StaticResource roundbutton}" Width="65" Height="65">Button 2</Button>
|
||||
</StackPanel>
|
||||
<!--</SnippetStyledButtonSize>-->
|
||||
</Grid>
|
||||
</Window>
|
||||
+25
@@ -0,0 +1,25 @@
|
||||
using System;
|
||||
using System.Collections.Generic;
|
||||
using System.Text;
|
||||
using System.Windows;
|
||||
using System.Windows.Controls;
|
||||
using System.Windows.Data;
|
||||
using System.Windows.Documents;
|
||||
using System.Windows.Input;
|
||||
using System.Windows.Media;
|
||||
using System.Windows.Media.Imaging;
|
||||
using System.Windows.Shapes;
|
||||
|
||||
namespace IntroToStylingAndTemplating
|
||||
{
|
||||
/// <summary>
|
||||
/// Interaction logic for Window3.xaml
|
||||
/// </summary>
|
||||
public partial class Window3 : Window
|
||||
{
|
||||
public Window3()
|
||||
{
|
||||
InitializeComponent();
|
||||
}
|
||||
}
|
||||
}
|
||||
+29
@@ -0,0 +1,29 @@
|
||||
<Window x:Class="IntroToStylingAndTemplating.Window4"
|
||||
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
|
||||
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
|
||||
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
|
||||
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
|
||||
xmlns:local="clr-namespace:IntroToStylingAndTemplating"
|
||||
mc:Ignorable="d"
|
||||
Title="Window4" SizeToContent="WidthAndHeight" MinWidth="250">
|
||||
<Window.Resources>
|
||||
<!--<SnippetControlTemplate>-->
|
||||
<ControlTemplate x:Key="roundbutton" TargetType="Button">
|
||||
<Grid>
|
||||
<!--<SnippetEllipseName>-->
|
||||
<Ellipse x:Name="backgroundElement" Fill="{TemplateBinding Background}" Stroke="{TemplateBinding Foreground}" />
|
||||
<!--</SnippetEllipseName>-->
|
||||
<ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" />
|
||||
</Grid>
|
||||
<ControlTemplate.Triggers>
|
||||
<Trigger Property="IsMouseOver" Value="true">
|
||||
|
||||
</Trigger>
|
||||
</ControlTemplate.Triggers>
|
||||
</ControlTemplate>
|
||||
<!--</SnippetControlTemplate>-->
|
||||
</Window.Resources>
|
||||
<Grid>
|
||||
|
||||
</Grid>
|
||||
</Window>
|
||||
+25
@@ -0,0 +1,25 @@
|
||||
using System;
|
||||
using System.Collections.Generic;
|
||||
using System.Text;
|
||||
using System.Windows;
|
||||
using System.Windows.Controls;
|
||||
using System.Windows.Data;
|
||||
using System.Windows.Documents;
|
||||
using System.Windows.Input;
|
||||
using System.Windows.Media;
|
||||
using System.Windows.Media.Imaging;
|
||||
using System.Windows.Shapes;
|
||||
|
||||
namespace IntroToStylingAndTemplating
|
||||
{
|
||||
/// <summary>
|
||||
/// Interaction logic for Window4.xaml
|
||||
/// </summary>
|
||||
public partial class Window4 : Window
|
||||
{
|
||||
public Window4()
|
||||
{
|
||||
InitializeComponent();
|
||||
}
|
||||
}
|
||||
}
|
||||
+35
@@ -0,0 +1,35 @@
|
||||
<Window x:Class="IntroToStylingAndTemplating.Window5"
|
||||
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
|
||||
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
|
||||
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
|
||||
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
|
||||
xmlns:local="clr-namespace:IntroToStylingAndTemplating"
|
||||
mc:Ignorable="d"
|
||||
Title="Window5" SizeToContent="WidthAndHeight" MinWidth="250">
|
||||
<Window.Resources>
|
||||
<ControlTemplate x:Key="roundbuttonUnneeded" TargetType="Button">
|
||||
<Grid>
|
||||
<Ellipse x:Name="backgroundElement" Fill="{TemplateBinding Background}" Stroke="{TemplateBinding Foreground}" />
|
||||
<ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" />
|
||||
</Grid>
|
||||
<ControlTemplate.Triggers>
|
||||
<!--<SnippetMouseOver>-->
|
||||
<Trigger Property="IsMouseOver" Value="true">
|
||||
<Setter Property="Fill" TargetName="backgroundElement" Value="AliceBlue"/>
|
||||
</Trigger>
|
||||
<!--</SnippetMouseOver>-->
|
||||
</ControlTemplate.Triggers>
|
||||
</ControlTemplate>
|
||||
<!--<SnippetCleanTemplate>-->
|
||||
<ControlTemplate x:Key="roundbutton" TargetType="Button">
|
||||
<Grid>
|
||||
<Ellipse x:Name="backgroundElement" Fill="{TemplateBinding Background}" Stroke="{TemplateBinding Foreground}" />
|
||||
<ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" />
|
||||
</Grid>
|
||||
</ControlTemplate>
|
||||
<!--</SnippetCleanTemplate>-->
|
||||
</Window.Resources>
|
||||
<Grid>
|
||||
|
||||
</Grid>
|
||||
</Window>
|
||||
+25
@@ -0,0 +1,25 @@
|
||||
using System;
|
||||
using System.Collections.Generic;
|
||||
using System.Text;
|
||||
using System.Windows;
|
||||
using System.Windows.Controls;
|
||||
using System.Windows.Data;
|
||||
using System.Windows.Documents;
|
||||
using System.Windows.Input;
|
||||
using System.Windows.Media;
|
||||
using System.Windows.Media.Imaging;
|
||||
using System.Windows.Shapes;
|
||||
|
||||
namespace IntroToStylingAndTemplating
|
||||
{
|
||||
/// <summary>
|
||||
/// Interaction logic for Window5.xaml
|
||||
/// </summary>
|
||||
public partial class Window5 : Window
|
||||
{
|
||||
public Window5()
|
||||
{
|
||||
InitializeComponent();
|
||||
}
|
||||
}
|
||||
}
|
||||
+60
@@ -0,0 +1,60 @@
|
||||
<Window x:Class="IntroToStylingAndTemplating.Window6"
|
||||
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
|
||||
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
|
||||
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
|
||||
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
|
||||
xmlns:local="clr-namespace:IntroToStylingAndTemplating"
|
||||
mc:Ignorable="d"
|
||||
Title="Window6" SizeToContent="WidthAndHeight" MinWidth="250">
|
||||
<Window.Resources>
|
||||
<!--<SnippetVisualState>-->
|
||||
<ControlTemplate x:Key="roundbutton" TargetType="Button">
|
||||
<Grid>
|
||||
<VisualStateManager.VisualStateGroups>
|
||||
<VisualStateGroup Name="CommonStates">
|
||||
<VisualState Name="Normal">
|
||||
</VisualState>
|
||||
<VisualState Name="MouseOver">
|
||||
</VisualState>
|
||||
</VisualStateGroup>
|
||||
</VisualStateManager.VisualStateGroups>
|
||||
<Ellipse x:Name="backgroundElement" Fill="{TemplateBinding Background}" Stroke="{TemplateBinding Foreground}" />
|
||||
<ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" />
|
||||
</Grid>
|
||||
</ControlTemplate>
|
||||
<!--</SnippetVisualState>-->
|
||||
<ControlTemplate x:Key="roundbuttonOther" TargetType="Button">
|
||||
<Grid>
|
||||
<VisualStateManager.VisualStateGroups>
|
||||
<VisualStateGroup Name="CommonStates">
|
||||
<VisualState Name="Normal">
|
||||
<!--<SnippetNormalState>-->
|
||||
<Storyboard>
|
||||
<ColorAnimation Storyboard.TargetName="backgroundElement"
|
||||
Storyboard.TargetProperty="(Shape.Fill).(SolidColorBrush.Color)"
|
||||
To="{TemplateBinding Background}"
|
||||
Duration="0:0:0.3"/>
|
||||
</Storyboard>
|
||||
<!--</SnippetNormalState>-->
|
||||
</VisualState>
|
||||
<VisualState Name="MouseOver">
|
||||
<!--<SnippetMouseOverState>-->
|
||||
<Storyboard>
|
||||
<ColorAnimation Storyboard.TargetName="backgroundElement"
|
||||
Storyboard.TargetProperty="(Shape.Fill).(SolidColorBrush.Color)"
|
||||
To="Yellow"
|
||||
Duration="0:0:0.3"/>
|
||||
</Storyboard>
|
||||
<!--</SnippetMouseOverState>-->
|
||||
</VisualState>
|
||||
</VisualStateGroup>
|
||||
</VisualStateManager.VisualStateGroups>
|
||||
<Ellipse x:Name="backgroundElement" Fill="{TemplateBinding Background}" Stroke="{TemplateBinding Foreground}" />
|
||||
<ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" />
|
||||
</Grid>
|
||||
</ControlTemplate>
|
||||
</Window.Resources>
|
||||
<Grid>
|
||||
|
||||
</Grid>
|
||||
</Window>
|
||||
+25
@@ -0,0 +1,25 @@
|
||||
using System;
|
||||
using System.Collections.Generic;
|
||||
using System.Text;
|
||||
using System.Windows;
|
||||
using System.Windows.Controls;
|
||||
using System.Windows.Data;
|
||||
using System.Windows.Documents;
|
||||
using System.Windows.Input;
|
||||
using System.Windows.Media;
|
||||
using System.Windows.Media.Imaging;
|
||||
using System.Windows.Shapes;
|
||||
|
||||
namespace IntroToStylingAndTemplating
|
||||
{
|
||||
/// <summary>
|
||||
/// Interaction logic for Window6.xaml
|
||||
/// </summary>
|
||||
public partial class Window6 : Window
|
||||
{
|
||||
public Window6()
|
||||
{
|
||||
InitializeComponent();
|
||||
}
|
||||
}
|
||||
}
|
||||
+45
@@ -0,0 +1,45 @@
|
||||
<Window x:Class="IntroToStylingAndTemplating.Window7"
|
||||
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
|
||||
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
|
||||
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
|
||||
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
|
||||
xmlns:local="clr-namespace:IntroToStylingAndTemplating"
|
||||
mc:Ignorable="d"
|
||||
Title="Template Intro Sample" SizeToContent="WidthAndHeight" MinWidth="250">
|
||||
<Window.Resources>
|
||||
<!--<FinalTemplate>-->
|
||||
<ControlTemplate x:Key="roundbutton" TargetType="Button">
|
||||
<Grid>
|
||||
<VisualStateManager.VisualStateGroups>
|
||||
<VisualStateGroup Name="CommonStates">
|
||||
<VisualState Name="Normal">
|
||||
<Storyboard>
|
||||
<ColorAnimation Storyboard.TargetName="backgroundElement"
|
||||
Storyboard.TargetProperty="(Shape.Fill).(SolidColorBrush.Color)"
|
||||
To="{TemplateBinding Background}"
|
||||
Duration="0:0:0.3"/>
|
||||
</Storyboard>
|
||||
</VisualState>
|
||||
<VisualState Name="MouseOver">
|
||||
<Storyboard>
|
||||
<ColorAnimation Storyboard.TargetName="backgroundElement"
|
||||
Storyboard.TargetProperty="(Shape.Fill).(SolidColorBrush.Color)"
|
||||
To="Yellow"
|
||||
Duration="0:0:0.3"/>
|
||||
</Storyboard>
|
||||
</VisualState>
|
||||
</VisualStateGroup>
|
||||
</VisualStateManager.VisualStateGroups>
|
||||
<Ellipse Name="backgroundElement" Fill="{TemplateBinding Background}" Stroke="{TemplateBinding Foreground}" />
|
||||
<ContentPresenter x:Name="contentPresenter" HorizontalAlignment="Center" VerticalAlignment="Center" />
|
||||
</Grid>
|
||||
</ControlTemplate>
|
||||
<!--</FinalTemplate>-->
|
||||
</Window.Resources>
|
||||
<StackPanel Margin="10">
|
||||
<Label>Unstyled Button</Label>
|
||||
<Button>Button 1</Button>
|
||||
<Label>Rounded Button</Label>
|
||||
<Button Template="{StaticResource roundbutton}" Width="65" Height="65" Click="Button_Click">Button 2</Button>
|
||||
</StackPanel>
|
||||
</Window>
|
||||
+30
@@ -0,0 +1,30 @@
|
||||
using System;
|
||||
using System.Collections.Generic;
|
||||
using System.Text;
|
||||
using System.Windows;
|
||||
using System.Windows.Controls;
|
||||
using System.Windows.Data;
|
||||
using System.Windows.Documents;
|
||||
using System.Windows.Input;
|
||||
using System.Windows.Media;
|
||||
using System.Windows.Media.Imaging;
|
||||
using System.Windows.Shapes;
|
||||
|
||||
namespace IntroToStylingAndTemplating
|
||||
{
|
||||
/// <summary>
|
||||
/// Interaction logic for Window7.xaml
|
||||
/// </summary>
|
||||
public partial class Window7 : Window
|
||||
{
|
||||
public Window7()
|
||||
{
|
||||
InitializeComponent();
|
||||
}
|
||||
|
||||
private void Button_Click(object sender, RoutedEventArgs e)
|
||||
{
|
||||
MessageBox.Show("Clicked");
|
||||
}
|
||||
}
|
||||
}
|
||||
+25
@@ -0,0 +1,25 @@
|
||||
<Window x:Class="IntroToStylingAndTemplating.ExplicitStyle"
|
||||
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
|
||||
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
|
||||
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
|
||||
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
|
||||
xmlns:local="clr-namespace:IntroToStylingAndTemplating"
|
||||
mc:Ignorable="d"
|
||||
Height="100" Width="300"
|
||||
Title="Style Intro Sample">
|
||||
<!--<ExplicitStyleDeclare>-->
|
||||
<Window.Resources>
|
||||
<Style x:Key="TitleText" TargetType="TextBlock">
|
||||
<Setter Property="HorizontalAlignment" Value="Center" />
|
||||
<Setter Property="FontFamily" Value="Comic Sans MS"/>
|
||||
<Setter Property="FontSize" Value="14"/>
|
||||
</Style>
|
||||
</Window.Resources>
|
||||
<!--</ExplicitStyleDeclare>-->
|
||||
<!--<ExplicitStyleReference>-->
|
||||
<StackPanel>
|
||||
<TextBlock Style="{StaticResource TitleText}">My Pictures</TextBlock>
|
||||
<TextBlock>Check out my new pictures!</TextBlock>
|
||||
</StackPanel>
|
||||
<!--</ExplicitStyleReference>-->
|
||||
</Window>
|
||||
+25
@@ -0,0 +1,25 @@
|
||||
using System;
|
||||
using System.Collections.Generic;
|
||||
using System.Text;
|
||||
using System.Windows;
|
||||
using System.Windows.Controls;
|
||||
using System.Windows.Data;
|
||||
using System.Windows.Documents;
|
||||
using System.Windows.Input;
|
||||
using System.Windows.Media;
|
||||
using System.Windows.Media.Imaging;
|
||||
using System.Windows.Shapes;
|
||||
|
||||
namespace IntroToStylingAndTemplating
|
||||
{
|
||||
/// <summary>
|
||||
/// Interaction logic for ExplicitStyle.xaml
|
||||
/// </summary>
|
||||
public partial class ExplicitStyle : Window
|
||||
{
|
||||
public ExplicitStyle()
|
||||
{
|
||||
InitializeComponent();
|
||||
}
|
||||
}
|
||||
}
|
||||
+20
@@ -0,0 +1,20 @@
|
||||
<!--<WindowResources>-->
|
||||
<Window x:Class="IntroToStylingAndTemplating.WindowSingleResource"
|
||||
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
|
||||
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
|
||||
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
|
||||
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
|
||||
xmlns:local="clr-namespace:IntroToStylingAndTemplating"
|
||||
mc:Ignorable="d"
|
||||
Title="WindowSingleResource" Height="450" Width="800">
|
||||
<Window.Resources>
|
||||
|
||||
<Style x:Key="Header1" TargetType="TextBlock">
|
||||
<Setter Property="FontSize" Value="15" />
|
||||
<Setter Property="FontWeight" Value="ExtraBold" />
|
||||
</Style>
|
||||
|
||||
</Window.Resources>
|
||||
<Grid />
|
||||
</Window>
|
||||
<!--</WindowResources>-->
|
||||
+25
@@ -0,0 +1,25 @@
|
||||
using System;
|
||||
using System.Collections.Generic;
|
||||
using System.Text;
|
||||
using System.Windows;
|
||||
using System.Windows.Controls;
|
||||
using System.Windows.Data;
|
||||
using System.Windows.Documents;
|
||||
using System.Windows.Input;
|
||||
using System.Windows.Media;
|
||||
using System.Windows.Media.Imaging;
|
||||
using System.Windows.Shapes;
|
||||
|
||||
namespace IntroToStylingAndTemplating
|
||||
{
|
||||
/// <summary>
|
||||
/// Interaction logic for WindowSingleResource.xaml
|
||||
/// </summary>
|
||||
public partial class WindowSingleResource : Window
|
||||
{
|
||||
public WindowSingleResource()
|
||||
{
|
||||
InitializeComponent();
|
||||
}
|
||||
}
|
||||
}
|
||||
+9
@@ -0,0 +1,9 @@
|
||||
<Application x:Class="Application"
|
||||
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
|
||||
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
|
||||
xmlns:local="clr-namespace:IntroToStylingAndTemplating"
|
||||
StartupUri="MainWindow.xaml">
|
||||
<Application.Resources>
|
||||
|
||||
</Application.Resources>
|
||||
</Application>
|
||||
+6
@@ -0,0 +1,6 @@
|
||||
Class Application
|
||||
|
||||
' Application-level events, such as Startup, Exit, and DispatcherUnhandledException
|
||||
' can be handled in this file.
|
||||
|
||||
End Class
|
||||
+18
@@ -0,0 +1,18 @@
|
||||
<Window x:Class="MainWindow"
|
||||
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
|
||||
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
|
||||
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
|
||||
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
|
||||
xmlns:local="clr-namespace:IntroToStylingAndTemplating"
|
||||
mc:Ignorable="d"
|
||||
Title="Template Intro Sample" Loaded="WindowLoaded" SizeToContent="WidthAndHeight" MinWidth="250">
|
||||
<Window.Resources>
|
||||
|
||||
</Window.Resources>
|
||||
<StackPanel Margin="10">
|
||||
<Label>Unstyled Button</Label>
|
||||
<Button>Button 1</Button>
|
||||
<Label>Rounded Button</Label>
|
||||
<Button>Button 2</Button>
|
||||
</StackPanel>
|
||||
</Window>
|
||||
+6
@@ -0,0 +1,6 @@
|
||||
Class MainWindow
|
||||
|
||||
Private Sub WindowLoaded(sender As Object, e As Windows.RoutedEventArgs)
|
||||
|
||||
End Sub
|
||||
End Class
|
||||
+11
@@ -0,0 +1,11 @@
|
||||
<Project Sdk="Microsoft.NET.Sdk">
|
||||
|
||||
<PropertyGroup>
|
||||
<OutputType>WinExe</OutputType>
|
||||
<TargetFramework>net5.0-windows</TargetFramework>
|
||||
<RootNamespace>IntroToStylingAndTemplating</RootNamespace>
|
||||
<UseWpf>true</UseWpf>
|
||||
<AssemblyName>IntroToStylingAndTemplating</AssemblyName>
|
||||
</PropertyGroup>
|
||||
|
||||
</Project>
|
||||
+14
@@ -0,0 +1,14 @@
|
||||
// // Copyright (c) Microsoft. All rights reserved.
|
||||
// // Licensed under the MIT license. See LICENSE file in the project root for full license information.
|
||||
|
||||
using System.Windows;
|
||||
|
||||
namespace IntroToStylingAndTemplating
|
||||
{
|
||||
/// <summary>
|
||||
/// Interaction logic for App.xaml
|
||||
/// </summary>
|
||||
public partial class App : Application
|
||||
{
|
||||
}
|
||||
}
|
||||
+18
@@ -0,0 +1,18 @@
|
||||
<!--<AppResources>-->
|
||||
<Application x:Class="IntroToStylingAndTemplating.App"
|
||||
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
|
||||
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
|
||||
xmlns:local="clr-namespace:IntroToStylingAndTemplating"
|
||||
StartupUri="WindowExplicitStyle.xaml">
|
||||
<Application.Resources>
|
||||
<ResourceDictionary>
|
||||
|
||||
<Style x:Key="Header1" TargetType="TextBlock">
|
||||
<Setter Property="FontSize" Value="15" />
|
||||
<Setter Property="FontWeight" Value="ExtraBold" />
|
||||
</Style>
|
||||
|
||||
</ResourceDictionary>
|
||||
</Application.Resources>
|
||||
</Application>
|
||||
<!--</AppResources>-->
|
||||
+29
@@ -0,0 +1,29 @@
|
||||
<Project Sdk="Microsoft.NET.Sdk">
|
||||
|
||||
<PropertyGroup>
|
||||
<OutputType>WinExe</OutputType>
|
||||
<TargetFramework>net5.0-windows</TargetFramework>
|
||||
<RootNamespace>IntroToStylingAndTemplating</RootNamespace>
|
||||
<UseWpf>true</UseWpf>
|
||||
<AssemblyName>IntroToStylingAndTemplating</AssemblyName>
|
||||
</PropertyGroup>
|
||||
|
||||
<ItemGroup>
|
||||
<None Include="images\flower1.jpg">
|
||||
<CopyToOutputDirectory>Always</CopyToOutputDirectory>
|
||||
</None>
|
||||
<None Include="images\flower2.jpg">
|
||||
<CopyToOutputDirectory>Always</CopyToOutputDirectory>
|
||||
</None>
|
||||
<None Include="images\leaf1.jpg">
|
||||
<CopyToOutputDirectory>Always</CopyToOutputDirectory>
|
||||
</None>
|
||||
<None Include="images\leaf2.jpg">
|
||||
<CopyToOutputDirectory>Always</CopyToOutputDirectory>
|
||||
</None>
|
||||
<None Include="images\winter1.jpg">
|
||||
<CopyToOutputDirectory>Always</CopyToOutputDirectory>
|
||||
</None>
|
||||
</ItemGroup>
|
||||
|
||||
</Project>
|
||||
+27
@@ -0,0 +1,27 @@
|
||||
// // Copyright (c) Microsoft. All rights reserved.
|
||||
// // Licensed under the MIT license. See LICENSE file in the project root for full license information.
|
||||
|
||||
using System.Windows;
|
||||
using System.Windows.Data;
|
||||
|
||||
namespace IntroToStylingAndTemplating
|
||||
{
|
||||
/// <summary>
|
||||
/// Interaction logic for MainWindow.xaml
|
||||
/// </summary>
|
||||
public partial class MainWindow : Window
|
||||
{
|
||||
private PhotoList _photos;
|
||||
|
||||
public MainWindow()
|
||||
{
|
||||
InitializeComponent();
|
||||
}
|
||||
|
||||
private void WindowLoaded(object sender, RoutedEventArgs e)
|
||||
{
|
||||
_photos = (PhotoList) (Resources["MyPhotos"] as ObjectDataProvider).Data;
|
||||
_photos.Path = "images";
|
||||
}
|
||||
}
|
||||
}
|
||||
+106
@@ -0,0 +1,106 @@
|
||||
<Window x:Class="IntroToStylingAndTemplating.MainWindow"
|
||||
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
|
||||
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
|
||||
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
|
||||
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
|
||||
xmlns:local="clr-namespace:IntroToStylingAndTemplating"
|
||||
mc:Ignorable="d"
|
||||
Title="Style Intro Sample" Loaded="WindowLoaded" SizeToContent="WidthAndHeight">
|
||||
<Window.Resources>
|
||||
<ObjectDataProvider x:Key="MyPhotos" ObjectType="{x:Type local:PhotoList}"/>
|
||||
|
||||
<!--A Style that affects all TextBlocks-->
|
||||
<Style TargetType="TextBlock">
|
||||
<Setter Property="HorizontalAlignment" Value="Center" />
|
||||
<Setter Property="FontFamily" Value="Comic Sans MS"/>
|
||||
<Setter Property="FontSize" Value="14"/>
|
||||
</Style>
|
||||
|
||||
<!--A Style that extends the previous TextBlock Style-->
|
||||
<!--This is a "named style" with an x:Key of TitleText-->
|
||||
<Style BasedOn="{StaticResource {x:Type TextBlock}}"
|
||||
TargetType="TextBlock"
|
||||
x:Key="TitleText">
|
||||
<Setter Property="FontSize" Value="26"/>
|
||||
<Setter Property="Foreground">
|
||||
<Setter.Value>
|
||||
<LinearGradientBrush StartPoint="0.5,0" EndPoint="0.5,1">
|
||||
<LinearGradientBrush.GradientStops>
|
||||
<GradientStop Offset="0.0" Color="#90DDDD" />
|
||||
<GradientStop Offset="1.0" Color="#5BFFFF" />
|
||||
</LinearGradientBrush.GradientStops>
|
||||
</LinearGradientBrush>
|
||||
</Setter.Value>
|
||||
</Setter>
|
||||
</Style>
|
||||
|
||||
<!--Horizontal ListBox Control Template-->
|
||||
<Style TargetType="ListBox">
|
||||
<Setter Property="Template">
|
||||
<Setter.Value>
|
||||
<ControlTemplate TargetType="ListBox">
|
||||
<Border CornerRadius="5" Background="{TemplateBinding ListBox.Background}">
|
||||
<ScrollViewer HorizontalScrollBarVisibility="Auto">
|
||||
<StackPanel Orientation="Horizontal"
|
||||
VerticalAlignment="Center"
|
||||
HorizontalAlignment="Center"
|
||||
IsItemsHost="True"/>
|
||||
</ScrollViewer>
|
||||
</Border>
|
||||
</ControlTemplate>
|
||||
</Setter.Value>
|
||||
</Setter>
|
||||
</Style>
|
||||
|
||||
<!--DataTemplate to display Photos as images
|
||||
instead of text strings of Paths-->
|
||||
<DataTemplate DataType="{x:Type local:Photo}">
|
||||
<Border Margin="3">
|
||||
<Image Source="{Binding Source}"/>
|
||||
</Border>
|
||||
</DataTemplate>
|
||||
|
||||
<Style TargetType="ListBoxItem">
|
||||
<Setter Property="Opacity" Value="0.5" />
|
||||
<Setter Property="MaxHeight" Value="75" />
|
||||
<Style.Triggers>
|
||||
<Trigger Property="IsSelected" Value="True">
|
||||
<Trigger.Setters>
|
||||
<Setter Property="Opacity" Value="1.0" />
|
||||
</Trigger.Setters>
|
||||
</Trigger>
|
||||
<EventTrigger RoutedEvent="Mouse.MouseEnter">
|
||||
<EventTrigger.Actions>
|
||||
<BeginStoryboard>
|
||||
<Storyboard>
|
||||
<DoubleAnimation
|
||||
Duration="0:0:0.2"
|
||||
Storyboard.TargetProperty="MaxHeight"
|
||||
To="90" />
|
||||
</Storyboard>
|
||||
</BeginStoryboard>
|
||||
</EventTrigger.Actions>
|
||||
</EventTrigger>
|
||||
<EventTrigger RoutedEvent="Mouse.MouseLeave">
|
||||
<EventTrigger.Actions>
|
||||
<BeginStoryboard>
|
||||
<Storyboard>
|
||||
<DoubleAnimation
|
||||
Duration="0:0:1"
|
||||
Storyboard.TargetProperty="MaxHeight" />
|
||||
</Storyboard>
|
||||
</BeginStoryboard>
|
||||
</EventTrigger.Actions>
|
||||
</EventTrigger>
|
||||
</Style.Triggers>
|
||||
</Style>
|
||||
|
||||
</Window.Resources>
|
||||
<StackPanel Margin="10">
|
||||
<TextBlock Style="{StaticResource TitleText}" Name="textblock1">My Pictures</TextBlock>
|
||||
<TextBlock>Check out my new pictures!</TextBlock>
|
||||
|
||||
<ListBox ItemsSource="{Binding Source={StaticResource MyPhotos}}"
|
||||
Background="Silver" Width="600" Margin="10" SelectedIndex="0"/>
|
||||
</StackPanel>
|
||||
</Window>
|
||||
+19
@@ -0,0 +1,19 @@
|
||||
// // Copyright (c) Microsoft. All rights reserved.
|
||||
// // Licensed under the MIT license. See LICENSE file in the project root for full license information.
|
||||
|
||||
namespace IntroToStylingAndTemplating
|
||||
{
|
||||
// <PhotoClass>
|
||||
public class Photo
|
||||
{
|
||||
public Photo(string path)
|
||||
{
|
||||
Source = path;
|
||||
}
|
||||
|
||||
public string Source { get; }
|
||||
|
||||
public override string ToString() => Source;
|
||||
}
|
||||
// </PhotoClass>
|
||||
}
|
||||
+55
@@ -0,0 +1,55 @@
|
||||
// // Copyright (c) Microsoft. All rights reserved.
|
||||
// // Licensed under the MIT license. See LICENSE file in the project root for full license information.
|
||||
|
||||
using System.Collections.ObjectModel;
|
||||
using System.IO;
|
||||
|
||||
namespace IntroToStylingAndTemplating
|
||||
{
|
||||
public class PhotoList : ObservableCollection<Photo>
|
||||
{
|
||||
private DirectoryInfo _directory;
|
||||
|
||||
public PhotoList()
|
||||
{
|
||||
}
|
||||
|
||||
public PhotoList(string path) : this(new DirectoryInfo(path))
|
||||
{
|
||||
}
|
||||
|
||||
public PhotoList(DirectoryInfo directory)
|
||||
{
|
||||
_directory = directory;
|
||||
Update();
|
||||
}
|
||||
|
||||
public string Path
|
||||
{
|
||||
set
|
||||
{
|
||||
_directory = new DirectoryInfo(value);
|
||||
Update();
|
||||
}
|
||||
get { return _directory.FullName; }
|
||||
}
|
||||
|
||||
public DirectoryInfo Directory
|
||||
{
|
||||
set
|
||||
{
|
||||
_directory = value;
|
||||
Update();
|
||||
}
|
||||
get { return _directory; }
|
||||
}
|
||||
|
||||
private void Update()
|
||||
{
|
||||
foreach (var f in _directory.GetFiles("*.jpg"))
|
||||
{
|
||||
Add(new Photo(f.FullName));
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
+25
@@ -0,0 +1,25 @@
|
||||
<Window x:Class="IntroToStylingAndTemplating.Window1"
|
||||
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
|
||||
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
|
||||
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
|
||||
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
|
||||
xmlns:local="clr-namespace:IntroToStylingAndTemplating"
|
||||
mc:Ignorable="d"
|
||||
Title="Window1" Height="450" Width="800">
|
||||
<!--<SnippetDefaultTextBlockStyle>-->
|
||||
<Window.Resources>
|
||||
<!--A Style that affects all TextBlocks-->
|
||||
<Style TargetType="TextBlock">
|
||||
<Setter Property="HorizontalAlignment" Value="Center" />
|
||||
<Setter Property="FontFamily" Value="Comic Sans MS"/>
|
||||
<Setter Property="FontSize" Value="14"/>
|
||||
</Style>
|
||||
</Window.Resources>
|
||||
<!--</SnippetDefaultTextBlockStyle>-->
|
||||
<!--<SnippetTextBlocks>-->
|
||||
<StackPanel>
|
||||
<TextBlock>My Pictures</TextBlock>
|
||||
<TextBlock>Check out my new pictures!</TextBlock>
|
||||
</StackPanel>
|
||||
<!--</SnippetTextBlocks>-->
|
||||
</Window>
|
||||
+25
@@ -0,0 +1,25 @@
|
||||
using System;
|
||||
using System.Collections.Generic;
|
||||
using System.Text;
|
||||
using System.Windows;
|
||||
using System.Windows.Controls;
|
||||
using System.Windows.Data;
|
||||
using System.Windows.Documents;
|
||||
using System.Windows.Input;
|
||||
using System.Windows.Media;
|
||||
using System.Windows.Media.Imaging;
|
||||
using System.Windows.Shapes;
|
||||
|
||||
namespace IntroToStylingAndTemplating
|
||||
{
|
||||
/// <summary>
|
||||
/// Interaction logic for Window1.xaml
|
||||
/// </summary>
|
||||
public partial class Window1 : Window
|
||||
{
|
||||
public Window1()
|
||||
{
|
||||
InitializeComponent();
|
||||
}
|
||||
}
|
||||
}
|
||||
+44
@@ -0,0 +1,44 @@
|
||||
<Window x:Class="IntroToStylingAndTemplating.Window2"
|
||||
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
|
||||
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
|
||||
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
|
||||
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
|
||||
xmlns:local="clr-namespace:IntroToStylingAndTemplating"
|
||||
mc:Ignorable="d"
|
||||
Title="Window2" Height="450" Width="800" Loaded="Window_Loaded">
|
||||
<!--<SnippetDefaultTextBlockStyleBasedOn>-->
|
||||
<Window.Resources>
|
||||
<!-- .... other resources .... -->
|
||||
|
||||
<!--A Style that affects all TextBlocks-->
|
||||
<Style TargetType="TextBlock">
|
||||
<Setter Property="HorizontalAlignment" Value="Center" />
|
||||
<Setter Property="FontFamily" Value="Comic Sans MS"/>
|
||||
<Setter Property="FontSize" Value="14"/>
|
||||
</Style>
|
||||
|
||||
<!--A Style that extends the previous TextBlock Style with an x:Key of TitleText-->
|
||||
<Style BasedOn="{StaticResource {x:Type TextBlock}}"
|
||||
TargetType="TextBlock"
|
||||
x:Key="TitleText">
|
||||
<Setter Property="FontSize" Value="26"/>
|
||||
<Setter Property="Foreground">
|
||||
<Setter.Value>
|
||||
<LinearGradientBrush StartPoint="0.5,0" EndPoint="0.5,1">
|
||||
<LinearGradientBrush.GradientStops>
|
||||
<GradientStop Offset="0.0" Color="#90DDDD" />
|
||||
<GradientStop Offset="1.0" Color="#5BFFFF" />
|
||||
</LinearGradientBrush.GradientStops>
|
||||
</LinearGradientBrush>
|
||||
</Setter.Value>
|
||||
</Setter>
|
||||
</Style>
|
||||
</Window.Resources>
|
||||
<!--</SnippetDefaultTextBlockStyleBasedOn>-->
|
||||
<!--<SnippetTextBlocksExplicit>-->
|
||||
<StackPanel>
|
||||
<TextBlock Style="{StaticResource TitleText}" Name="textblock1">My Pictures</TextBlock>
|
||||
<TextBlock>Check out my new pictures!</TextBlock>
|
||||
</StackPanel>
|
||||
<!--</SnippetTextBlocksExplicit>-->
|
||||
</Window>
|
||||
+32
@@ -0,0 +1,32 @@
|
||||
using System;
|
||||
using System.Collections.Generic;
|
||||
using System.Text;
|
||||
using System.Windows;
|
||||
using System.Windows.Controls;
|
||||
using System.Windows.Data;
|
||||
using System.Windows.Documents;
|
||||
using System.Windows.Input;
|
||||
using System.Windows.Media;
|
||||
using System.Windows.Media.Imaging;
|
||||
using System.Windows.Shapes;
|
||||
|
||||
namespace IntroToStylingAndTemplating
|
||||
{
|
||||
/// <summary>
|
||||
/// Interaction logic for Window2.xaml
|
||||
/// </summary>
|
||||
public partial class Window2 : Window
|
||||
{
|
||||
public Window2()
|
||||
{
|
||||
InitializeComponent();
|
||||
}
|
||||
|
||||
private void Window_Loaded(object sender, RoutedEventArgs e)
|
||||
{
|
||||
// <SnippetSetStyleCode>
|
||||
textblock1.Style = (Style)Resources["TitleText"];
|
||||
// </SnippetSetStyleCode>
|
||||
}
|
||||
}
|
||||
}
|
||||
+20
@@ -0,0 +1,20 @@
|
||||
<Window x:Class="IntroToStylingAndTemplating.Window3"
|
||||
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
|
||||
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
|
||||
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
|
||||
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
|
||||
xmlns:local="clr-namespace:IntroToStylingAndTemplating"
|
||||
mc:Ignorable="d"
|
||||
Title="Window3" Height="450" Width="800">
|
||||
<Window.Resources>
|
||||
<ObjectDataProvider x:Key="MyPhotos" ObjectType="{x:Type local:PhotoList}"/>
|
||||
</Window.Resources>
|
||||
<StackPanel>
|
||||
<TextBlock>My Pictures</TextBlock>
|
||||
<TextBlock>Check out my new pictures!</TextBlock>
|
||||
<!--<SnippetListBox>-->
|
||||
<ListBox ItemsSource="{Binding Source={StaticResource MyPhotos}}"
|
||||
Background="Silver" Width="600" Margin="10" SelectedIndex="0"/>
|
||||
<!--</SnippetListBox>-->
|
||||
</StackPanel>
|
||||
</Window>
|
||||
+25
@@ -0,0 +1,25 @@
|
||||
using System;
|
||||
using System.Collections.Generic;
|
||||
using System.Text;
|
||||
using System.Windows;
|
||||
using System.Windows.Controls;
|
||||
using System.Windows.Data;
|
||||
using System.Windows.Documents;
|
||||
using System.Windows.Input;
|
||||
using System.Windows.Media;
|
||||
using System.Windows.Media.Imaging;
|
||||
using System.Windows.Shapes;
|
||||
|
||||
namespace IntroToStylingAndTemplating
|
||||
{
|
||||
/// <summary>
|
||||
/// Interaction logic for Window3.xaml
|
||||
/// </summary>
|
||||
public partial class Window3 : Window
|
||||
{
|
||||
public Window3()
|
||||
{
|
||||
InitializeComponent();
|
||||
}
|
||||
}
|
||||
}
|
||||
+26
@@ -0,0 +1,26 @@
|
||||
<Window x:Class="IntroToStylingAndTemplating.Window4"
|
||||
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
|
||||
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
|
||||
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
|
||||
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
|
||||
xmlns:local="clr-namespace:IntroToStylingAndTemplating"
|
||||
mc:Ignorable="d"
|
||||
Title="Window4" Height="450" Width="800">
|
||||
<!--<SnippetDataTemplate>-->
|
||||
<Window.Resources>
|
||||
<!-- .... other resources .... -->
|
||||
|
||||
<!--DataTemplate to display Photos as images
|
||||
instead of text strings of Paths-->
|
||||
<DataTemplate DataType="{x:Type local:Photo}">
|
||||
<Border Margin="3">
|
||||
<Image Source="{Binding Source}"/>
|
||||
</Border>
|
||||
</DataTemplate>
|
||||
</Window.Resources>
|
||||
<!--</SnippetDataTemplate>-->
|
||||
<StackPanel>
|
||||
<TextBlock>My Pictures</TextBlock>
|
||||
<TextBlock>Check out my new pictures!</TextBlock>
|
||||
</StackPanel>
|
||||
</Window>
|
||||
+25
@@ -0,0 +1,25 @@
|
||||
using System;
|
||||
using System.Collections.Generic;
|
||||
using System.Text;
|
||||
using System.Windows;
|
||||
using System.Windows.Controls;
|
||||
using System.Windows.Data;
|
||||
using System.Windows.Documents;
|
||||
using System.Windows.Input;
|
||||
using System.Windows.Media;
|
||||
using System.Windows.Media.Imaging;
|
||||
using System.Windows.Shapes;
|
||||
|
||||
namespace IntroToStylingAndTemplating
|
||||
{
|
||||
/// <summary>
|
||||
/// Interaction logic for Window4.xaml
|
||||
/// </summary>
|
||||
public partial class Window4 : Window
|
||||
{
|
||||
public Window4()
|
||||
{
|
||||
InitializeComponent();
|
||||
}
|
||||
}
|
||||
}
|
||||
+30
@@ -0,0 +1,30 @@
|
||||
<Window x:Class="IntroToStylingAndTemplating.Window5"
|
||||
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
|
||||
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
|
||||
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
|
||||
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
|
||||
xmlns:local="clr-namespace:IntroToStylingAndTemplating"
|
||||
mc:Ignorable="d"
|
||||
Title="Window5" Height="450" Width="800">
|
||||
<!--<SnippetPropertyTrigger>-->
|
||||
<Window.Resources>
|
||||
<!-- .... other resources .... -->
|
||||
|
||||
<Style TargetType="ListBoxItem">
|
||||
<Setter Property="Opacity" Value="0.5" />
|
||||
<Setter Property="MaxHeight" Value="75" />
|
||||
<Style.Triggers>
|
||||
<Trigger Property="IsSelected" Value="True">
|
||||
<Trigger.Setters>
|
||||
<Setter Property="Opacity" Value="1.0" />
|
||||
</Trigger.Setters>
|
||||
</Trigger>
|
||||
</Style.Triggers>
|
||||
</Style>
|
||||
</Window.Resources>
|
||||
<!--</SnippetPropertyTrigger>-->
|
||||
<StackPanel>
|
||||
<TextBlock>My Pictures</TextBlock>
|
||||
<TextBlock>Check out my new pictures!</TextBlock>
|
||||
</StackPanel>
|
||||
</Window>
|
||||
+25
@@ -0,0 +1,25 @@
|
||||
using System;
|
||||
using System.Collections.Generic;
|
||||
using System.Text;
|
||||
using System.Windows;
|
||||
using System.Windows.Controls;
|
||||
using System.Windows.Data;
|
||||
using System.Windows.Documents;
|
||||
using System.Windows.Input;
|
||||
using System.Windows.Media;
|
||||
using System.Windows.Media.Imaging;
|
||||
using System.Windows.Shapes;
|
||||
|
||||
namespace IntroToStylingAndTemplating
|
||||
{
|
||||
/// <summary>
|
||||
/// Interaction logic for Window5.xaml
|
||||
/// </summary>
|
||||
public partial class Window5 : Window
|
||||
{
|
||||
public Window5()
|
||||
{
|
||||
InitializeComponent();
|
||||
}
|
||||
}
|
||||
}
|
||||
+53
@@ -0,0 +1,53 @@
|
||||
<Window x:Class="IntroToStylingAndTemplating.Window6"
|
||||
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
|
||||
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
|
||||
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
|
||||
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
|
||||
xmlns:local="clr-namespace:IntroToStylingAndTemplating"
|
||||
mc:Ignorable="d"
|
||||
Title="Window6" Height="450" Width="800">
|
||||
<Window.Resources>
|
||||
<!-- .... other resources .... -->
|
||||
|
||||
<Style TargetType="ListBoxItem">
|
||||
<Setter Property="Opacity" Value="0.5" />
|
||||
<Setter Property="MaxHeight" Value="75" />
|
||||
<!--<SnippetStyleEventTriggers>-->
|
||||
<Style.Triggers>
|
||||
<Trigger Property="IsSelected" Value="True">
|
||||
<Trigger.Setters>
|
||||
<Setter Property="Opacity" Value="1.0" />
|
||||
</Trigger.Setters>
|
||||
</Trigger>
|
||||
<EventTrigger RoutedEvent="Mouse.MouseEnter">
|
||||
<EventTrigger.Actions>
|
||||
<BeginStoryboard>
|
||||
<Storyboard>
|
||||
<DoubleAnimation
|
||||
Duration="0:0:0.2"
|
||||
Storyboard.TargetProperty="MaxHeight"
|
||||
To="90" />
|
||||
</Storyboard>
|
||||
</BeginStoryboard>
|
||||
</EventTrigger.Actions>
|
||||
</EventTrigger>
|
||||
<EventTrigger RoutedEvent="Mouse.MouseLeave">
|
||||
<EventTrigger.Actions>
|
||||
<BeginStoryboard>
|
||||
<Storyboard>
|
||||
<DoubleAnimation
|
||||
Duration="0:0:1"
|
||||
Storyboard.TargetProperty="MaxHeight" />
|
||||
</Storyboard>
|
||||
</BeginStoryboard>
|
||||
</EventTrigger.Actions>
|
||||
</EventTrigger>
|
||||
</Style.Triggers>
|
||||
<!--</SnippetStyleEventTriggers>-->
|
||||
</Style>
|
||||
</Window.Resources>
|
||||
<StackPanel>
|
||||
<TextBlock>My Pictures</TextBlock>
|
||||
<TextBlock>Check out my new pictures!</TextBlock>
|
||||
</StackPanel>
|
||||
</Window>
|
||||
+25
@@ -0,0 +1,25 @@
|
||||
using System;
|
||||
using System.Collections.Generic;
|
||||
using System.Text;
|
||||
using System.Windows;
|
||||
using System.Windows.Controls;
|
||||
using System.Windows.Data;
|
||||
using System.Windows.Documents;
|
||||
using System.Windows.Input;
|
||||
using System.Windows.Media;
|
||||
using System.Windows.Media.Imaging;
|
||||
using System.Windows.Shapes;
|
||||
|
||||
namespace IntroToStylingAndTemplating
|
||||
{
|
||||
/// <summary>
|
||||
/// Interaction logic for Window6.xaml
|
||||
/// </summary>
|
||||
public partial class Window6 : Window
|
||||
{
|
||||
public Window6()
|
||||
{
|
||||
InitializeComponent();
|
||||
}
|
||||
}
|
||||
}
|
||||
+25
@@ -0,0 +1,25 @@
|
||||
<Window x:Class="IntroToStylingAndTemplating.ExplicitStyle"
|
||||
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
|
||||
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
|
||||
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
|
||||
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
|
||||
xmlns:local="clr-namespace:IntroToStylingAndTemplating"
|
||||
mc:Ignorable="d"
|
||||
Height="100" Width="300"
|
||||
Title="Style Intro Sample">
|
||||
<!--<ExplicitStyleDeclare>-->
|
||||
<Window.Resources>
|
||||
<Style x:Key="TitleText" TargetType="TextBlock">
|
||||
<Setter Property="HorizontalAlignment" Value="Center" />
|
||||
<Setter Property="FontFamily" Value="Comic Sans MS"/>
|
||||
<Setter Property="FontSize" Value="14"/>
|
||||
</Style>
|
||||
</Window.Resources>
|
||||
<!--</ExplicitStyleDeclare>-->
|
||||
<!--<ExplicitStyleReference>-->
|
||||
<StackPanel>
|
||||
<TextBlock Style="{StaticResource TitleText}">My Pictures</TextBlock>
|
||||
<TextBlock>Check out my new pictures!</TextBlock>
|
||||
</StackPanel>
|
||||
<!--</ExplicitStyleReference>-->
|
||||
</Window>
|
||||
+25
@@ -0,0 +1,25 @@
|
||||
using System;
|
||||
using System.Collections.Generic;
|
||||
using System.Text;
|
||||
using System.Windows;
|
||||
using System.Windows.Controls;
|
||||
using System.Windows.Data;
|
||||
using System.Windows.Documents;
|
||||
using System.Windows.Input;
|
||||
using System.Windows.Media;
|
||||
using System.Windows.Media.Imaging;
|
||||
using System.Windows.Shapes;
|
||||
|
||||
namespace IntroToStylingAndTemplating
|
||||
{
|
||||
/// <summary>
|
||||
/// Interaction logic for ExplicitStyle.xaml
|
||||
/// </summary>
|
||||
public partial class ExplicitStyle : Window
|
||||
{
|
||||
public ExplicitStyle()
|
||||
{
|
||||
InitializeComponent();
|
||||
}
|
||||
}
|
||||
}
|
||||
+20
@@ -0,0 +1,20 @@
|
||||
<!--<WindowResources>-->
|
||||
<Window x:Class="IntroToStylingAndTemplating.WindowSingleResource"
|
||||
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
|
||||
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
|
||||
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
|
||||
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
|
||||
xmlns:local="clr-namespace:IntroToStylingAndTemplating"
|
||||
mc:Ignorable="d"
|
||||
Title="WindowSingleResource" Height="450" Width="800">
|
||||
<Window.Resources>
|
||||
|
||||
<Style x:Key="Header1" TargetType="TextBlock">
|
||||
<Setter Property="FontSize" Value="15" />
|
||||
<Setter Property="FontWeight" Value="ExtraBold" />
|
||||
</Style>
|
||||
|
||||
</Window.Resources>
|
||||
<Grid />
|
||||
</Window>
|
||||
<!--</WindowResources>-->
|
||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user