Can't tell the third state from unchecked on CheckBox

[ekdahl]

Describe the bug
There is no difference between the third state and unchecked on checkboxes, for both themes.

To Reproduce
Steps to reproduce the behavior:

1. Add CheckBox
2. Set IsThreeState="True"
3. Test the three states
4. Unchecked and third state looks the same

Expected behavior
Visual indication of the third state.

Screenshots

Desktop (please complete the following information):

• OS: Windows 10
• .NET: net6.0-windows
• Version: 1.2.7

[Inzaniity]

Would it be possible to expose the ControlIcon as a property so we could change it with StyleTriggers? This wouldn't be a clean solution but we could have all 3 states look different.

For example CheckMark48 when IsChecked = True Dismiss46 when IsChecked = False

This would leave us with at least some sort of distinction between all 3 states.

Apart from that, setting the ControlIcon would generally be a neat feature. (Tried to extract the template and modify it for my needs but I didn't manage to get it working)

[Inzaniity]

@ekdahl I managed to get it working in a fashion that is not ideal but gets the job done in the meantime. I'm setting a custom content with SymbolIcon and set the margin so it is overlaying the checkbox. Then I'm using DataTriggers to check the state which can be True, False or Null. Since there is already a CheckMark on True I just hide the SymbolIcon for this state. I think <Setter Property="Symbol" Value="Empty" /> would also work.

xaml

<Style
            x:Key="SymbolStyle"
            BasedOn="{StaticResource {x:Type wpfui:SymbolIcon}}"
            TargetType="wpfui:SymbolIcon">
	<Style.Triggers>
		<DataTrigger Binding="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type CheckBox}}, Path=IsChecked}" Value="{x:Null}">
			<Setter Property="Visibility" Value="Visible" />
			<Setter Property="Symbol" Value="Subtract48" />
		</DataTrigger>
		<DataTrigger Binding="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type CheckBox}}, Path=IsChecked}" Value="True">
			<Setter Property="Visibility" Value="Hidden" />
		</DataTrigger>
		<DataTrigger Binding="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type CheckBox}}, Path=IsChecked}" Value="False">
			<Setter Property="Symbol" Value="Dismiss48" />
			<Setter Property="Visibility" Value="Visible" />
		</DataTrigger>
	</Style.Triggers>
</Style>

<CheckBox
Checked="FilterCheckChanged"
Focusable="False"
IsThreeState="True">
	<CheckBox.Content>
		<wpfui:SymbolIcon Margin="-38,0,0,0" Style="{StaticResource SymbolStyle}" />
	</CheckBox.Content>
</CheckBox>

[pomianowski]

Oh..., I didn't know IsChecked is null when in ThreeState. This solves problems with VisualState and themes.

[niels9001]

This has been resolved in the latest previews