I'm using a style in my XAML for a label:
<Style x:Key="TreatEye" TargetType="Label">
<Setter Property="Foreground" Value="#d1d1d1" />
<Setter Property="FontWeight" Value="Bold" />
<Setter Property="FontSize" Value="30" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="Label">
<Canvas>
<TextBlock x:Name="retreatText" Canvas.Left="80" Canvas.Top="5" FontSize="16" Text="Retreatment"/>
<TextBlock x:Name="bioinsulatorText" Canvas.Left="21" Canvas.Top="33" Text="Bioinsulator" />
<TextBlock x:Name="kxlText" Canvas.Left="21" Canvas.Top="70" Text="KXL Kit" />
</Canvas>
...
The problem I'm seeing is that the FontSize property of "reatreatText" is not overridden from the setter value of 30. This builds fine, but the end display has "reatreatText" as size 30. Why is this value not overridden?
Thanks in advance.
Sorry, but I tried your code inside Kaxaml and works as expected:
<Page
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<Page.Resources>
<Style x:Key="TreatEye" TargetType="Label">
<Setter Property="Foreground" Value="#d1d1d1" />
<Setter Property="FontWeight" Value="Bold" />
<Setter Property="FontSize" Value="30" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="Label">
<Canvas>
<TextBlock x:Name="retreatText" Canvas.Left="80" Canvas.Top="5" FontSize="16" Text="Retreatment"/>
<TextBlock x:Name="bioinsulatorText" Canvas.Left="21" Canvas.Top="33" Text="Bioinsulator" />
<TextBlock x:Name="kxlText" Canvas.Left="21" Canvas.Top="70" Text="KXL Kit" />
</Canvas>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</Page.Resources>
<Grid>
<Label Style="{StaticResource TreatEye}">Ejemplo</Label>
</Grid>
</Page>
Result:
alt text http://img231.imageshack.us/img231/695/capture2p.png
You need to set a TemplateBinding on the TextBlock.
<TextBlock x:Name="retreatText"
Canvas.Left="80"
Canvas.Top="5"
FontSize="{TemplateBinding FontSize}"
Text="Retreatment"/>
That's how the setter properties get propogated to the internal structure.
Related
I've got the below style for TextBoxes in my WPF app:
<!-- http://www.thexamlproject.com/ -->
<Style x:Key="LockIcon" TargetType="Path">
<Setter Property="Height" Value="16" />
<Setter Property="Width" Value="16" />
<Setter Property="Stretch" Value="Uniform" />
<Setter Property="Data"
Value="F1 M 80.6667,55.1172L 80.6667,35.3333C 80.6667,15.851 64.815,3.05176e-005 45.3333,3.05176e-005C 25.8509,3.05176e-005 9.99998,15.851 9.99998,35.3333L 9.99998,55.1172L 0,56L 0,129.333L 45.3333,133.333L 90.6667,129.333L 90.6667,56L 80.6667,55.1172 Z M 20.6667,54.1771L 20.6667,35.3333C 20.6667,21.7318 31.7317,10.6667 45.3333,10.6667C 58.9349,10.6667 70,21.7318 70,35.3333L 70,54.1771L 45.3333,52L 20.6667,54.1771 Z " />
</Style>
<VisualBrush x:Key="LockBrush" Stretch="None" AlignmentX="Left">
<VisualBrush.Visual>
<Border BorderThickness="4" BorderBrush="Transparent">
<Path Style="{StaticResource LockIcon}" Fill="Red" />
</Border>
</VisualBrush.Visual>
</VisualBrush>
<Style x:Key="{x:Type TextBox}" TargetType="{x:Type TextBox}">
<Style.Triggers>
<Trigger Property="IsEnabled" Value="false">
<Setter Property="Background" Value="{StaticResource LockBrush}"/>
<Setter Property="Foreground" Value="White"/>
<Setter Property="Padding" Value="22,4"/>
</Trigger>
</Style.Triggers>
</Style>
I can't seem to find a good way to apply this VisualBrush image AND a background color to the entire TextBox. I either get strange stretching issues or simply cannot fill the whole TextBox (controls stretch and are different widths depending on the rendering view).
Ideas?
Instead of a VisualBrush use a Control Template.
XAML
<Style x:Key="LockIcon"
TargetType="Path">
<Setter Property="Height"
Value="16" />
<Setter Property="Width"
Value="16" />
<Setter Property="Stretch"
Value="Uniform" />
<Setter Property="Data"
Value="F1 M 80.6667,55.1172L 80.6667,35.3333C 80.6667,15.851 64.815,3.05176e-005 45.3333,3.05176e-005C 25.8509,3.05176e-005 9.99998,15.851 9.99998,35.3333L 9.99998,55.1172L 0,56L 0,129.333L 45.3333,133.333L 90.6667,129.333L 90.6667,56L 80.6667,55.1172 Z M 20.6667,54.1771L 20.6667,35.3333C 20.6667,21.7318 31.7317,10.6667 45.3333,10.6667C 58.9349,10.6667 70,21.7318 70,35.3333L 70,54.1771L 45.3333,52L 20.6667,54.1771 Z " />
</Style>
<Style TargetType='TextBox'
x:Key='WithLockIcon'>
<Setter Property='MinHeight'
Value='26' />
<Setter Property="Padding"
Value="22,4" />
<Style.Triggers>
<Trigger Property="IsEnabled"
Value="false">
<!-- Use a control template instead of
Background property -->
<!--<Setter Property="Background"
Value="{StaticResource LockBrush}" />-->
<!--<Setter Property="Padding"
Value="22,4" />-->
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type TextBoxBase}">
<!-- Set background here!-->
<Border BorderThickness="4"
BorderBrush="Transparent"
HorizontalAlignment='Stretch'>
<StackPanel Background='#dddddd'
Orientation='Horizontal'>
<Path Style="{StaticResource LockIcon}"
Fill="Red" />
<ScrollViewer Margin="0"
x:Name="PART_ContentHost">
</ScrollViewer>
</StackPanel>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Trigger>
</Style.Triggers>
</Style>
</Window.Resources>
<StackPanel>
<TextBox x:Name='textbox1'
Text='Example Text'
IsEnabled='False'
Style='{StaticResource WithLockIcon}' />
<ToggleButton Checked='ToggleButton_Checked'
Unchecked='ToggleButton_Unchecked'
Content='Change State' />
</StackPanel>
I've achieved a reasonably close simulation in a similar situation.
<Window x:Class="VisualBrushMargins.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height="350" Width="525"
Background="{DynamicResource WindowBackground}">
<Window.Resources>
<VisualBrush x:Key="WindowBackground" Stretch="UniformToFill">
<VisualBrush.Visual>
<Grid>
<Border Background="DarkGreen" Width="250" Height="150" />
<Canvas Height="130" Width="180" Background="DarkBlue">
<Path>
<!-- path goes here -->
</Path>
<Ellipse Width="100" Height="100" Stroke="Red" />
</Canvas>
</Grid>
</VisualBrush.Visual>
</VisualBrush>
</Window.Resources>
<Grid/>
</Window>
The path fits the canvas. Sizing the canvas and the border differently allows to add a "margin" to the brush -- note how it behaves on window resize. (Canvas is colored blue for illustrational purpose -- actually it's supposed to be transparent)
IM using lot of text boxes and label that have lot of common beside ,my question is if
in wpf instead of copy paste ?
for example if I have the following text box and instead the name and the place on the screen
I want that all text box have the same behaviors
<TextBox x:Name="name2"
AcceptsReturn="True"
AllowDrop="True"
PreviewDragEnter="DropText_PreviewDragEnter"
PreviewDrop="DropText_PreviewDrop"
PreviewDragOver="DropText_PreviewDragOver"
HorizontalAlignment="Left" Height="20" TextWrapping="Wrap"
VerticalAlignment="Top" Width="80" Grid.Column="4" Margin="4,50,0,0" Grid.Row="2"
/>
<TextBox x:Name="name1"
AcceptsReturn="True"
AllowDrop="True"
PreviewDragEnter="DropText_PreviewDragEnter"
PreviewDrop="DropText_PreviewDrop"
PreviewDragOver="DropText_PreviewDragOver"
HorizontalAlignment="Left"
Height="20"
TextWrapping="Wrap"
Text="" VerticalAlignment="Top" Width="80" Grid.Column="4" Margin="4,75,0,0" Grid.Row="2"/>
You can use Style, which will store all the settings for the control:
<Style TargetType="{x:Type TextBox}">
<Setter Property="AcceptsReturn" Value="True" />
<Setter Property="AllowDrop" Value="True" />
...
<Setter Property="Margin" Value="4,75,0,0" />
</Style>
If style define the key, it will only apply to the control that it explicitly indicate. Example:
<Style x:Key="TextBoxOneStyle" TargetType="{x:Type TextBox}">
<Setter Property="AcceptsReturn" Value="False" />
<Setter Property="AllowDrop" Value="True" />
...
<Setter Property="Margin" Value="4,0,0,0" />
</Style>
<Style x:Key="TextBoxTwoStyle" TargetType="{x:Type TextBox}">
<Setter Property="AcceptsReturn" Value="True" />
<Setter Property="AllowDrop" Value="True" />
...
<Setter Property="Margin" Value="4,75,0,0" />
</Style>
Using:
<TextBox Name="TextBoxOne"
Style="{StaticResource TextBoxOneStyle}" />
<TextBox Name="TextBoxTwo"
Style="{StaticResource TextBoxTwoStyle}" />
You can also specify the event handler via EventSetter:
<Style TargetType="{x:Type TextBox}">
<EventSetter Event="PreviewDragEnter" Handler="DropText_PreviewDragEnter" />
</Style>
Please see this link, for more information:
Styling and Templating MSDN
Can I make a tooltip style which can be applied to all tooltips for every control?
I tried this but I cant get the content (Tooltip text) in style, it is showing empty text in tooltip:
<Style TargetType="{x:Type ToolTip}" >
<Setter Property="OverridesDefaultStyle" Value="true" />
<Setter Property="HasDropShadow" Value="True" />
<Setter Property="Foreground" Value="White" />
<Setter Property="FontSize" Value="12" />
<Setter Property="Placement" Value="Bottom" />
<Setter Property="VerticalOffset" Value="0" />
<Setter Property="Padding" Value="8" />
<Setter Property="HorizontalContentAlignment" Value="Center" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type ToolTip}" >
<StackPanel Margin="7,1" >
<Border Background="#FFF7F7CC" CornerRadius="1" >
<TextBlock Margin="1" Foreground="Black" HorizontalAlignment="Center" VerticalAlignment="Top" Text="{TemplateBinding ToolTip}"/>
</Border>
</StackPanel>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
For Using this style I have to put a seperate Tooltip tag in control, eg to apply tooltip to border,
<Border>
<Border.ToolTip>
<ToolTip ToolTip="This is tooltip text" />
</Border.ToolTip>
........
.........
</Border>
but is there any way where tooltipstyle applies to all control with tooltip mentioned in same tag.
eg.
<Border BorderBrush="Transparent" Background="Transparent" Cursor="Help" ToolTip="This is Tooltip" >
.....
.....
</Border>
let me know if any further details are required.
Thanks in Anticipation.
Yes Your approach will work. But a small change is needed in the Control Template. Replace the TextBlock with ContentPresenter.
<ControlTemplate TargetType="{x:Type ToolTip}" >
<StackPanel Margin="7,1" >
<Border Background="#FFF7F7CC" CornerRadius="1" >
<ContentPresenter Margin="1" HorizontalAlignment="Center" VerticalAlignment="Top" />
</Border>
</StackPanel>
</ControlTemplate>
I have the following treeview defined in my xaml:
<TreeView Name="PST_TreeView"
Grid.Row="0"
Grid.Column="0"
Width="Auto"
Height="Auto"
HorizontalAlignment="Stretch"
VerticalAlignment="Stretch"
ItemsSource="{Binding SitesCollection}"
ItemTemplate="{StaticResource SitesTemplate}"
Style="{StaticResource TreeViewStyleBasic}" />
With Resource bindings targeting my resources file:
<Style x:Key="TreeViewStyleBasic" TargetType="TreeView">
<Setter Property="Background" Value="Transparent" />
<Setter Property="BorderBrush" Value="{DynamicResource TitleBarButtons_BorderBrush}" />
<Setter Property="BorderThickness" Value="0 0 2 0" />
</Style>
<Style x:Key="TreeViewItemStyle_CatNodes" TargetType="{x:Type TextBlock}">
<Setter Property="Foreground" Value="Snow" />
<Setter Property="FontFamily" Value="Calibri" />
<Setter Property="FontSize" Value="16" />
<Setter Property="FontWeight" Value="Normal" />
<Setter Property="TextAlignment" Value="Left" />
</Style>
<Style x:Key="TreeViewItemStyle_ChildNodes" TargetType="{x:Type TextBlock}">
<Setter Property="Foreground" Value="Snow" />
<Setter Property="FontFamily" Value="Calibri" />
<Setter Property="FontSize" Value="14" />
<Setter Property="FontWeight" Value="Normal" />
<Setter Property="FontStyle" Value="Italic" />
<Setter Property="TextAlignment" Value="Left" />
</Style>
<DataTemplate x:Key="VolumeInfoDataTemplate">
<StackPanel Orientation="Horizontal">
<TextBlock Width="{TemplateBinding Width}"
Height="{TemplateBinding Height}"
Margin="5"
Style="{DynamicResource TreeViewItemStyle_ChildNodes}"
Text="{Binding VolumeName}" />
</StackPanel>
</DataTemplate>
<HierarchicalDataTemplate x:Key="SitesTemplate"
ItemsSource="{Binding VolumesList}"
ItemTemplate="{StaticResource VolumeInfoDataTemplate}">
<StackPanel Orientation="Horizontal">
<TextBlock Width="{TemplateBinding Width}"
Height="{TemplateBinding Height}"
Margin="5"
Style="{DynamicResource TreeViewItemStyle_CatNodes}"
Text="{Binding SiteName}" />
</StackPanel>
</HierarchicalDataTemplate>
The xaml and resource look ups above work find and as expected.
How might I employ triggers to extend my style definitions to say for example handle the 'IsSelected' event so that the selected tree node will have a slate grey border and a light grey background?
RESEARCH: Kind of thing I am going for.
UPDATE: There is no IsSelected property on the TreeView, however TreeViewItem does has one defined.
Try this:
<DataTemplate x:Key="VolumeInfoDataTemplate">
<StackPanel Orientation="Horizontal">
<TextBlock Width="{TemplateBinding Width}"
Height="{TemplateBinding Height}"
Margin="5"
Style="{DynamicResource TreeViewItemStyle_ChildNodes}"
Text="{Binding VolumeName}"
Name="Tb" />
</StackPanel>
<DataTemplate.Triggers>
<DataTrigger Binding="{Binding IsSelected, RelativeSource={RelativeSource AncestorType=TreeViewItem}}" Value="True">
<Setter TargetName="Tb" Property="Background" Value="LightGray"/>
</DataTrigger>
</DataTemplate.Triggers>
</DataTemplate>
i have some listbox, which has this applied style:
<Style x:Key="GroupListBoxItemStyle"
TargetType="ListBoxItem">
<Setter Property="OverridesDefaultStyle"
Value="True" />
<Setter Property="FocusVisualStyle"
Value="{x:Null}" />
<Setter Property="FontSize"
Value="11" />
<Setter Property="FontWeight"
Value="Bold" />
<Setter Property="Width"
Value="95" />
<Setter Property="HorizontalAlignment"
Value="Center" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="ListBoxItem">
<SlidingBar:SlidingBarRadioButton GroupName="PermissionsRadioButtonGroup"
IsChecked="{Binding Path=IsSelected,RelativeSource={RelativeSource TemplatedParent},BindsDirectlyToSource=True,Mode=TwoWay}"
Text="{Binding Converter={StaticResource resourceStringToResourceConverter}}"
ImageSource="{Binding Converter={StaticResource PermissionTypeToImageConverter}}"
Margin="1"
/>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
Is there possible to show somehow these items in two rows?
You should do this in the ListBox ItemTemplate property. The XAML looks something like this:
<ListBox Width="300" ItemsSource="{Binding}">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel>
<TextBlock Text="{Binding Line1}" />
<TextBlock Text="{Binding Line2}" />
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
The resulting listbox should look like:
Of course you don't have to use a StackPanel, you can use whatever kind of layout you like in the data template. Be creative :)