Skip to content

Commit 704042c

Browse files
JorisCleVRJorisCleVR
authored
MaterialDesignTabRadioButton: When selected forgeround is set to BorderBrush (#2402)
Also added examples and fix for horizontal and vertical icons in a MaterialDesignTabRadioButton
1 parent 997a712 commit 704042c

File tree

2 files changed

+147
-56
lines changed

2 files changed

+147
-56
lines changed

‎MainDemo.Wpf/Toggles.xaml

Lines changed: 141 additions & 55 deletions
Original file line numberDiff line numberDiff line change
@@ -626,18 +626,21 @@
626626
Margin="4">
627627
<RadioButton
628628
Style="{StaticResource MaterialDesignTabRadioButtonTop}"
629+
BorderBrush="{DynamicResource PrimaryHueMidBrush}"
629630
Margin="4"
630631
IsChecked="True"
631632
Content="FIRST"/>
632633

633634
<RadioButton
634635
Style="{StaticResource MaterialDesignTabRadioButtonTop}"
636+
BorderBrush="{DynamicResource PrimaryHueMidBrush}"
635637
Margin="4"
636638
IsChecked="False"
637639
Content="SECOND"/>
638640

639641
<RadioButton
640642
Style="{StaticResource MaterialDesignTabRadioButtonTop}"
643+
BorderBrush="{DynamicResource PrimaryHueMidBrush}"
641644
Margin="4"
642645
IsChecked="False"
643646
IsEnabled="False"
@@ -648,24 +651,27 @@
648651
<smtx:XamlDisplay
649652
UniqueKey="buttons_72"
650653
HorizontalAlignment="Left">
651-
<materialDesign:ColorZone Mode="PrimaryMid">
654+
<materialDesign:ColorZone Mode="SecondaryMid">
652655
<StackPanel
653656
Orientation="Horizontal"
654657
Margin="2">
655658
<RadioButton
656659
Style="{StaticResource MaterialDesignTabRadioButtonTop}"
660+
BorderBrush="{DynamicResource PrimaryHueMidBrush}"
657661
Margin="4"
658662
IsChecked="True"
659663
Content="FIRST"/>
660664

661665
<RadioButton
662666
Style="{StaticResource MaterialDesignTabRadioButtonTop}"
667+
BorderBrush="{DynamicResource PrimaryHueMidBrush}"
663668
Margin="4"
664669
IsChecked="False"
665670
Content="SECOND"/>
666671

667672
<RadioButton
668673
Style="{StaticResource MaterialDesignTabRadioButtonTop}"
674+
BorderBrush="{DynamicResource PrimaryHueMidBrush}"
669675
Margin="4"
670676
IsChecked="False"
671677
IsEnabled="False"
@@ -677,9 +683,89 @@
677683

678684
</WrapPanel>
679685
<WrapPanel Orientation="Horizontal" Margin="0 24 0 0">
680-
<StackPanel Orientation="Horizontal">
686+
<StackPanel>
681687
<smtx:XamlDisplay
682688
UniqueKey="buttons_73"
689+
HorizontalAlignment="Left">
690+
<StackPanel
691+
Orientation="Horizontal"
692+
Margin="4">
693+
<RadioButton
694+
Style="{StaticResource MaterialDesignTabRadioButton}"
695+
Margin="4"
696+
IsChecked="True">
697+
<StackPanel>
698+
<materialDesign:PackIcon HorizontalAlignment="Center" Kind="Star" />
699+
<TextBlock Margin="0 4 0 0" Text="FIRST" />
700+
</StackPanel>
701+
</RadioButton>
702+
703+
<RadioButton
704+
Style="{StaticResource MaterialDesignTabRadioButton}"
705+
Margin="4"
706+
IsChecked="False">
707+
<StackPanel>
708+
<materialDesign:PackIcon HorizontalAlignment="Center" Kind="Heart" />
709+
<TextBlock Margin="0 4 0 0" Text="SECOND" />
710+
</StackPanel>
711+
</RadioButton>
712+
713+
<RadioButton
714+
Style="{StaticResource MaterialDesignTabRadioButton}"
715+
Margin="4"
716+
IsChecked="False"
717+
IsEnabled="False">
718+
<StackPanel>
719+
<materialDesign:PackIcon HorizontalAlignment="Center" Kind="Smiley" />
720+
<TextBlock Margin="0 4 0 0" Text="THIRD" />
721+
</StackPanel>
722+
</RadioButton>
723+
</StackPanel>
724+
</smtx:XamlDisplay>
725+
<smtx:XamlDisplay
726+
UniqueKey="buttons_74"
727+
HorizontalAlignment="Left">
728+
<StackPanel
729+
Orientation="Horizontal"
730+
Margin="4">
731+
<RadioButton
732+
Style="{StaticResource MaterialDesignTabRadioButton}"
733+
Margin="4"
734+
IsChecked="True">
735+
<StackPanel Orientation="Horizontal">
736+
<materialDesign:PackIcon Kind="Star" />
737+
<TextBlock Margin="4 0 0 0" Text="FIRST" />
738+
</StackPanel>
739+
</RadioButton>
740+
741+
<RadioButton
742+
Style="{StaticResource MaterialDesignTabRadioButton}"
743+
Margin="4"
744+
IsChecked="False">
745+
<StackPanel Orientation="Horizontal">
746+
<materialDesign:PackIcon Kind="Heart" />
747+
<TextBlock Margin="4 0 0 0" Text="SECOND" />
748+
</StackPanel>
749+
</RadioButton>
750+
751+
<RadioButton
752+
Style="{StaticResource MaterialDesignTabRadioButton}"
753+
Margin="4"
754+
IsChecked="False"
755+
IsEnabled="False">
756+
<StackPanel Orientation="Horizontal">
757+
<materialDesign:PackIcon Kind="Smiley" />
758+
<TextBlock Margin="4 0 0 0" Text="THIRD" />
759+
</StackPanel>
760+
</RadioButton>
761+
</StackPanel>
762+
</smtx:XamlDisplay>
763+
</StackPanel>
764+
</WrapPanel>
765+
<WrapPanel Orientation="Horizontal" Margin="0 24 0 0">
766+
<StackPanel Orientation="Horizontal">
767+
<smtx:XamlDisplay
768+
UniqueKey="buttons_75"
683769
HorizontalAlignment="Left">
684770
<StackPanel
685771
Orientation="Vertical"
@@ -704,40 +790,11 @@
704790
Content="THIRD"/>
705791
</StackPanel>
706792
</smtx:XamlDisplay>
707-
708-
<smtx:XamlDisplay
709-
UniqueKey="buttons_74"
710-
HorizontalAlignment="Left">
711-
<materialDesign:ColorZone Mode="PrimaryMid">
712-
<StackPanel
713-
Orientation="Vertical"
714-
Margin="2">
715-
<RadioButton
716-
Style="{StaticResource MaterialDesignTabRadioButtonRight}"
717-
Margin="4"
718-
IsChecked="True"
719-
Content="FIRST"/>
720-
721-
<RadioButton
722-
Style="{StaticResource MaterialDesignTabRadioButtonRight}"
723-
Margin="4"
724-
IsChecked="False"
725-
Content="SECOND"/>
726-
727-
<RadioButton
728-
Style="{StaticResource MaterialDesignTabRadioButtonRight}"
729-
Margin="4"
730-
IsChecked="False"
731-
IsEnabled="False"
732-
Content="THIRD"/>
733-
</StackPanel>
734-
</materialDesign:ColorZone>
735-
</smtx:XamlDisplay>
736793
</StackPanel>
737794

738795
<StackPanel Orientation="Horizontal">
739796
<smtx:XamlDisplay
740-
UniqueKey="buttons_75"
797+
UniqueKey="buttons_76"
741798
HorizontalAlignment="Left">
742799
<StackPanel
743800
Orientation="Vertical"
@@ -763,34 +820,63 @@
763820
</StackPanel>
764821
</smtx:XamlDisplay>
765822

823+
</StackPanel>
824+
825+
<StackPanel>
766826
<smtx:XamlDisplay
767-
UniqueKey="buttons_76"
827+
UniqueKey="buttons_77"
768828
HorizontalAlignment="Left">
769-
<materialDesign:ColorZone Mode="PrimaryMid">
770-
<StackPanel
771-
Orientation="Vertical"
772-
Margin="2">
773-
<RadioButton
774-
Style="{StaticResource MaterialDesignTabRadioButtonLeft}"
775-
Margin="4"
776-
IsChecked="True"
777-
Content="FIRST"/>
829+
<StackPanel
830+
Orientation="Horizontal"
831+
Margin="4">
832+
<RadioButton
833+
Style="{StaticResource MaterialDesignTabRadioButtonBottom}"
834+
Margin="4"
835+
IsChecked="True"
836+
Content="FIRST" />
778837

779-
<RadioButton
780-
Style="{StaticResource MaterialDesignTabRadioButtonLeft}"
781-
Margin="4"
782-
IsChecked="False"
783-
Content="SECOND"/>
838+
<RadioButton
839+
Style="{StaticResource MaterialDesignTabRadioButtonBottom}"
840+
Margin="4"
841+
IsChecked="False"
842+
Content="SECOND" />
784843

785-
<RadioButton
786-
Style="{StaticResource MaterialDesignTabRadioButtonLeft}"
787-
Margin="4"
788-
IsChecked="False"
789-
IsEnabled="False"
790-
Content="THIRD"/>
791-
</StackPanel>
792-
</materialDesign:ColorZone>
844+
<RadioButton
845+
Style="{StaticResource MaterialDesignTabRadioButtonBottom}"
846+
Margin="4"
847+
IsChecked="False"
848+
IsEnabled="False"
849+
Content="THIRD" />
850+
</StackPanel>
793851
</smtx:XamlDisplay>
852+
853+
<smtx:XamlDisplay
854+
UniqueKey="buttons_78"
855+
HorizontalAlignment="Left">
856+
<StackPanel
857+
Orientation="Horizontal"
858+
Margin="4">
859+
<RadioButton
860+
Style="{StaticResource MaterialDesignTabRadioButtonTop}"
861+
Margin="4"
862+
IsChecked="True"
863+
Content="FIRST" />
864+
865+
<RadioButton
866+
Style="{StaticResource MaterialDesignTabRadioButtonTop}"
867+
Margin="4"
868+
IsChecked="False"
869+
Content="SECOND" />
870+
871+
<RadioButton
872+
Style="{StaticResource MaterialDesignTabRadioButtonTop}"
873+
Margin="4"
874+
IsChecked="False"
875+
IsEnabled="False"
876+
Content="THIRD" />
877+
</StackPanel>
878+
</smtx:XamlDisplay>
879+
794880
</StackPanel>
795881
</WrapPanel>
796882
</StackPanel>

‎MaterialDesignThemes.Wpf/Themes/MaterialDesignTheme.RadioButton.xaml

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -227,7 +227,7 @@
227227
<Setter Property="Background" Value="Transparent"/>
228228
<Setter Property="BorderBrush" Value="{DynamicResource SecondaryHueMidBrush}"/>
229229
<Setter Property="Padding" Value="16 4 16 4"/>
230-
<Setter Property="Height" Value="32" />
230+
<Setter Property="MinHeight" Value="32" />
231231
<Setter Property="MinWidth" Value="80" />
232232
<Setter Property="wpf:RippleAssist.Feedback" Value="{DynamicResource MaterialDesignFlatButtonRipple}" />
233233
<Setter Property="TextBlock.FontWeight" Value="Medium"/>
@@ -281,6 +281,11 @@
281281
</ControlTemplate>
282282
</Setter.Value>
283283
</Setter>
284+
<Style.Triggers>
285+
<Trigger Property="IsChecked" Value="True">
286+
<Setter Property="Foreground" Value="{Binding BorderBrush, RelativeSource={RelativeSource Mode=Self}}" />
287+
</Trigger>
288+
</Style.Triggers>
284289
</Style>
285290
<Style x:Key="MaterialDesignTabRadioButtonLeft" TargetType="{x:Type RadioButton}" BasedOn="{StaticResource MaterialDesignTabRadioButton}">
286291
<Setter Property="BorderThickness" Value="2 0 0 0" />

0 commit comments

Comments
 (0)