Text on the left side of checkbox in WPF?

What is the easiest way to put checkbox content (text) on the left side of the checkbox itself?


Solution 1:

A solution that maximizes "easiness" and "correctness" is to make a RightToLeft checkbox with LeftToRight content:

<CheckBox FlowDirection="RightToLeft">
    <TextBlock FlowDirection="LeftToRight" Text="CheckBox Content:" />
</CheckBox>

Or if you'd like a style:

<Style TargetType="CheckBox">
    <Setter Property="FlowDirection" Value="RightToLeft" />
    <Setter Property="ContentTemplate">
        <Setter.Value>
            <DataTemplate>
                <ContentControl FlowDirection="LeftToRight" Content="{Binding}" />
            </DataTemplate>
        </Setter.Value>
    </Setter>
</Style>

Solution 2:

In code:

System.Windows.Controls.CheckBox checkBox = new System.Windows.Controls.CheckBox();
checkBox.Content = ":CheckBox Enabled";
checkBox.FlowDirection = System.Windows.FlowDirection.RightToLeft;

In XAML:

<CheckBox FlowDirection="RightToLeft" Content=":CheckBox Enabled" />

EDIT

User punker76 helped me notice that colon ":" has to be places infront of the text to be displayed correctly, at the end ("CheckBox Enabled:"), probably caused by an affect flow direction has on text element. Nice catch.

Solution 3:

I spent two hours for it, but i found the best decision

<Style x:Key="TextAlignLeft" TargetType="CheckBox">
    <Style.Resources>
        <Style TargetType="Path">
            <Setter Property="FlowDirection" Value="LeftToRight" />
        </Style>
        <Style TargetType="TextBlock">
            <Setter Property="FlowDirection" Value="LeftToRight" />
        </Style>
    </Style.Resources>

    <Setter Property="FlowDirection" Value="RightToLeft" />
</Style>

Solution 4:

I know it's been a while and I'm late. But after going through several complicated answers and searching a lot on the internet I finally found the simplest way to achieve this without distorting the tick from here.

<CheckBox Content="Checked" FlowDirection="RightToLeft">
    <CheckBox.Resources>
        <Style TargetType="{x:Type Path}">
            <Setter Property="FlowDirection" Value="LeftToRight" />
        </Style>
    </CheckBox.Resources>
</CheckBox>

Result:

enter image description here