add new control ImageRadioButton

(new list style for radio button)
This commit is contained in:
Mahdi Hosseini committed 2018-12-04 15:24:06 +03:30
1 parent 9fc9693e2e
commit def100f842
5 files changed
+494 -5

No files matched your search

@@ -0,0 +1,57 @@
using HandyControl.Data;
using HandyControl.Tools;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Media;
namespace HandyControl.Controls
{
public class ImageRadioButton : RadioButton
{
public ImageRadioButton()
{
SetSideBrush(this, ResourceHelper.GetResource<Brush>(ResourceToken.PrimaryBrush));
}
public Geometry Image
{
get { return (Geometry)GetValue(ImageProperty); }
set { SetValue(ImageProperty, value); }
}
public static readonly DependencyProperty ImageProperty =
DependencyProperty.Register("Image", typeof(Geometry), typeof(ImageRadioButton));
public double ImageWidth
{
get { return (double)GetValue(ImageWidthProperty); }
set { SetValue(ImageWidthProperty, value); }
}
public static readonly DependencyProperty ImageWidthProperty =
DependencyProperty.Register("ImageWidth", typeof(double), typeof(ImageRadioButton), new PropertyMetadata(15.0));
public double ImageHeight
{
get { return (double)GetValue(ImageHeightProperty); }
set { SetValue(ImageHeightProperty, value); }
}
public static readonly DependencyProperty ImageHeightProperty =
DependencyProperty.Register("ImageHeight", typeof(double), typeof(ImageRadioButton), new PropertyMetadata(15.0));
public static readonly DependencyProperty SideBrushProperty = DependencyProperty.RegisterAttached(
"SideBrush", typeof(Brush), typeof(ImageRadioButton), new FrameworkPropertyMetadata(Brushes.Transparent, FrameworkPropertyMetadataOptions.Inherits));
public static void SetSideBrush(DependencyObject element, Brush value) => element.SetValue(SideBrushProperty, value);
public static Brush GetSideBrush(DependencyObject element) => (Brush)element.GetValue(SideBrushProperty);
}
}
+1
View File
@@ -45,6 +45,7 @@
<TargetFrameworkVersion>v4.6.2</TargetFrameworkVersion>
</PropertyGroup>
<ItemGroup>
<Compile Include="Controls\Input\ImageRadioButton.cs" />
<Compile Include="Controls\Other\AnimationPath.cs" />
<Compile Include="Controls\Attach\BackgroundSwitchElement.cs" />
<Compile Include="Controls\Attach\BorderElement.cs" />
+350
View File
@@ -52,4 +52,354 @@
</Setter>
</Style>
<Style x:Key="ToggleButtonExpanderStyle" TargetType="{x:Type ToggleButton}">
<Setter Property="Height" Value="32"></Setter>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type ToggleButton}">
<Border>
<Grid Background="Transparent" SnapsToDevicePixels="False">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="35" />
</Grid.ColumnDefinitions>
<Border x:Name="circle" Grid.Column="1" />
<Path
x:Name="arrow"
Grid.Column="1"
Width="6"
Height="10"
HorizontalAlignment="Center"
VerticalAlignment="Center"
Data="M352.19299999 96.196l415.63200001 415.804-415.632 415.803-63.445-63.616 352.017-352.209-352.017-352.102z"
Fill="{TemplateBinding Foreground}"
SnapsToDevicePixels="False"
Stretch="Fill"/>
<ContentPresenter
Grid.Column="0"
Margin="10,0,0,1"
HorizontalAlignment="Left"
VerticalAlignment="Center"
Content="{TemplateBinding Content}"
ContentStringFormat="{TemplateBinding ContentStringFormat}"
ContentTemplate="{TemplateBinding ContentTemplate}"
RecognizesAccessKey="True"
SnapsToDevicePixels="True" />
</Grid>
</Border>
<ControlTemplate.Triggers>
<Trigger Property="IsChecked" Value="True">
<Setter TargetName="arrow" Property="Width" Value="10" />
<Setter TargetName="arrow" Property="Height" Value="6" />
<Setter TargetName="arrow" Property="Data" Value="M927.804 352.19299999l-415.804 415.63200001-415.803-415.632 63.616-63.445 352.209 352.017 352.102-352.017z" />
</Trigger>
<Trigger Property="IsMouseOver" Value="True">
<Setter TargetName="arrow" Property="Opacity" Value="0.8" />
</Trigger>
<Trigger Property="IsPressed" Value="True">
<Setter TargetName="arrow" Property="Opacity" Value="0.7" />
</Trigger>
<Trigger Property="IsEnabled" Value="False">
<Setter TargetName="arrow" Property="Visibility" Value="Collapsed" />
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style x:Key="ExpanderListStyle" TargetType="{x:Type Expander}">
<Setter Property="Cursor" Value="Hand" />
<Setter Property="FocusVisualStyle" Value="{x:Null}" />
<Setter Property="Foreground" Value="{DynamicResource PrimaryTextBrush}" />
<Setter Property="Background" Value="Transparent" />
<Setter Property="HorizontalContentAlignment" Value="Stretch" />
<Setter Property="VerticalContentAlignment" Value="Stretch" />
<Setter Property="BorderBrush" Value="Transparent" />
<Setter Property="BorderThickness" Value="1" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Expander}">
<Border SnapsToDevicePixels="True">
<DockPanel>
<ToggleButton
x:Name="HeaderSite"
MinWidth="0"
MinHeight="0"
FocusVisualStyle="{x:Null}"
Padding="{TemplateBinding Padding}"
HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
Content="{TemplateBinding Header}"
ContentTemplate="{TemplateBinding HeaderTemplate}"
DockPanel.Dock="Top"
FontFamily="{TemplateBinding FontFamily}"
FontSize="{TemplateBinding FontSize}"
FontStretch="{TemplateBinding FontStretch}"
FontStyle="{TemplateBinding FontStyle}"
FontWeight="{TemplateBinding FontWeight}"
Foreground="{TemplateBinding Foreground}"
Style="{StaticResource ToggleButtonExpanderStyle}"
IsChecked="{Binding IsExpanded, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}}">
</ToggleButton>
<ContentPresenter
x:Name="ExpandSite"
Margin="{TemplateBinding Padding}"
HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
Content="{TemplateBinding Content}"
ContentStringFormat="{TemplateBinding ContentStringFormat}"
ContentTemplate="{TemplateBinding ContentTemplate}"
DockPanel.Dock="Bottom"
Focusable="False"
Visibility="Collapsed" />
</DockPanel>
</Border>
<ControlTemplate.Triggers>
<Trigger Property="IsExpanded" Value="True">
<Setter TargetName="ExpandSite" Property="Visibility" Value="Visible" />
</Trigger>
<Trigger Property="ExpandDirection" Value="Right">
<Setter TargetName="ExpandSite" Property="DockPanel.Dock" Value="Right" />
<Setter TargetName="HeaderSite" Property="DockPanel.Dock" Value="Left" />
<Setter TargetName="HeaderSite" Property="Style">
<Setter.Value>
<Style TargetType="{x:Type ToggleButton}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type ToggleButton}">
<Border Padding="{TemplateBinding Padding}">
<Grid Background="Transparent" SnapsToDevicePixels="False">
<Grid.RowDefinitions>
<RowDefinition Height="19" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<Grid>
<Grid.LayoutTransform>
<TransformGroup>
<RotateTransform Angle="-90" />
</TransformGroup>
</Grid.LayoutTransform>
<Ellipse
x:Name="circle"
Width="19"
Height="19"
HorizontalAlignment="Center"
VerticalAlignment="Center"
Fill="White"
Stroke="#FF333333" />
<Path
x:Name="arrow"
HorizontalAlignment="Center"
VerticalAlignment="Center"
Data="M1,1.5L4.5,5 8,1.5"
SnapsToDevicePixels="False"
Stroke="#FF333333"
StrokeThickness="2" />
</Grid>
<ContentPresenter
Grid.Row="1"
Margin="0,4,0,0"
HorizontalAlignment="Center"
VerticalAlignment="Top"
Content="{TemplateBinding Content}"
ContentStringFormat="{TemplateBinding ContentStringFormat}"
ContentTemplate="{TemplateBinding ContentTemplate}"
RecognizesAccessKey="True"
SnapsToDevicePixels="True" />
</Grid>
</Border>
<ControlTemplate.Triggers>
<Trigger Property="IsChecked" Value="True">
<Setter TargetName="arrow" Property="Data" Value="M1,4.5L4.5,1 8,4.5" />
</Trigger>
<Trigger Property="IsMouseOver" Value="True">
<Setter TargetName="circle" Property="Stroke" Value="#FF5593FF" />
<Setter TargetName="circle" Property="Fill" Value="#FFF3F9FF" />
<Setter TargetName="arrow" Property="Stroke" Value="Black" />
</Trigger>
<Trigger Property="IsPressed" Value="True">
<Setter TargetName="circle" Property="Stroke" Value="#FF3C77DD" />
<Setter TargetName="circle" Property="StrokeThickness" Value="1.5" />
<Setter TargetName="circle" Property="Fill" Value="#FFD9ECFF" />
<Setter TargetName="arrow" Property="Stroke" Value="Black" />
</Trigger>
<Trigger Property="IsEnabled" Value="False">
<Setter TargetName="circle" Property="Stroke" Value="#FFBCBCBC" />
<Setter TargetName="circle" Property="Fill" Value="#FFE6E6E6" />
<Setter TargetName="arrow" Property="Stroke" Value="#FF707070" />
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</Setter.Value>
</Setter>
</Trigger>
<Trigger Property="ExpandDirection" Value="Up">
<Setter TargetName="ExpandSite" Property="DockPanel.Dock" Value="Top" />
<Setter TargetName="HeaderSite" Property="DockPanel.Dock" Value="Bottom" />
<Setter TargetName="HeaderSite" Property="Style">
<Setter.Value>
<Style TargetType="{x:Type ToggleButton}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type ToggleButton}">
<Border Padding="{TemplateBinding Padding}">
<Grid Background="Transparent" SnapsToDevicePixels="False">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="19" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Grid>
<Grid.LayoutTransform>
<TransformGroup>
<RotateTransform Angle="180" />
</TransformGroup>
</Grid.LayoutTransform>
<Ellipse
x:Name="circle"
Width="19"
Height="19"
HorizontalAlignment="Center"
VerticalAlignment="Center"
Fill="White"
Stroke="#FF333333" />
<Path
x:Name="arrow"
HorizontalAlignment="Center"
VerticalAlignment="Center"
Data="M1,1.5L4.5,5 8,1.5"
SnapsToDevicePixels="False"
Stroke="#FF333333"
StrokeThickness="2" />
</Grid>
<ContentPresenter
Grid.Column="1"
Margin="4,0,0,0"
HorizontalAlignment="Left"
VerticalAlignment="Center"
Content="{TemplateBinding Content}"
ContentStringFormat="{TemplateBinding ContentStringFormat}"
ContentTemplate="{TemplateBinding ContentTemplate}"
RecognizesAccessKey="True"
SnapsToDevicePixels="True" />
</Grid>
</Border>
<ControlTemplate.Triggers>
<Trigger Property="IsChecked" Value="True">
<Setter TargetName="arrow" Property="Data" Value="M1,4.5L4.5,1 8,4.5" />
</Trigger>
<Trigger Property="IsMouseOver" Value="True">
<Setter TargetName="circle" Property="Stroke" Value="#FF5593FF" />
<Setter TargetName="circle" Property="Fill" Value="#FFF3F9FF" />
<Setter TargetName="arrow" Property="Stroke" Value="Black" />
</Trigger>
<Trigger Property="IsPressed" Value="True">
<Setter TargetName="circle" Property="Stroke" Value="#FF3C77DD" />
<Setter TargetName="circle" Property="StrokeThickness" Value="1.5" />
<Setter TargetName="circle" Property="Fill" Value="#FFD9ECFF" />
<Setter TargetName="arrow" Property="Stroke" Value="Black" />
</Trigger>
<Trigger Property="IsEnabled" Value="False">
<Setter TargetName="circle" Property="Stroke" Value="#FFBCBCBC" />
<Setter TargetName="circle" Property="Fill" Value="#FFE6E6E6" />
<Setter TargetName="arrow" Property="Stroke" Value="#FF707070" />
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</Setter.Value>
</Setter>
</Trigger>
<Trigger Property="ExpandDirection" Value="Left">
<Setter TargetName="ExpandSite" Property="DockPanel.Dock" Value="Left" />
<Setter TargetName="HeaderSite" Property="DockPanel.Dock" Value="Right" />
<Setter TargetName="HeaderSite" Property="Style">
<Setter.Value>
<Style TargetType="{x:Type ToggleButton}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type ToggleButton}">
<Border Padding="{TemplateBinding Padding}">
<Grid Background="Transparent" SnapsToDevicePixels="False">
<Grid.RowDefinitions>
<RowDefinition Height="19" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<Grid>
<Grid.LayoutTransform>
<TransformGroup>
<RotateTransform Angle="90" />
</TransformGroup>
</Grid.LayoutTransform>
<Ellipse
x:Name="circle"
Width="19"
Height="19"
HorizontalAlignment="Center"
VerticalAlignment="Center"
Fill="White"
Stroke="#FF333333" />
<Path
x:Name="arrow"
HorizontalAlignment="Center"
VerticalAlignment="Center"
Data="M1,1.5L4.5,5 8,1.5"
SnapsToDevicePixels="False"
Stroke="#FF333333"
StrokeThickness="2" />
</Grid>
<ContentPresenter
Grid.Row="1"
Margin="0,4,0,0"
HorizontalAlignment="Center"
VerticalAlignment="Top"
Content="{TemplateBinding Content}"
ContentStringFormat="{TemplateBinding ContentStringFormat}"
ContentTemplate="{TemplateBinding ContentTemplate}"
RecognizesAccessKey="True"
SnapsToDevicePixels="True" />
</Grid>
</Border>
<ControlTemplate.Triggers>
<Trigger Property="IsChecked" Value="True">
<Setter TargetName="arrow" Property="Data" Value="M1,4.5L4.5,1 8,4.5" />
</Trigger>
<Trigger Property="IsMouseOver" Value="True">
<Setter TargetName="circle" Property="Stroke" Value="#FF5593FF" />
<Setter TargetName="circle" Property="Fill" Value="#FFF3F9FF" />
<Setter TargetName="arrow" Property="Stroke" Value="Black" />
</Trigger>
<Trigger Property="IsPressed" Value="True">
<Setter TargetName="circle" Property="Stroke" Value="#FF3C77DD" />
<Setter TargetName="circle" Property="StrokeThickness" Value="1.5" />
<Setter TargetName="circle" Property="Fill" Value="#FFD9ECFF" />
<Setter TargetName="arrow" Property="Stroke" Value="Black" />
</Trigger>
<Trigger Property="IsEnabled" Value="False">
<Setter TargetName="circle" Property="Stroke" Value="#FFBCBCBC" />
<Setter TargetName="circle" Property="Fill" Value="#FFE6E6E6" />
<Setter TargetName="arrow" Property="Stroke" Value="#FF707070" />
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</Setter.Value>
</Setter>
</Trigger>
<Trigger Property="IsEnabled" Value="False">
<Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}" />
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</ResourceDictionary>
@@ -1,4 +1,5 @@
<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:controls="clr-namespace:HandyControl.Controls"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<ResourceDictionary.MergedDictionaries>
@@ -10,4 +11,64 @@
<Style x:Key="RadioButtonCustom" BasedOn="{StaticResource ToggleButtonCustom}" TargetType="RadioButton"/>
<Style TargetType="{x:Type controls:ImageRadioButton}">
<Setter Property="Height" Value="32" />
<Setter Property="Cursor" Value="Hand" />
<Setter Property="FocusVisualStyle" Value="{x:Null}" />
<Setter Property="Foreground" Value="{DynamicResource SecondaryTextBrush}" />
<Setter Property="Background" Value="{DynamicResource RegionBrush}"/>
<Setter Property="BorderBrush" Value="Transparent"/>
<Setter Property="BorderThickness" Value="1" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type controls:ImageRadioButton}">
<Border
x:Name="templateRoot"
Background="Transparent"
BorderThickness="3,0,0,0">
<WrapPanel
VerticalAlignment="Center"
Orientation="Horizontal"
SnapsToDevicePixels="True">
<Border x:Name="img" Width="40">
<Path
Width="{TemplateBinding ImageWidth}"
Height="{TemplateBinding ImageHeight}"
Margin="15,0,0,0"
Data="{TemplateBinding Image}"
Fill="{TemplateBinding Foreground}"
Stretch="Fill" />
</Border>
<ContentPresenter
x:Name="contentPresenter"
Grid.Column="1"
Margin="5,0,0,0"
HorizontalAlignment="Left"
VerticalAlignment="Center"
Content="{TemplateBinding Content}"
ContentStringFormat="{TemplateBinding ContentStringFormat}"
ContentTemplate="{TemplateBinding ContentTemplate}"
Focusable="False"
RecognizesAccessKey="True"
SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" />
</WrapPanel>
</Border>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Foreground" Value="{DynamicResource PrimaryTextBrush}" />
</Trigger>
<Trigger Property="IsEnabled" Value="False" />
<Trigger Property="IsPressed" Value="True" />
<Trigger Property="Image" Value="{x:Null}">
<Setter Property="Visibility" Value="Collapsed" TargetName="img"/>
</Trigger>
<Trigger Property="IsChecked" Value="True">
<Setter TargetName="templateRoot" Property="BorderBrush" Value="{Binding Path=(controls:ImageRadioButton.SideBrush),RelativeSource={RelativeSource TemplatedParent}}" />
<Setter Property="Foreground" Value="{DynamicResource PrimaryTextBrush}" />
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</ResourceDictionary>
@@ -6,11 +6,31 @@
Background="{DynamicResource RegionBrush}"
Width="400">
<controls:TransitioningContentControl>
<StackPanel Margin="32" HorizontalAlignment="Center" VerticalAlignment="Center">
<RadioButton Content="{x:Static langs:Lang.RadioButton}"/>
<RadioButton Margin="0,16,0,0" Content="{x:Static langs:Lang.RadioButton}" IsChecked="True" IsEnabled="False"/>
<RadioButton Margin="0,16,0,0" Content="{x:Static langs:Lang.RadioButton}"/>
<RadioButton Margin="0,16,0,0" Content="{x:Static langs:Lang.RadioButton}" IsEnabled="False"/>
<StackPanel Width="400">
<GroupBox Background="Transparent" Margin="10" Header="Base Style">
<StackPanel Margin="32" HorizontalAlignment="Center" VerticalAlignment="Center">
<RadioButton Content="{x:Static langs:Lang.RadioButton}"/>
<RadioButton Margin="0,16,0,0" Content="{x:Static langs:Lang.RadioButton}" IsChecked="True" IsEnabled="False"/>
<RadioButton Margin="0,16,0,0" Content="{x:Static langs:Lang.RadioButton}"/>
<RadioButton Margin="0,16,0,0" Content="{x:Static langs:Lang.RadioButton}" IsEnabled="False"/>
</StackPanel>
</GroupBox>
<GroupBox Background="Transparent" Margin="10" Header="List Style">
<StackPanel Margin="32" HorizontalAlignment="Center" VerticalAlignment="Center">
<controls:ImageRadioButton IsChecked="True" SideBrush="{DynamicResource SuccessBrush}" Content="{x:Static langs:Lang.RadioButton}"/>
<controls:ImageRadioButton Margin="0,16,0,0" SideBrush="{DynamicResource WarningBrush}" Content="{x:Static langs:Lang.RadioButton}"/>
<controls:ImageRadioButton Margin="0,16,0,0" Content="{x:Static langs:Lang.RadioButton}"/>
<controls:ImageRadioButton Margin="0,16,0,0" Content="{x:Static langs:Lang.RadioButton}"/>
<Expander Header="SubMenu with Image" Style="{StaticResource ExpanderListStyle}">
<StackPanel>
<controls:ImageRadioButton Image="{DynamicResource WindowsGeometry}" SideBrush="{DynamicResource SuccessBrush}" Content="{x:Static langs:Lang.RadioButton}"/>
<controls:ImageRadioButton Image="{DynamicResource CalendarGeometry}" IsChecked="True" Margin="0,16,0,0" SideBrush="{DynamicResource WarningBrush}" Content="{x:Static langs:Lang.RadioButton}"/>
<controls:ImageRadioButton Image="{DynamicResource ContributorsGeometry}" Margin="0,16,0,0" Content="{x:Static langs:Lang.RadioButton}"/>
<controls:ImageRadioButton Image="{DynamicResource EmailGeometry}" Margin="0,16,0,0" Content="{x:Static langs:Lang.RadioButton}"/>
</StackPanel>
</Expander>
</StackPanel>
</GroupBox>
</StackPanel>
</controls:TransitioningContentControl>
</UserControl>