CheckBox tick mirrored when FlowDirection changes

OS: Microsoft Windows 8.1 Application Development: Microsoft Visual Studio 2013 (WPF Application Development)

I switched from Windows 7 to Windows 8.1, and now my old applications that I developed in VS2012 have a strange manner. because my language is from right to left, I use RightToLeftfor FlowDirection. it worked fine, as all the text was shown on the left side CheckBox, but now the check mark is CheckBoxmirrored as follows:

enter image description here

the check mark is incorrect even in the language from right to left. this is because OS or VS2013, and how can I fix it? do i need to create a template? thank.

+4
source share
3 answers

, , . - , , LeftToRight , .

<CheckBox Content="My Checkbox" FlowDirection="RightToLeft">
    <CheckBox.Resources>
         <Style TargetType="{x:Type Path}">
               <Setter Property="FlowDirection" Value="LeftToRight"/>
         </Style>
    </CheckBox.Resources>
</CheckBox>
+4
<Grid>
    <Grid.Resources>
        <Style x:Key="ArabicStyle" TargetType="{x:Type CheckBox}">
            <Style.Resources>
                <Style TargetType="{x:Type Path}">
                    <Setter Property="FlowDirection" Value="LeftToRight"/>
                </Style>
            </Style.Resources>
        </Style>
    </Grid.Resources>
    <CheckBox Content="My Checkbox:" Style="{StaticResource ArabicStyle}"/>
</Grid>
+3

If you want to use the standard checkbox control, set the FlowDirection of the path to LeftToRight, but if you create your own template, it will not work. Create your own style template for a CheckBox like this, and set the FlowDirection from the main grid to LeftToRight ":

     <Style TargetType="{x:Type CheckBox}">
        <Setter Property="SnapsToDevicePixels" Value="true" />
        <Setter Property="OverridesDefaultStyle" Value="true" />
        <Setter Property="Height" Value="30" />
        <Setter Property="FocusVisualStyle" Value="{DynamicResource MyFocusVisualStyte}" />
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type CheckBox}">
                    <BulletDecorator>
                        <BulletDecorator.Bullet>
                            <!-- ****************** here set FlowDirection to LeftToRight *********************************** -->
                            <Grid      FlowDirection="LeftToRight" Height="{TemplateBinding Height}" Width="{Binding RelativeSource={RelativeSource Self}, Path=Height, UpdateSourceTrigger=PropertyChanged}"
                          MinHeight="30" MinWidth="30" ShowGridLines="False">
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition Width="4*" />
                                    <ColumnDefinition Width="1*" />
                                    <ColumnDefinition Width="1*" />
                                    <ColumnDefinition Width="4*" />
                                    <ColumnDefinition Width="1*" />
                                    <ColumnDefinition Width="1*" />
                                    <ColumnDefinition Width="2*" />
                                    <ColumnDefinition Width="2*" />
                                </Grid.ColumnDefinitions>
                                <Grid.RowDefinitions>
                                    <RowDefinition Height="3*" />
                                    <RowDefinition Height="1*" />
                                    <RowDefinition Height="1*" />
                                    <RowDefinition Height="1*" />
                                    <RowDefinition Height="4*" />
                                    <RowDefinition Height="1*" />
                                    <RowDefinition Height="1*" />
                                    <RowDefinition Height="4*" />
                                </Grid.RowDefinitions>

                                <Border Name="MainBorder"
                                Grid.ColumnSpan="9" Grid.RowSpan="9"
                                CornerRadius="4"
                                BorderThickness="1"
                                Background="Transparent" />

                                <Border Name="InnerBorder"
                                Grid.Column="1" Grid.ColumnSpan="5"
                                Grid.Row="2" Grid.RowSpan="5"
                                BorderThickness="1"
                                BorderBrush="#808080" />

                                <Path Name="InnerPath"

                              Grid.Column="1" Grid.ColumnSpan="5"
                              Grid.Row="2" Grid.RowSpan="5"
                              Data="M31,5 L19.5,5 19.5,19.5 34.5,19.5 34.5,11.75"
                              Stretch="Fill" Stroke="Red"/>

                                <Path Name="CheckMark"
                              Grid.Column="2" Grid.ColumnSpan="5"
                              Grid.Row="1" Grid.RowSpan="5"
                              Opacity="0"
                              Data="M9.07743946676476E-09,4.31805768640244L4.68740335877841,8.86361158398516C4.68740335877841,8.86361158398516,16.3281249985376,-2.42451336648723,16.3281249985376,-2.42451336648723L14.0622100581796,-4.77304938341948 4.68740335877846,4.31805791992662 2.22656251699567,1.93164208562579z"
                              Fill="#3babe3"
                              Stretch="Fill"
                              Stroke="#3babe3" />

                                <Path Name="InderminateMark"
                              Grid.Column="3"
                              Grid.Row="4"
                              Data="M0,4 L1,5 5,1 4,0"
                              Opacity="0"
                              Stretch="Fill"
                              StrokeThickness="0"
                              Fill="#808080" />
                            </Grid>
                        </BulletDecorator.Bullet>
                        <VisualStateManager.VisualStateGroups>
                            <VisualStateGroup x:Name="CheckStates">
                                <VisualState x:Name="Checked">
                                    <Storyboard>
                                        <DoubleAnimation Storyboard.TargetProperty="Opacity"
                                         Storyboard.TargetName="CheckMark" Duration="0:0:0.2" To="1" />
                                    </Storyboard>
                                </VisualState>
                                <VisualState x:Name="Unchecked" >
                                    <Storyboard>
                                        <DoubleAnimation Storyboard.TargetProperty="Opacity"
                                         Storyboard.TargetName="CheckMark" Duration="0:0:0.2" To="0" />
                                    </Storyboard>
                                </VisualState>
                                <VisualState x:Name="Indeterminate">
                                    <Storyboard>
                                        <DoubleAnimation Storyboard.TargetProperty="Opacity"
                                         Storyboard.TargetName="InderminateMark" Duration="0:0:0.2" To="1" />
                                    </Storyboard>
                                </VisualState>
                            </VisualStateGroup>
                        </VisualStateManager.VisualStateGroups>
                        <ContentPresenter Margin="4,0,4,0"
                    VerticalAlignment="Center"
                    HorizontalAlignment="Left"
                    RecognizesAccessKey="True" />
                    </BulletDecorator>

                    <ControlTemplate.Triggers>
                        <Trigger Property="IsChecked" Value="True">
                            <Setter TargetName="InnerBorder" Property="Visibility" Value="Collapsed" />
                        </Trigger>
                        <Trigger Property="IsPressed" Value="True">
                            <Setter TargetName="MainBorder" Property="Background" Value="#81d2eb" />
                        </Trigger>
                        <Trigger Property="IsEnabled" Value="False">
                            <Setter TargetName="CheckMark" Property="Fill" Value="#cccccc" />
                            <Setter TargetName="CheckMark" Property="Stroke" Value="#cccccc" />
                            <Setter TargetName="InnerPath" Property="Stroke" Value="#cccccc" />
                            <Setter TargetName="InderminateMark" Property="Fill" Value="#cccccc" />
                            <Setter TargetName="InnerBorder" Property="BorderBrush" Value="#cccccc" />
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

    <Style x:Key="MyFocusVisualStyte" >
        <Setter Property="Control.Template">
            <Setter.Value>
                <ControlTemplate>
                    <Rectangle x:Name="FocusStyle" StrokeDashArray="4 4" RadiusX="5" RadiusY="5" Fill="Transparent"
                       Stroke="#81d2eb" StrokeThickness="1" />
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
0
source

Source: https://habr.com/ru/post/1544556/


All Articles