Hi !
I'm using a radButton because if i use radRadioButton when i've "checked" it the background theme is green like the same unlock svg color, but i want make an exception background color when my RadRadioButton use this svg.
But my menu selection must be all radradiobutton because when one of them is selection page content (ViewModel) must change. the lock/unlock buttons are new because my project change and next access to the parts and conditioned by a validation page.
<UserControl.Resources>
<PathGeometry x:Key="UnLock" Figures="M18 1C15.24 1 13 3.24 13 6V8H4C2.9 8 2 8.89 2 10V20C2 21.11 2.9 22 4 22H16C17.11 22 18 21.11 18 20V10C18 8.9 17.11 8 16 8H15V6C15 4.34 16.34 3 18 3C19.66 3 21 4.34 21 6V8H23V6C23 3.24 20.76 1 18 1M10 13C11.1 13 12 13.89 12 15C12 16.11 11.11 17 10 17C8.9 17 8 16.11 8 15C8 13.9 8.9 13 10 13Z"/>
<PathGeometry x:Key="Lock" Figures="M12,17A2,2 0 0,0 14,15C14,13.89 13.1,13 12,13A2,2 0 0,0 10,15A2,2 0 0,0 12,17M18,8A2,2 0 0,1 20,10V20A2,2 0 0,1 18,22H6A2,2 0 0,1 4,20V10C4,8.89 4.9,8 6,8H7V6A5,5 0 0,1 12,1A5,5 0 0,1 17,6V8H18M12,3A3,3 0 0,0 9,6V8H15V6A3,3 0 0,0 12,3Z"/>
</UserControl.Resources>
<Grid Grid.Column="1" Width="50" HorizontalAlignment="Center" VerticalAlignment="Center" Margin="0,0,0,5">
<telerik:RadButton Cursor="Hand" Padding="4" Command="{Binding InitValidationCommand}">
<Viewbox Width="32" Height="32">
<Canvas Width="24" Height="24">
<Path>
<Path.Style>
<Style TargetType="Path">
<Setter Property="Data" Value="{StaticResource ResourceKey=Lock}"/>
<Setter Property="Fill" Value="#F44336"/>
<Style.Triggers>
<DataTrigger Binding="{Binding InitEtude.IsDeverrouille}" Value="True">
<Setter Property="Data" Value="{StaticResource ResourceKey=UnLock}" />
<Setter Property="Fill" Value="{telerik:Windows11Resource ResourceKey=AccentBrush}"/>
</DataTrigger>
</Style.Triggers>
</Style>
</Path.Style>
</Path>
</Canvas>
</Viewbox>
</telerik:RadButton>
</Grid>
i've tested in other part of my project many option but to overflow theme checked definition :
- no success
<telerik:RadRadioButton Width="115" Height="50" Cursor="Hand" Margin="0,0,0,5" GroupName="test">
<ControlTemplate TargetType="telerik:RadRadioButton">
<ControlTemplate.Triggers>
<Trigger Property="IsChecked" Value="True">
<Setter Property="Background" Value="Red"/>
<Setter Property="helpers:ThemeHelper.CheckedBackgroundBrush" Value="red"/>
<Setter Property="helpers:ThemeHelper.CheckedBrush" Value="blue"/>
</Trigger>
<Trigger Property="IsPressed" Value="True">
<Setter Property="Background" Value="Red"/>
<Setter Property="helpers:ThemeHelper.CheckedBackgroundBrush" Value="red"/>
<Setter Property="helpers:ThemeHelper.CheckedBrush" Value="blue"/>
</Trigger>
<Trigger Property="IsEnabled" Value="True">
<Setter Property="Background" Value="Red"/>
<Setter Property="helpers:ThemeHelper.CheckedBackgroundBrush" Value="red"/>
<Setter Property="helpers:ThemeHelper.CheckedBrush" Value="blue"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</telerik:RadRadioButton>
Hi Vincent,
I am having trouble understanding how it is all connected in this case. Would it be possible to create a small project that shows your exact case? This will give us a better understanding of your requirements.
In addition, I wanted to ask you which theme and theming approach are you using (Xaml or NoXaml).
It seems to me that a toggle button is more suitable for this case since radio buttons must be grouped in order for them to work properly.
Thank you in advance for your patience and cooperation. I am looking forward to your reply.
Hi Dimitar,
I don't know enough wpf to tell you if xaml or noxaml is used.
Thinks windows11 :
My colleague (currently on vacation) is at the origin of the project.
he created the radRadioButton text buttons (with the same GroupName) so that each click deactivates the others and opens a new view below.
But in the recently modified specifications it is necessary to go through validation steps (lock/unlock) before accessing the next step.
To add the locks I tried to continue also using the radRadioButton but with an svg icon. I did not succeed. yesterday I had to use classic radio buttons only for lock buttons which use the same GroupName
but how should I have used the RadRadioButtons?
below an example of the 1st button (RadRadioButton) and the lock radioButton
<UserControl.Resources> <PathGeometry x:Key="UnLock" Figures="M18 1C15.24 1 13 3.24 13 6V8H4C2.9 8 2 8.89 2 10V20C2 21.11 2.9 22 4 22H16C17.11 22 18 21.11 18 20V10C18 8.9 17.11 8 16 8H15V6C15 4.34 16.34 3 18 3C19.66 3 21 4.34 21 6V8H23V6C23 3.24 20.76 1 18 1M10 13C11.1 13 12 13.89 12 15C12 16.11 11.11 17 10 17C8.9 17 8 16.11 8 15C8 13.9 8.9 13 10 13Z"/> <PathGeometry x:Key="Lock" Figures="M12,17A2,2 0 0,0 14,15C14,13.89 13.1,13 12,13A2,2 0 0,0 10,15A2,2 0 0,0 12,17M18,8A2,2 0 0,1 20,10V20A2,2 0 0,1 18,22H6A2,2 0 0,1 4,20V10C4,8.89 4.9,8 6,8H7V6A5,5 0 0,1 12,1A5,5 0 0,1 17,6V8H18M12,3A3,3 0 0,0 9,6V8H15V6A3,3 0 0,0 12,3Z"/> </UserControl.Resources> <Grid Grid.Column="0" Background="Transparent" HorizontalAlignment="Center" VerticalAlignment="Center" Margin="0,0,0,5"> <telerik:RadRadioButton Width="130" Height="50" Cursor="Hand" GroupName="CategoriesDefProjet" IsChecked="{Binding IsInitProjet}"> <telerik:RadRadioButton.ContentTemplate> <DataTemplate> <Grid> <Grid.ColumnDefinitions> <ColumnDefinition Width="Auto" /> <ColumnDefinition /> </Grid.ColumnDefinitions> <Grid> <Grid Visibility="{Binding HasNoAnalyse, Converter={StaticResource BooleanToVisibility}}" ToolTip="Une analyse est à réaliser" Margin="0,0,7,0"> <Rectangle Width="20" Height="20" Fill="#8BC34A" RadiusX="10" RadiusY="10" /> <TextBlock Text="1" FontSize="12" Margin="1,-1,0,0" FontWeight="DemiBold" Foreground="#FFFFFF" VerticalAlignment="Center" HorizontalAlignment="Center" /> </Grid> </Grid> <StackPanel Grid.Column="1"> <TextBlock Text="Initialisation" HorizontalAlignment="Center" /> </StackPanel> </Grid> </DataTemplate> </telerik:RadRadioButton.ContentTemplate> </telerik:RadRadioButton> </Grid> <Grid Grid.Column="1" Width="50" HorizontalAlignment="Center" VerticalAlignment="Center" Margin="0,0,0,5"> <!-- Radio Button Specifique pour cadenas, car si couleur icon illisible. ne peut pas être telerik. --> <RadioButton GroupName="CategoriesDefProjet" Cursor="Hand" IsChecked="{Binding IsInitValidation}"> <RadioButton.Template> <ControlTemplate TargetType="{x:Type RadioButton}"> <Grid> <Border x:Name="bdr" Background="{telerik:Windows11Resource ResourceKey=PrimaryBackgroundBrush}" BorderBrush="{telerik:Windows11Resource ResourceKey=ButtonBorderBrush}" BorderThickness="1" CornerRadius="{telerik:Windows11Resource ResourceKey=CornerRadius}" > <Viewbox Width="32" Height="32"> <Canvas Width="24" Height="24"> <Path> <Path.Style> <Style TargetType="Path"> <Setter Property="Data" Value="{StaticResource ResourceKey=Lock}"/> <Setter Property="Fill" Value="#F44336"/> <Style.Triggers> <DataTrigger Binding="{Binding InitEtude.IsDeverrouille}" Value="True"> <Setter Property="Data" Value="{StaticResource ResourceKey=UnLock}" /> <Setter Property="Fill" Value="{telerik:Windows11Resource ResourceKey=AccentBrush}"/> </DataTrigger> </Style.Triggers> </Style> </Path.Style> </Path> </Canvas> </Viewbox> </Border> </Grid> <ControlTemplate.Triggers > <Trigger Property="IsChecked" Value="True"> <Setter TargetName="bdr" Property="BorderThickness" Value="3"/> <Setter TargetName="bdr" Property="BorderBrush" Value="{telerik:Windows11Resource ResourceKey=AccentBrush}" /> </Trigger> <MultiTrigger> <MultiTrigger.Conditions> <Condition Property="IsMouseOver" Value="True"/> <Condition Property="IsChecked" Value="False"/> </MultiTrigger.Conditions> <Setter TargetName="bdr" Property="Background" Value="{telerik:Windows11Resource ResourceKey=MouseOverBackgroundBrush}"/> </MultiTrigger> </ControlTemplate.Triggers> </ControlTemplate> </RadioButton.Template> </RadioButton> </Grid>
Hi Vincent,
I am still having trouble understanding what isn't working properly. If this works with the standard buttons can you record a small video that shows the difference?
In addition, can you share part of the view model so I can see what changes there as well?
Thank you in advance for your patience and cooperation.
Hi Dimitar,
Attached is an example.
3 RadRadioButton
- one with text
- one with a canvas for SVG (closed padlock)
- the other with a canvas for SVG (open padlock)
if I click on those which are in image form, the theme makes these buttons very difficult to read.
I must therefore only in these cases not put the green background during the "Checked" state of the radradiobutton.
However, I must maintain the general formatting of the theme.
Having failed to indicate in Xaml the fact of leaving the same basic color for the selection, I had to use a classic radiobutton. but I would have liked to be able to do it with the radradiobutton.
no problem in modelview all is on xaml file.
Thanks for your help.
Hi Vincent,
Ok I understand, but please note that I was not able to reproduce this with the shared XAML and the Windows11 theme. Is it possible that something is changed in the theme files?
Would it be possible to share the project from the video?
I am looking forward to your reply.
Hi Dimitar !
Sorry for this late message (i'm on vacation Friday @ 6pm (and back september 9), and some peoples are back)
i can't share project because is big, has connection to our SQL database etc...
but i can share theme folder, i'm on 5 to 10% of project, the other part was done by my colleague who has been absent for a while (June, accident & vacation) and he will be back on August 20.
Hi Vincent,
I have used the themes in my project but still cannot reproduce this. I have attached my test project. Could you please update it so it reproduces the undesired scenario and send it back to me? This will allow me to properly investigate this.
Thank you in advance for your patience and cooperation.
Hi Dimitar !
Ok, i've install and run projet.
On selection button is blue.
In my full project, button is green and i'm remember colors change from parts of application (see video).
video explain :
First part (0:13) you can see in section after menu global theme color change blue etc..
in my part theme color is green.
But is the same,
in full project my unlock swg color is green and in this part RadRadioButton checked is green
if i use svg with blue color on RadRadioButton i don't want color on selection (just change like i've made border for example)
because svg is not visible with the same color, or lock red on green checked background is awful for eyes.
I search where theme part change in code, if i found it, i post here.
i've found selection theme !
when is select my section "Foncier" and select sub part i've got this code with "IsFoncier" contexteSingleton defined and messenger in singleton :
On App.xaml.cs
public App() { StyleManager.ApplicationTheme = new Windows11Theme(); SetTheme(null); var cultureInfo = new CultureInfo("fr-FR"); Thread.CurrentThread.CurrentCulture = cultureInfo; Thread.CurrentThread.CurrentUICulture = cultureInfo; FrameworkElement.LanguageProperty.OverrideMetadata(typeof(FrameworkElement), new FrameworkPropertyMetadata(XmlLanguage.GetLanguage(CultureInfo.CurrentCulture.IetfLanguageTag))); Messenger.Default.Register<ContexteMessenger>(this, SetTheme); InitializeComponent(); Exit += App_Exit; DispatcherUnhandledException += App_DispatcherUnhandledException; }
Hi Vincent,
I am sorry for the late reply. I have added the code but I still cannot reproduce this. This seems to be a very specific case. Perhaps it would be better to open a new support ticket which is a private thread. This way you can attach your project and we will be able to examine it and determine what is causing this.
I appreciate your understanding.