How to change dxb:BarcheckItem background and foreground style - wpf

How to change the BarCheckITem background color, am having hardtime changing the styles for devexpress controls
<dxb:ToolBarControl ShowBackground="True" Grid.Row="0" HorizontalAlignment="Stretch"
VerticalAlignment="Top"
AllowCustomizationMenu="True"
BarItemDisplayMode="ContentAndGlyph" UseWholeRow="True"
AllowHide="False" AllowQuickCustomization="False" RotateWhenVertical="False">
<dxb:BarCheckItem Content="Forms"
Glyph="{dx:DXImage Image=AddItem_16x16.png}"
GroupIndex="-11"
BarItemDisplayMode="ContentAndGlyph"
LargeGlyph="{dx:DXImage Image=AddItem_32x32.png}" />
<dxb:ToolBarControl>

You need to override the BarCheckItemLink.CustomResources and then to add a style to override the default template. I have made a simple sample to show this:
<dx:DXWindow x:Class="BarCheckItemBackground.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:dx="http://schemas.devexpress.com/winfx/2008/xaml/core"
xmlns:dxb="http://schemas.devexpress.com/winfx/2008/xaml/bars"
Title="MainWindow" Height="350" Width="525">
<Grid>
<dxb:BarManager ToolbarGlyphSize="Large">
<dxb:BarManager.Items>
<dxb:BarCheckItem x:Name="ItemNormal"
Content="I am normal"
Glyph="{dx:DXImage Image=AddItem_16x16.png}"
BarItemDisplayMode="ContentAndGlyph"
LargeGlyph="{dx:DXImage Image=AddItem_32x32.png}" />
<dxb:BarCheckItem x:Name="ItemNotNormal"
Content="I am not normal lol"
Glyph="{dx:DXImage Image=AddItem_16x16.png}"
GroupIndex="-11"
BarItemDisplayMode="ContentAndGlyph"
LargeGlyph="{dx:DXImage Image=AddItem_32x32.png}" />
</dxb:BarManager.Items>
<dxb:BarManager.Bars>
<dxb:Bar>
<dxb:Bar.DockInfo>
<dxb:BarDockInfo ContainerType="Top"/>
</dxb:Bar.DockInfo>
<dxb:BarCheckItemLink BarItemName="ItemNormal" />
<dxb:BarCheckItemLink BarItemName="ItemNotNormal">
<dxb:BarCheckItemLink.CustomResources>
<ResourceDictionary>
<Style TargetType="{x:Type dxb:BarCheckItemLinkControl}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type dxb:BarItemLinkControl}">
<Grid>
<Border Background="Yellow"/>
<dxb:BarItemLayoutPanel x:Name="PART_LayoutPanel"/>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</ResourceDictionary>
</dxb:BarCheckItemLink.CustomResources>
</dxb:BarCheckItemLink>
</dxb:Bar>
</dxb:BarManager.Bars>
</dxb:BarManager>
</Grid>
</dx:DXWindow>
And the output window:
Hope this helps

Related

Dev Express Grid control cell style not applied WPF

I tried to set the cell style for the grid control column within Lookupedit. but not applied at run time, but if I remove any property of the grid control column in debug mode at the time style applied, cell style should be applied when binding the data source, any idea to fix this, below is the code snippet
Thanks in advance,
Pandiyan Thangarasu
<UserControl x:Class="VisualizeWorkFlow.Legends"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:dxg="http://schemas.devexpress.com/winfx/2008/xaml/grid"
xmlns:dxc="http://schemas.devexpress.com/winfx/2008/xaml/core"
xmlns:dxb="http://schemas.devexpress.com/winfx/2008/xaml/bars"
xmlns:dxe="http://schemas.devexpress.com/winfx/2008/xaml/editors"
xmlns:dxgt="http://schemas.devexpress.com/winfx/2008/xaml/grid/themekeys"
xmlns:local="clr-namespace:VisualizeWorkFlow"
mc:Ignorable="d"
BorderBrush="LightGray">
<UserControl.Resources>
<local:LegendColorCodeConverterClass x:Key="LegendColorCodeConverter"/>
</UserControl.Resources>
<Grid Background="White">
<dxg:LookUpEdit DisplayMember="Name" dxc:ThemeManager.ThemeName="Office2010Silver" Name="PART_Editor" Width="300" >
<dxg:LookUpEdit.PopupContentTemplate>
<ControlTemplate>
<dxg:GridControl Name="PART_GridControl" CustomColumnDisplayText="PART_GridControl_CustomColumnDisplayText">
<dxg:GridControl.Columns>
<dxg:GridColumn Header="Name" Width="150" FieldName="Name" />
<dxg:GridColumn Header="Color Code" Width="30" FieldName="ColorCode">
<dxg:GridColumn.CellStyle>
<Style BasedOn="{StaticResource {dxgt:GridRowThemeKey ResourceKey=CellStyle}}" TargetType="dxg:CellContentPresenter">
<Setter Property="FontWeight" Value="SemiBold"/>
<Setter Property="FontSize" Value="14"/>
<Setter Property="Background" Value="{Binding Value, Converter={StaticResource LegendColorCodeConverter}}"/>
</Style>
</dxg:GridColumn.CellStyle>
</dxg:GridColumn>
</dxg:GridControl.Columns>
<dxg:GridControl.View>
<dxg:TreeListView KeyFieldName="ID" ParentFieldName="ParentID" ShowColumnHeaders="False" ShowIndicator="False" AutoExpandAllNodes="True"/>
</dxg:GridControl.View>
</dxg:GridControl>
</ControlTemplate>
</dxg:LookUpEdit.PopupContentTemplate>
</dxg:LookUpEdit>
</Grid>
</UserControl>

WPF- Compile error on referencing a Resource Dictionary file

Question: When I reference the following Resource Dictionary file in MainWindow.xaml file (shown below), why do I get the following compile error?
CustomWindowStyle resource not found
Remark:
I'm following this article where the Creating A Resource Dictionary File section is also showing the exact procedure that I am using on how to reference Resource Dictionary in MainWindow.xaml
As shown in the image below, VS2019 does CORRECCTLY recognize CustomWindowStyle when I type Style="{StaticResource ....} line in MainWindow.xaml. But at the compile time (as shown in image 2 below), it throws the above error.
I am using .NET Core 3.1. I'm not sure if the issue is related to .NET Core
When typing the line Style="{StaticResource ....} the intellisense correctly shows the option of selecting CustomWindowStyle:
At the compile time, the error shows up:
.
WindowStyle.xaml:
<ResourceDictionary x:Class="WPF_OctDelete.WindowStyle"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:WPF_OctDelete">
<Style x:Key="CustomWindowStyle" TargetType="{x:Type Window}">
<Setter Property="WindowChrome.WindowChrome">
<Setter.Value>
<WindowChrome CaptionHeight="30"
CornerRadius="4"
GlassFrameThickness="0"
NonClientFrameEdges="None"
ResizeBorderThickness="5"
UseAeroCaptionButtons="False" />
</Setter.Value>
</Setter>
<Setter Property="BorderBrush" Value="Black" />
<Setter Property="Background" Value="Gray" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Window}">
<Grid>
<Border Background="{TemplateBinding Background}"
BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="5,30,5,5">
<AdornerDecorator>
<ContentPresenter />
</AdornerDecorator>
</Border>
<DockPanel Height="30"
VerticalAlignment="Top"
LastChildFill="False">
<TextBlock Margin="5,0,0,0"
VerticalAlignment="Center"
DockPanel.Dock="Left"
FontSize="16"
Foreground="White"
Text="{TemplateBinding Title}" />
<Button x:Name="btnClose"
Width="15"
Margin="5"
Click="CloseClick"
Content="X"
DockPanel.Dock="Right"
WindowChrome.IsHitTestVisibleInChrome="True" />
<Button x:Name="btnRestore"
Width="15"
Margin="5"
Click="MaximizeRestoreClick"
Content="#"
DockPanel.Dock="Right"
WindowChrome.IsHitTestVisibleInChrome="True" />
<Button x:Name="btnMinimize"
Width="15"
Margin="5"
VerticalContentAlignment="Bottom"
Click="MinimizeClick"
Content="_"
DockPanel.Dock="Right"
WindowChrome.IsHitTestVisibleInChrome="True" />
</DockPanel>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</ResourceDictionary>
MainWindow.xaml:
<Window x:Class="WPF_OctDelete.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:WPF_OctDelete"
mc:Ignorable="d"
Style="{StaticResource CustomWindowStyle}"
Title="MainWindow" Height="450" Width="800">
<Window.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="WindowStyle.xaml"/>
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</Window.Resources>
<Grid>
<Button x:Name="btnTest" Content="Test"/>
</Grid>
</Window>
Your resource is being loaded after the window is loaded and so it cannot find the resource during the window loading event. So your method isn't going to work that way.
You need to put that resource in your App.xaml file, see - How to Set the Source of an Image in XAML and in Code Behind to an image in another project in WPF
In your case (in App.xaml) - '
<Application.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="WindowStyle.xaml" />
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</Application.Resources>
And then you can use your key in the Window -
<Window x:Class="WPF_OctDelete.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:WPF_OctDelete"
mc:Ignorable="d"
Style="{StaticResource CustomWindowStyle}"
Title="MainWindow" Height="450" Width="800">
<!--Rest of your UI Elements-->
</Window>
No need to add resources to your window, since its added to the main app file. That resource will be available across your entire project (available for other windows/controls)
(Edit: further clarification - When you add something as a "StaticResource" to your window style, but load the actual resource later, the window "loaded" event is not going to pick it up. Another solution is to refer your style as "DynamicResource", so the style during the "loaded" event is not static and will be updated when it captures the new resource.)
The XAML processor reads the XAML file from top to bottom so by the time it tries to resolve the CustomWindowStyle resource, it hasn't yet loaded the ResourceDictionary.
You could easily fix this by setting the Resources property before you set the Style property:
<Window x:Class="WPF_OctDelete.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:WPF_OctDelete"
mc:Ignorable="d"
Title="MainWindow" Height="450" Width="800">
<Window.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="WindowStyle.xaml"/>
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</Window.Resources>
<Window.Style>
<StaticResource ResourceKey="CustomWindowStyle"/>
</Window.Style>
<Grid>
<Button x:Name="btnTest" Content="Test"/>
</Grid>
</Window>
The order matters.

Resource "x" could not be resolved WPF

Im new at WPF and im using some DevExpress controls
Im trying to implement an style to some buttons but always shows the error that the Resource cannot be resolved.
MainWindow:
<dx:DXWindow
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:dxb="http://schemas.devexpress.com/winfx/2008/xaml/bars"
xmlns:dxe="http://schemas.devexpress.com/winfx/2008/xaml/editors" x:Class="LicenceManagerWPF.MainWindow"
xmlns:dx="http://schemas.devexpress.com/winfx/2008/xaml/core" dx:ThemeManager.ThemeName="Office2016"
Title="MainWindow" Height="746.218" Width="1139.154"
WindowStartupLocation="CenterScreen">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="80"/>
</Grid.RowDefinitions>
<StackPanel x:Name="Stack_Top" Orientation="Horizontal" Grid.Row="1" >
<dx:SimpleButton x:Name="btnRefresh" Style="{StaticResource ResourceKey=CustomStyles}" Width="55" ToolTip="Refresh" Margin="10,10,10,10" Glyph="{dx:DXImage Image=Refresh_32x32.png}" Content="Resfresh" />
<dx:SimpleButton x:Name="btndNew" Width="55" ToolTip="New Customer" Margin="10" Glyph="{dx:DXImage Image=NewContact_32x32.png}" Content="New Customer" />
<dx:SimpleButton x:Name="btnDelete" ToolTip="Delete Customer" Width="55" Margin="10" Content="Delete" Glyph="{dx:DXImage Image=Cancel_32x32.png}"/>
</StackPanel>
</Grid>
This is the App.xaml
<Application x:Class="LicenceManagerWPF.App"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
StartupUri="MainWindow.xaml"
Startup="OnAppStartup_UpdateThemeName">
<Application.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary x:Name="CustomStyles" Source="StyleResource.xaml"/>
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</Application.Resources>
This is my Styles file
<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:LicenceManagerWPF"
xmlns:dxb="http://schemas.devexpress.com/winfx/2008/xaml/bars"
xmlns:dxe="http://schemas.devexpress.com/winfx/2008/xaml/editors" x:Class="LicenceManagerWPF.MainWindow"
xmlns:dx="http://schemas.devexpress.com/winfx/2008/xaml/core">
<Style x:Name="HeaderButtons" TargetType="dx:SimpleButton">
<Setter Property="Margin" Value="10"/>
<Setter Property="Width" Value="55"/>
</Style>
I was searching and everything looks like fine but i dont get it why it cannot be resolved.
Regards
There is no need to name ResourceDictionary , just provide its Source:
<ResourceDictionary Source="StyleResource.xaml"/>
ResourceDictionary items should have x:Key. In case of a Style if there is no explicit key, TargetType will be used as a key. It is a way to create default styles.
If you want named style, then set x:Key
<Style x:Key="HeaderButtons" TargetType="dx:SimpleButton">
<Setter Property="Margin" Value="10"/>
<Setter Property="Width" Value="55"/>
</Style>
And finally StaticResource extension references resources by resource key, not by names:
Style="{StaticResource HeaderButtons}"
Also: when you set a Style for a button, Margin and Width settings (Width="55" Margin="10,10,10,10") becomes redundant. They can be used to override style setting, but in this case they are the same so why write them?

Button control template not working

i am written the following xaml code:
<Window x:Class="ImageScrollDemo.View.TestWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="TestWindow" Height="300" Width="300">
<Window.Resources>
<Style x:Key="NextImageButtonStyle" TargetType="Button">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="Button">
<Image Source="..\Images\#next.png" RenderOptions.BitmapScalingMode="HighQuality" />
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</Window.Resources>
<Grid>
<Button Style="{DynamicResource NextImageButtonStyle}" />
</Grid>
</Window>
The window is rendered blank. i don't understand why.
<Image Source="..\Images\#next.png" ... />
Check the file name for the image and verify it does actually contain a # character.
Also, try using a static resource:
<Button Style="{StaticResource NextImageButtonStyle}" />
One thing to note: Try specifying TargetType using Type syntax
<Style x:Key="NextImageButtonStyle" TargetType="{x:Type Button}">
Reference: MSDN Style.TargetType Property
Using the key to refer to the resource may be enough, but an incorrect TargetType could interfere.

Setting styles for subcontrols of usercontrol

Say I have a user control like this:
<UserControl x:Class="StyleTest.UserControl1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
mc:Ignorable="d"
d:DesignHeight="300" d:DesignWidth="300">
<Grid>
<Grid.RowDefinitions>
<RowDefinition />
<RowDefinition />
</Grid.RowDefinitions>
<Button Grid.Row="0">Style please</Button>
<Button Grid.Row="1">Style please</Button>
</Grid>
And I want to set all buttons in this control to background=green.
But I don't want to affect other buttons in my program and I don't want to modify the code of the control.
What I found right now is this:
<Window x:Class="StyleTest.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:loc="clr-namespace:StyleTest"
Title="MainWindow" Height="350" Width="525">
<Window.Resources>
<Style x:Key="UserControlStyles" TargetType="Button">
<Setter Property="Background" Value="green" />
</Style>
</Window.Resources>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition />
<ColumnDefinition />
</Grid.ColumnDefinitions>
<Button Grid.Column="0">no Style please</Button>
<loc:UserControl1 Grid.Column="1">
<loc:UserControl1.Resources>
<Style TargetType="Button" BasedOn="{StaticResource UserControlStyles}" />
</loc:UserControl1.Resources>
</loc:UserControl1>
</Grid>
But this would imply that I have to add this code to every instance of the control, and some extra code, if I want to style e.g. foreground color of TextBoxes also.
What I am looking for is something similar to this:
<Style TargetType="Buttons that are childs of UserControl1">
<Setter Property="Background" Value="green" />
</Style>
Is there a way of doing this?
I don't think that a control template would be sufficient, because I don't want to redesign the whole control, I just want to set the color of the buttons.
In App.xaml you could add this style which will be applied to all instances of UserControl1
<Style TargetType="StyleTest:UserControl1" >
<Style.Resources>
<Style TargetType="Button">
<Setter Property="Background" Value="green" />
</Style>
</Style.Resources>
</Style>
If I understand correctly, you just need to modify your UserControl so that you add the style there, instead of in the Window control
<UserControl x:Name=UserControl1 ...>
<UserControl.Resources>
<Style TargetType="Button">
<Setter Property="Background" Value="green" />
</Style>
</UserControl.Resources>
I just saw that you said you don't want to modify the control. You mean that you can't modify the xaml of the UserControl? Why not?

Resources