Silverlight 4 and Page.Resources Binding - silverlight

In my SL4 application, I have a Class called Images which has two properties (ImagePath, ImageName) and a method getImages() which retruns ObservableCollection list of all Images.
I need to create a Resource on my Page so that when a DataTemplate is loaded dynamically it can have access to the Images in one of its ComboBox field.
How can I do that?
<Page.Resources>
<local:Images x:Key="MyImages"/>
</Page.Resources>
But in my code behind file I cannot access the MyImages

You have 3 options
1. Use global app resource file.
<Application.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="Assets/StylesA.xaml"/>
<ResourceDictionary Source="Assets/StylesB.xaml" />
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</Application.Resources>
And within StylesA.xaml just put style you have to use
<StackPanel>
<StackPanel.Resources>
<Style x:Key="HeaderStyle" TargetType="TextBlock">
<Setter Property="FontWeight" Value="Bold"></Setter>
<Setter Property="FontSize" Value="12"></Setter>
</Style>
</StackPanel.Resources>
<TextBlock Style="{StaticResource HeaderStyle}"></TextBlock> ....
2. Use local control Resources section.
<StackPanel>
<StackPanel.Resources>
<Style x:Key="HeaderStyle" TargetType="TextBlock">
<Setter Property="FontWeight" Value="Bold"></Setter>
<Setter Property="FontSize" Value="12"></Setter>
</Style>
</StackPanel.Resources>
<TextBlock Style="{StaticResource HeaderStyle}"></TextBlock> ....
3. Just use Page.Resources within your page
<navigation:Page.Resources>
<Style x:Key="ButtonFocusVisual">
<Setter Property="Control.Template">
<Setter.Value>
<ControlTemplate>
<Border>
<Rectangle Margin="2" StrokeThickness="1" Stroke="#60000000" StrokeDashArray="1 2" />
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</navigation:Page.Resources>
I hope it will help. :)

Related

Applying default style to all wpf windows

I've got a wpf application that has 20+ windows, most of which serve as dialogs, and I'd like them all to have the same background color.
I've got a typed style for Window defined in a resource dictionary as follows
<Style TargetType="{x:Type Window}">
<Setter Property="SnapsToDevicePixels" Value="true"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Window}">
<Grid Background="{StaticResource WindowBackgroundBrush}">
<AdornerDecorator>
<ContentPresenter/>
</AdornerDecorator>
<ResizeGrip x:Name="WindowResizeGrip" HorizontalAlignment="Right" VerticalAlignment="Bottom" Visibility="Collapsed" IsTabStop="false"/>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="ResizeMode" Value="CanResizeWithGrip">
<Setter TargetName="WindowResizeGrip" Property="Visibility" Value="Visible"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
I've got the dictionary include in the resources for the Application and each Window as follows
<Application.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="/Resources/Resources.xaml"/>
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</Application.Resources>
<Window.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="/Resources/Resources.xaml"/>
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</Window.Resources>
In Visual Studio, the background brush in the property editor says "Inheritance", but the value says "White". I see the desired background color in Visual Studio, but when I run the application I still see a white background. Can anyone explain what I'm doing wrong here? The WindowBackgroundBrush is getting applied to other controls correctly.
Note if I simplify the Style to be just
<Style TargetType="{x:Type Window}">
<Setter Property="Background" Value="Aqua"/>
</Style>
Visual Studio shows the Background brush as "Style Setter" as the value source and shows the Aqua as the value source, but the window is still white when the app launches.
You did it all correct. Its working at my place ... How are you applying style to window ? I applied as follows..
<Window x:Class="WpfApplicationScratchpad.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:WpfApplicationScratchpad"
mc:Ignorable="d"
Title="MainWindow" Height="350" Width="525" Style="{StaticResource Style1}">
here Style1 is your style in resource dictionary. with the name 'Style1'
<Style x:Key="Style1" TargetType="{x:Type Window}">
<Setter Property="WindowStyle" Value="None"/>
<Setter Property="AllowsTransparency" Value="True"/>
<Setter Property="SnapsToDevicePixels" Value="true"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Window}">
<Grid Background="Beige">
<AdornerDecorator>
<ContentPresenter/>
</AdornerDecorator>
<ResizeGrip x:Name="WindowResizeGrip" HorizontalAlignment="Right" VerticalAlignment="Bottom" Visibility="Collapsed" IsTabStop="false"/>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="ResizeMode" Value="CanResizeWithGrip">
<Setter TargetName="WindowResizeGrip" Property="Visibility" Value="Visible"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>

Setting RenderTransform in a nested style

I'm using .Net 3.5 on Windows 8, with the default Aero theme.
This was supposed to be an answer to Scale Checkbox without scaling content but it didn't work as easily as I expected. I'm trying to:
scale the box in a checkbox control
in a style, so I can apply the change to all checkboxes (or only some)
independently of its text, with no need to compensate.
I have a UserControl with this Resources:
<UserControl.Resources>
<ResourceDictionary>
<!-- ... -->
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="../Resources/CheckBoxStyle.xaml" />
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</UserControl.Resources>
Resources/CheckBoxStyle.xaml is this:
<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:primitives="clr-namespace:System.Windows.Controls.Primitives;assembly=PresentationFramework">
<Style TargetType="{x:Type CheckBox}">
<Style.Resources>
<Style TargetType="{x:Type BulletDecorator}">
<Setter Property="RenderTransform">
<Setter.Value>
<ScaleTransform ScaleX="2" ScaleY="2"/>
</Setter.Value>
</Setter>
</Style>
</Style.Resources>
</Style>
</ResourceDictionary>
The primitives namespace is in case whatever I settle on needs to know what BulletDecorator is.
I found BulletDecorator in the Aero theme for .Net 3.5 from here, behind the "Default WPF Themes" link, per this answer.
I'm seeing no difference in the size of my checkbox boxes. I don't think I grabbed the wrong element type from the theme, but what else could be happening?
Edit 1:
BulletDecorator contains the checkbox's content anyway, so I tried dropping requirement #3. Now I have a huge box and huge text, and want to shrink the text back down. Here is CheckBoxStyle.xaml:
<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:primitives="clr-namespace:System.Windows.Controls.Primitives;assembly=PresentationFramework">
<Style TargetType="{x:Type CheckBox}">
<Style.Resources>
<Style TargetType="{x:Type ContentControl}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type ContentControl}">
<ContentPresenter>
<ContentPresenter.LayoutTransform>
<ScaleTransform ScaleX="0.5" ScaleY="0.5" />
</ContentPresenter.LayoutTransform>
</ContentPresenter>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</Style.Resources>
<Setter Property="LayoutTransform">
<Setter.Value>
<ScaleTransform ScaleX="2" ScaleY="2"/>
</Setter.Value>
</Setter>
</Style>
</ResourceDictionary>
I found a solution, although it's not perfect. A better answer would still be accepted.
I used Snoopto determine that the element I'm concerned with is already a ContentPresenter. It contains a TextBlock, but for some reason that can't be styled (and it's shown in parentheses in Snoop's hierarchy). Here's my resulting CheckBoxStyle.xaml:
<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:primitives="clr-namespace:System.Windows.Controls.Primitives;assembly=PresentationFramework">
<Style TargetType="{x:Type CheckBox}">
<Style.Resources>
<Style TargetType="{x:Type ContentPresenter}">
<Setter Property="LayoutTransform">
<Setter.Value>
<ScaleTransform ScaleX="0.5" ScaleY="0.5" />
</Setter.Value>
</Setter>
</Style>
</Style.Resources>
<Setter Property="LayoutTransform">
<Setter.Value>
<ScaleTransform ScaleX="2" ScaleY="2"/>
</Setter.Value>
</Setter>
</Style>
</ResourceDictionary>

Is there a container where I can target the styles of a number of elements

In WPF is there container like an HTML div (where this is easy), where I could target all textblocks within that container? So I do not have to specify the style on every textblock?
I have a complex canvas and in just a region I would like to target the textblocks.
Something to the effect of this (where something other than StackPanel that would work as a style targeting container):
<StackPanel>
<StackPanel.Resources>
<Style TargetType="{x:Type TextBlock}">
<Setter Property="Foreground" Value="White"></Setter>
<Setter Property="FontFamily" Value="Arial"></Setter>
</Style>
</StackPanel.Resources>
<TextBlock Canvas.Left="87" Canvas.Top="210">
mytext1
</TextBlock>
<TextBlock Canvas.Left="87" Canvas.Top="232">
mytext2
</TextBlock>
<TextBlock Canvas.Left="87" Canvas.Top="254">
mytext2
</TextBlock>
</StackPanel>
So if I try a grid the canvas coordinates get ignored and my textblock appears at the top of the canvas.
<Window x:Class="WpfApplication1.Window1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="Window1" Height="300" Width="300">
<Canvas Width="500" Height="500">
<Grid>
<Grid.Resources>
<Style TargetType="TextBlock">
<Setter Property="Foreground" Value="Red"></Setter>
</Style>
</Grid.Resources>
<TextBlock Text="MyTextBlock1" Canvas.Left="300" Canvas.Top="300">
</TextBlock>
</Grid>
</Canvas>
In this case you are using the canvas coordinates to give 87 spacing on the left and 22 spacing between tops of elements. The StackPanel is already laying out the items one after another. You just need to set the margins for your textblocks
<StackPanel>
<StackPanel.Resources>
<Style TargetType="{x:Type TextBlock}">
<Setter Property="Foreground" Value="Red"></Setter>
<Setter Property="FontFamily" Value="Arial"></Setter>
<Setter Property="FontSize" Value="14" />
<Setter Property="Margin" Value="87,4, 0, 4" />
</Style>
</StackPanel.Resources>
<TextBlock>mytext1</TextBlock>
<TextBlock>mytext2</TextBlock>
<TextBlock>mytext3</TextBlock>
</StackPanel>
To answer your question you can use a Grid control (or Canvas or any other element) wherever you wish to isolate a Resources section. Grid does not perform any layout.
<StackPanel>
<StackPanel.Resources>
<Style TargetType="{x:Type TextBlock}">
<Setter Property="Foreground" Value="White"></Setter>
<Setter Property="FontFamily" Value="Arial"></Setter>
</Style>
</StackPanel.Resources>
<TextBlock>
mytext1
</TextBlock>
<Canvas>
<Canvas.Resources>
<Style TargetType="{x:Type TextBlock}">
<Setter Property="Foreground" Value="Red"></Setter>
<Setter Property="FontFamily" Value="Times"></Setter>
</Style>
</Canvas.Resources>
<TextBlock Canvas.Left="87" Canvas.Top="210">mytext2</TextBlock>
<TextBlock Canvas.Left="87" Canvas.Top="232">mytext2</TextBlock>
</Canvas>
</StackPanel>

xaml designer viewer doesn't load

When I add a resource on my main application (Application.xaml) then my pages doesn't load its design viewer because it tells me there is an error in one resource (DesignerItem.xaml). Otherwise in run time it works perfectly.
Application.xaml:
<Application xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
x:Class="GesHoras.App"
StartupUri="WinMain.xaml">
<Application.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<!--Vista Theme -->
<ResourceDictionary Source="pack://application:,,,/PresentationFramework.Aero;V3.0.0.0;31bf3856ad364e35;component/themes/aero.normalcolor.xaml" />
<ResourceDictionary Source="Themes/TabControl.xaml"/>
<ResourceDictionary Source="Themes/TabItem.xaml"/>
<ResourceDictionary Source="Themes/GridView.xaml"/>
<ResourceDictionary Source="Themes/ListView.xaml"/>
<ResourceDictionary Source="Themes/Button.xaml"/>
<ResourceDictionary Source="Themes/RepeatButton.xaml"/>
<ResourceDictionary Source="Themes/GroupBox.xaml"/>
<ResourceDictionary Source="Themes/TextBox.xaml"/>
<ResourceDictionary Source="Themes/ComboBox.xaml"/>
<ResourceDictionary Source="Themes/TreeView.xaml"/>
<!--<ResourceDictionary Source="Themes/Menu.xaml"/>-->
<ResourceDictionary Source="Themes/ProgressBar.xaml"/>
<ResourceDictionary Source="Themes/ToolTip.xaml"/>
<ResourceDictionary Source="Designer_Controls/DesignerItem.xaml"/>
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</Application.Resources>
</Application>
and my DesignerItem.xaml:
<ResourceDictionary
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:s="clr-namespace:GesHoras.Designer_Controls">
<!-- Resource dictionary entries should be defined here. -->
<!-- DragThumb Default Template -->
<Style TargetType="{x:Type s:DragThumb}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type s:DragThumb}">
<Rectangle Fill="Transparent"/>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<!-- DesignerItem Style -->
<Style TargetType="{x:Type s:DesignerItem}">
<Setter Property="MinWidth" Value="20"/>
<Setter Property="MinHeight" Value="15"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type s:DesignerItem}">
<Grid DataContext="{Binding RelativeSource={RelativeSource TemplatedParent}}">
<!-- PART_DragThumb -->
<s:DragThumb x:Name="PART_DragThumb" Cursor="Hand"/>
<!-- PART_ContentPresenter -->
<ContentPresenter x:Name="PART_ContentPresenter"
Content="{TemplateBinding ContentControl.Content}"
Margin="{TemplateBinding ContentControl.Padding}"/>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</ResourceDictionary>
It tells me the error is in DesignerItem.xaml in line:
<Grid DataContext="{Binding RelativeSource={RelativeSource TemplatedParent}}">
the message error that appears is:
Property 'Path' has no value
Can anyone help me please?
Thanks!
DesignerItem.xaml:
<ResourceDictionary
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:s="clr-namespace:GesHoras.Designer_Controls">
<!-- Resource dictionary entries should be defined here. -->
<!-- DragThumb Default Template -->
<Style TargetType="{x:Type s:DragThumb}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type s:DragThumb}">
<Rectangle Fill="Transparent"/>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<!-- DesignerItem Style -->
<Style TargetType="{x:Type s:DesignerItem}">
<Setter Property="MinWidth" Value="20"/>
<Setter Property="MinHeight" Value="15"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type s:DesignerItem}">
<Grid DataContext="{Binding RelativeSource={RelativeSource TemplatedParent}}">
<!-- PART_DragThumb -->
<s:DragThumb x:Name="PART_DragThumb" Cursor="Hand"/>
<!-- PART_ContentPresenter -->
<ContentPresenter x:Name="PART_ContentPresenter"
Content="{TemplateBinding ContentControl.Content}"
Margin="{TemplateBinding ContentControl.Padding}"/>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</ResourceDictionary>
The problem is in line:
<Grid DataContext="{Binding RelativeSource={RelativeSource TemplatedParent}}">
It says to me that path is missing or has no value.
Thanks!

Applying a style to all derived classes in WPF

I want to apply a style to all classes derived from Control. Is this possible with WPF?
The following example does not work. I want the Label, TextBox and Button to have a Margin of 4.
<Window x:Class="WeatherInfo.Window1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="Wetterbericht" Height="300" Width="300">
<Window.Resources>
<Style TargetType="Control">
<Setter Property="Margin" Value="4"/>
</Style>
</Window.Resources>
<Grid>
<StackPanel Margin="4" HorizontalAlignment="Left">
<Label>Zipcode</Label>
<TextBox Name="Zipcode"></TextBox>
<Button>get weather info</Button>
</StackPanel>
</Grid>
</Window>
Here's one solution:
<Window.Resources>
<Style TargetType="Control" x:Key="BaseStyle">
<Setter Property="Margin" Value="4"/>
</Style>
<Style BasedOn="{StaticResource BaseStyle}" TargetType="Button" />
<Style BasedOn="{StaticResource BaseStyle}" TargetType="Label" />
<Style BasedOn="{StaticResource BaseStyle}" TargetType="TextBox" />
</Window.Resources>
<Grid>
<StackPanel Margin="4" HorizontalAlignment="Left">
<Label>Zipcode</Label>
<TextBox Name="Zipcode"></TextBox>
<Button>get weather info</Button>
</StackPanel>
</Grid>
This is not possible in WPF. You have a couple of options to help you out:
Create one style based on another by using the BasedOn attribute.
Move the common information (margin, in this case) into a resource and reference that resource from each style you create.
Example of 1
<Style TargetType="Control">
<Setter Property="Margin" Value="4"/>
</Style>
<Style TargetType="TextBox" BasedOn="{StaticResource {x:Type Control}}">
</Style>
Example of 2
<Thickness x:Key="MarginSize">4</Thickness>
<Style TargetType="TextBox">
<Setter Property="Margin" Value="{StaticResource MarginSize}"/>
</Style>

Resources