I am using a WPF toolkit chart in my application which is for touch screen devices. I want to enable scrolling for the chart but don't want to show scroll bar to the user. How can I achieve this? Here is my code:-
<ScrollViewer>
<chartingToolkit:Chart Name="bottomChart" BorderThickness="0" Padding="0" ClipToBounds="False" >
<chartingToolkit:Chart.PlotAreaStyle>
<Style TargetType="Grid">
<Setter Property="Background" Value="Transparent" />
</Style>
</chartingToolkit:Chart.PlotAreaStyle>
<chartingToolkit:Chart.Axes>
<chartingToolkit:LinearAxis Orientation="Y" ShowGridLines="False" Visibility="Hidden" Width="0" Minimum="0"/>
<chartingToolkit:LinearAxis Orientation="X" Interval="5" ShowGridLines="True" Visibility="Hidden" Height="0" >
</chartingToolkit:LinearAxis>
</chartingToolkit:Chart.Axes>
<chartingToolkit:Chart.TitleStyle>
<Style TargetType="Control">
<Setter Property="Width" Value="0" />
<Setter Property="Height" Value="0" />
<Setter Property="Visibility" Value="Hidden" />
</Style>
</chartingToolkit:Chart.TitleStyle>
<chartingToolkit:Chart.LegendStyle>
<Style TargetType="Control">
<Setter Property="Width" Value="0" />
<Setter Property="Height" Value="0" />
<Setter Property="Visibility" Value="Hidden" />
</Style>
</chartingToolkit:Chart.LegendStyle>
<TestManagementUC:UnorderedLineSeries x:Name="BottomChartSeries" DependentValueBinding="{Binding Path=Value}" IndependentValueBinding="{Binding Path=Key}" ItemsSource="{Binding Path=DataPoints}">
<TestManagementUC:UnorderedLineSeries.DataPointStyle>
<Style TargetType="{x:Type chartingToolkit:LineDataPoint}">
<Setter Property="Background" Value="{StaticResource Brush}" />
<Setter Property="Template" Value="{x:Null}" />
</Style>
</TestManagementUC:UnorderedLineSeries.DataPointStyle>
</TestManagementUC:UnorderedLineSeries>
</chartingToolkit:Chart>
</ScrollViewer>
Related
This question already has answers here:
Change color of Button when Mouse is over
(5 answers)
Closed 1 year ago.
I need to change text color, cursor and background of a button on mouse hover. I'm trying to do this by changing styles but also tried adding style trigger directly to the button
<Style.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Background" Value="Black" />
<Setter Property="Foreground" Value="Black" />
<Setter Property="Cursor" Value="Hand" />
</Trigger>
</Style.Triggers>
Text color and cursor change, but background color remain the same (light blue). Please tell me what could be the problem?
Screenshot
Full code:
<Window x:Class="WpfApp3.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:WpfApp3"
mc:Ignorable="d"
Title="Заголовок" Height="640" Width="960">
<Window.Resources>
<Style TargetType="Button" x:Key="SidebarButton">
<Style.Setters>
<Setter Property="Control.FontFamily" Value="Segoe UI" />
<Setter Property="Control.Background" Value="#333742" />
<Setter Property="Control.Foreground" Value="White" />
<Setter Property="Control.BorderThickness" Value="0" />
<Setter Property="Control.Padding" Value="10" />
</Style.Setters>
<Style.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Background" Value="Black" />
<Setter Property="Foreground" Value="Black" />
<Setter Property="Cursor" Value="Hand" />
</Trigger>
</Style.Triggers>
</Style>
</Window.Resources>
<Grid Background="#333742">
<Grid.RowDefinitions>
<RowDefinition Height="50"></RowDefinition>
<RowDefinition></RowDefinition>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="0.2*" MinWidth="150" MaxWidth="200"></ColumnDefinition>
<ColumnDefinition></ColumnDefinition>
</Grid.ColumnDefinitions>
<StackPanel Orientation="Horizontal" Grid.Column="0" Grid.Row="0" Background="#414550"></StackPanel>
<StackPanel Orientation="Horizontal" Grid.Column="1" Grid.Row="0"></StackPanel>
<StackPanel Orientation="Vertical" Grid.Column="0" Grid.Row="1" Background="#333742">
<Border Height="80">
<TextBlock FontSize="18" Foreground="#fff" VerticalAlignment="Center" HorizontalAlignment="Left" Margin="30">Меню</TextBlock>
</Border>
<Button Style="{StaticResource SidebarButton}">Печать кодов</Button>
<Button Style="{StaticResource SidebarButton}">Настройки</Button>
<Button Style="{StaticResource SidebarButton}">О программе</Button>
</StackPanel>
<StackPanel Orientation="Vertical" Grid.Column="1" Grid.Row="1" Background="#2d3039"></StackPanel>
</Grid>
</Window>
You can find the answer in this response.
You can define the style like this :
<Style TargetType="Button" x:Key="SidebarButton">
<Style.Setters>
<Setter Property="FontFamily" Value="Segoe UI" />
<Setter Property="Background" Value="#333742" />
<Setter Property="Foreground" Value="White" />
<Setter Property="BorderThickness" Value="0" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="Button">
<Border Background="{TemplateBinding Background}" Padding="10">
<ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center"/>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style.Setters>
<Style.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Background" Value="Black" />
<Setter Property="Foreground" Value="Black" />
<Setter Property="Cursor" Value="Hand" />
</Trigger>
</Style.Triggers>
</Style>
I am using DynamicResources in WPF, I have made a button style in app.xaml. Below is the definition:
<Application.Resources>
<Style x:Key="InteractionButtonStyle"
TargetType="{x:Type Button}">
<Style.Resources>
<Style TargetType="Border">
<Setter Property="CornerRadius" Value="5" />
</Style>
<SolidColorBrush x:Key="StyleBasedForegroundColor" Color="White"/>
<SolidColorBrush x:Key="StyleBasedBackgroundColor" Color="Black" />
</Style.Resources>
<Setter Property="Background" Value="{StaticResource StyleBasedBackgroundColor}" />
<Setter Property="Foreground" Value="{StaticResource StyleBasedForegroundColor}" />
<Setter Property="FontSize" Value="15" />
<Setter Property="SnapsToDevicePixels" Value="True" />
<Setter Property="BorderThickness" Value="1" />
<Setter Property="BorderBrush" Value="Black" />
<Setter Property="HorizontalContentAlignment" Value="Center" />
<Setter Property="VerticalContentAlignment" Value="Center" />
<Setter Property="Padding" Value="10" />
</Style>
</Application.Resources>
Now when I use this style in a page:
<Button Grid.Row="3"
HorizontalAlignment="Left"
VerticalAlignment="Center"
Click="RegisterNew_Clicked"
Style="{StaticResource InteractionButtonStyle}"
Visibility="{Binding ShowRegisterVeteranOption, Converter={StaticResource BoolToVisibilityConverter}}">
<StackPanel Orientation="Horizontal">
<Viewbox Height="20"
Width="20">
<Path Data="M9.6110058,5.399L11.650064,5.399 11.650064,9.6789093 15.929999,9.6789093 15.929999,11.717999 11.650064,11.717999 11.650064,15.998 9.6110058,15.998 9.6110058,11.717999 5.3309995,11.717999 5.3309995,9.6789093 9.6110058,9.6789093z M10.66645,1.6420071C5.6808301,1.6420071 1.6404767,5.6823504 1.6404767,10.66655 1.6404767,15.650881 5.6808301,19.691223 10.66645,19.691223 15.64948,19.691223 19.689723,15.650881 19.689723,10.66655 19.689723,5.6823504 15.64948,1.6420071 10.66645,1.6420071z M10.66645,0C16.546567,0 21.333001,4.785153 21.333001,10.66655 21.333001,16.548068 16.546567,21.333 10.66645,21.333 4.7836227,21.333 0,16.548068 0,10.66655 0,4.785153 4.7836227,0 10.66645,0z"
Fill="{DynamicResource StyleBasedForegroundColor}" />
</Viewbox>
<TextBlock Text="Register"
Margin="10,0,0,0"
Foreground="{DynamicResource StyleBasedForegroundColor}"
VerticalAlignment="Center" />
</StackPanel>
</Button>
Although, things work when the app is running, I get this annoying warning:
The resource "StyleBasedForegroundColor" could not be resolved.
I looked up other questions, but could not find a way that doesn't involve themes.xaml or ResourceDictionary
I'm setting in a WPF application the style of a button with this:
<Style TargetType="{x:Type Button}">
<Setter Property="ToolTipService.InitialShowDelay" Value="0"/>
<Setter Property="Height" Value="22" />
<Setter Property="Margin" Value="1" />
<Setter Property="Padding" Value="0" />
<Setter Property="VerticalAlignment" Value="Center" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Button}">
<Border Background="{TemplateBinding Background}"
BorderBrush="{TemplateBinding BorderBrush}"
Padding="{TemplateBinding Padding}"
BorderThickness="1">
<ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" Margin="1 -1 1 0"/>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
<Setter Property="Background" Value="{StaticResource NotSelectedButton}" />
<Setter Property="Foreground" Value="{StaticResource ActiveFg}" />
<Style.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Background" Value="{StaticResource Selected}" />
<Setter Property="Foreground" Value="{StaticResource SelectedFg}" />
</Trigger>
<Trigger Property="IsMouseOver" Value="False">
<Setter Property="Background" Value="{StaticResource NotSelectedButton}" />
<Setter Property="Foreground" Value="{StaticResource ActiveFg}" />
</Trigger>
<Trigger Property="IsEnabled" Value="False">
<Setter Property="Background" Value="{StaticResource NotSelectedButton}" />
<Setter Property="Foreground" Value="{StaticResource InactiveFg}" />
<!--<Setter Property="Foreground" Value="{StaticResource NotSelected}" />-->
</Trigger>
</Style.Triggers>
</Style>
However I want the TextBlock in the ContentPresenter to use a named TextBlock style defined as such:
<Style x:Key="ButtonText" TargetType="{x:Type TextBlock}">
<Setter Property="ToolTipService.InitialShowDelay" Value="0"/>
<Setter Property="Width" Value="auto" />
<Setter Property="MinWidth" Value="20" />
<Setter Property="TextAlignment" Value="Left" />
<Setter Property="Padding" Value="0 0 0 0" />
<Setter Property="Margin" Value="1 0 0 0" />
<Setter Property="VerticalAlignment" Value="Center" />
<Setter Property="HorizontalAlignment" Value="Center" />
</Style>
To test this style, just a Button in a UserControl or Window suffices: <Button>, and the style definitions can go in a resource dictionary (of UserControl or Window).
How can I do this ?
Trivial Solution via Direct Assignment
You can set the style directly by assigning a TextBlock as Content of each Button.
<Button>
<TextBlock Text="Test" Style="{StaticResource ButtonText}"/>
</Button>
Support Text As Content Only
If you are sure that you only put strings as content into your button, you can assign a ContentTemplate that contains a TextBlock to the ContentPresenter. This will not work for other content types in the sense that it would not display them as usual, but just their type name in the TextBlock.
<ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" Margin="1 -1 1 0">
<ContentPresenter.ContentTemplate>
<DataTemplate>
<TextBlock Style="{StaticResource ButtonText}" Text="{Binding}"/>
</DataTemplate>
</ContentPresenter.ContentTemplate>
</ContentPresenter>
Support All Content Types
If you want to support any content type as content of your button, you can define the data template from above in the ContentPresenter.Resources. Then, the ContentPresenter will only apply it, if the Content is a string. For all other content types it will work as usual.
<ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" Margin="1 -1 1 0">
<ContentPresenter.Resources>
<DataTemplate DataType="{x:Type system:String}">
<TextBlock Style="{StaticResource ButtonText}" Text="{Binding}"/>
</DataTemplate>
</ContentPresenter.Resources>
</ContentPresenter>
I have a WPF(4.0 on Win7) datagrid with AlternatingRowBackground when I scroll up row colors remain on place and data are moving when I scroll down colors are moving with data. Is it usual? Is it possible to get rid of this strange behavior?
Grid XAML:
<DataGrid AutoGenerateColumns="True"
CanUserAddRows="False"
Grid.Row="0" Grid.Column="0" Name="grdData"
ItemsSource="{Binding Path=.}" SelectionMode="Single"
HeadersVisibility="All"
AlternatingRowBackground="LightGray"
/>
Note: I have other question about scrolling ( WPF Datagrid scrolls up a bit when scrolled to end ) but I am not sure whether problems are connected.
Add EnableRowVirtualization="False" to your datagrid.
This trigger works with EnableRowVirtualization="True"
<DataGrid Name="dg" Style="{DynamicResource estiloDG}" MinRowHeight="40" GridLinesVisibility="None"
HorizontalGridLinesBrush="LightGray" VerticalGridLinesBrush="LightGray"
BorderBrush="Gray" BorderThickness="1" Foreground="#424242"
VerticalScrollBarVisibility="Auto" HorizontalScrollBarVisibility="Auto"
ItemsSource="{Binding ElementName=Me, Path=ItemsSource, Mode=OneWay}" x:FieldModifier="Private"
EnableRowVirtualization="True"
VirtualizingStackPanel.IsVirtualizing="True"
VirtualizingStackPanel.VirtualizationMode="Recycling"
CanUserAddRows="False" CanUserDeleteRows="False" CanUserReorderColumns="True" CanUserSortColumns="True">
<DataGrid.RowStyle>
<Style TargetType="{x:Type DataGridRow}">
<Style.Triggers>
<Trigger Property="AlternationIndex" Value="0">
<Setter Property="Background" Value="White" />
</Trigger>
<Trigger Property="AlternationIndex" Value="1">
<Setter Property="Background" Value="#FFD0E8D0" />
</Trigger>
</Style.Triggers>
</Style>
</DataGrid.RowStyle>
<DataGrid.Resources>
<Style x:Key="estiloDG" TargetType="{x:Type DataGrid}">
<Setter Property="BorderBrush" Value="White"/>
<Setter Property="Background" Value="White" />
<Setter Property="MinHeight" Value="30" />
<Setter Property="ColumnHeaderHeight" Value="30" />
<Setter Property="HeadersVisibility" Value="All" />
<Setter Property="RowBackground" Value="{StaticResource RowBackgroundBrush}" />
<Setter Property="AlternationCount" Value="2" />
<Setter Property="HorizontalGridLinesBrush" Value="{StaticResource DataGridHorizontalLinesBrush}" />
<Setter Property="VerticalGridLinesBrush" Value="{StaticResource DataGridHorizontalLinesBrush}" />
<Setter Property="CellStyle" Value="{StaticResource DataGridCellStyle}" />
<Setter Property="RowValidationErrorTemplate" Value="{StaticResource ErrorTemplate2}" />
<Setter Property="ColumnHeaderStyle" Value="{StaticResource DatagridColumnHeaderCustomTemplateStyle}" />
</Style>
</DataGrid.Resources>
How can I make the default border on my ListBoxItems a dotted border? See following way of styling it:
<Grid.Resources>
<Style TargetType="{x:Type ListBoxItem}">
<Setter Property="Height" Value="30" />
<Setter Property="BorderThickness" Value="0,0,0,1" />
<Setter Property="BorderBrush" Value="Silver" />
<Setter Property="Content" Value="" />
<Style.Triggers>
<Trigger Property="ItemsControl.AlternationIndex" Value="3">
<Setter Property="BorderBrush" Value="Black"></Setter>
</Trigger>
</Style.Triggers>
</Style>
</Grid.Resources>
Here I make the AlternationIndex 0, 1 and 2 to a dotted border instead of a solid line. How can this be done?
Try this:
<Window.Resources>
<SolidColorBrush x:Key="SelectedBackgroundBrush" Color="#DDD" />
<SolidColorBrush x:Key="DisabledForegroundBrush" Color="#888" />
<SolidColorBrush x:Key="DisabledBackgroundBrush" Color="#EEE" />
<!-- SimpleStyles: ListBoxItem -->
<Style TargetType="ListBoxItem" x:Key="ListBoxItemTemplate">
<Setter Property="SnapsToDevicePixels" Value="true"/>
<Setter Property="OverridesDefaultStyle" Value="true"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="ListBoxItem">
<Grid>
<Rectangle x:Name="Rectangle" Fill="Transparent" Stroke="Black"
StrokeDashCap="Square" StrokeThickness="0" SnapsToDevicePixels="True">
<Rectangle.StrokeDashArray>
<sys:Double>5</sys:Double>
</Rectangle.StrokeDashArray>
</Rectangle>
<Border
Name="Border"
Padding="2"
BorderThickness="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=BorderThickness}"
BorderBrush="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=BorderBrush}">
<ContentPresenter />
</Border>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsSelected" Value="true">
<Setter TargetName="Rectangle" Property="StrokeThickness" Value="1" />
<Setter TargetName="Border" Property="BorderThickness" Value="0" />
</Trigger>
<Trigger Property="IsSelected" Value="true">
<Setter TargetName="Rectangle" Property="Fill" Value="{StaticResource SelectedBackgroundBrush}" />
</Trigger>
<Trigger Property="IsEnabled" Value="false">
<Setter Property="Foreground" Value="{StaticResource DisabledForegroundBrush}" />
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style TargetType="{x:Type ListBoxItem}" BasedOn="{StaticResource ListBoxItemTemplate}">
<Setter Property="Height" Value="30" />
<Setter Property="BorderThickness" Value="0,0,0,1" />
<Setter Property="BorderBrush" Value="Silver" />
<Style.Triggers>
<Trigger Property="ItemsControl.AlternationIndex" Value="3">
<Setter Property="BorderBrush" Value="Black"></Setter>
</Trigger>
</Style.Triggers>
</Style>
</Window.Resources>
<StackPanel>
<ListBox>
<ListBoxItem Content="Item 1" />
<ListBoxItem Content="Item 2" />
<ListBoxItem Content="Item 3" />
<ListBoxItem Content="Item 4" />
</ListBox>
</StackPanel>
So I put a rectangle bellow the actual border in the control template. The rectangle can have its border be dotted, or dashed or w/e (to make the dash smaller just change the part to 2, 1 is not noticeable). So the default value of the rectangle's border thickness is 0, but when selected I set the thickness to 1 so it's visible. I made some border properties to be binded to its templated parent too, so it can look like what you set on your style (brush silver, thickness 0,0,0,1).