CODEWITHSUNDEEP
c#wpfxaml
Andronomos
Andronomos

Reputation: 167

Display rectangle in designer when using triggers for width and height

In my program I need to change the width and height of a rectangle based on the value of a property.

Using a datatrigger I cannot specify the initial width and height on the rectangle as this overrides it.

How can I display my rectangle in the designer without overriding the datatrigger?

<Rectangle Fill="{StaticResource Atom_Color_Blue}" Margin="5,0,0,0" Stroke="#181a1f" StrokeThickness="1">
    <Rectangle.InputBindings>
        <MouseBinding Gesture="LeftClick" Command="{Binding CommandSetColor}" CommandParameter="Blue" />
    </Rectangle.InputBindings>
    <Rectangle.Style>
        <Style>
            <Style.Triggers>
                <DataTrigger Binding="{Binding NewTaskColor}" Value="Blue">
                    <Setter Property="Rectangle.Width" Value="18" />
                    <Setter Property="Rectangle.Height" Value="18" />
                </DataTrigger>
                <DataTrigger Binding="{Binding NewTaskColor}" Value="None">
                    <Setter Property="Rectangle.Width" Value="16" />
                    <Setter Property="Rectangle.Height" Value="16" />
                </DataTrigger>
            </Style.Triggers>
        </Style>
    </Rectangle.Style>
</Rectangle>

Upvotes: 0

Views: 94

Answers (1)

Andy
Andy

Reputation: 12276

You should read up on dependency properties. Specifically the precedence. If you set a value directly then that cannot be changed by a datatrigger or binding. If you set it in a style then a datatrigger can change it.

    <Rectangle Fill="Blue" Margin="5,0,0,0" Stroke="#181a1f" StrokeThickness="1">
        <Rectangle.InputBindings>
            <MouseBinding Gesture="LeftClick" Command="{Binding CommandSetColor}" CommandParameter="Blue" />
        </Rectangle.InputBindings>
        <Rectangle.Style>
            <Style>
                <Setter Property="Rectangle.Width" Value="18" />
                <Setter Property="Rectangle.Height" Value="18" />
                <Style.Triggers>
                    <DataTrigger Binding="{Binding NewTaskColor}" Value="Blue">
                        <Setter Property="Rectangle.Width" Value="18" />
                        <Setter Property="Rectangle.Height" Value="18" />
                    </DataTrigger>
                    <DataTrigger Binding="{Binding NewTaskColor}" Value="None">
                        <Setter Property="Rectangle.Width" Value="16" />
                        <Setter Property="Rectangle.Height" Value="16" />
                    </DataTrigger>
                </Style.Triggers>
            </Style>
        </Rectangle.Style>
    </Rectangle>

Note the two setters I added.

        <Style>
            <Setter Property="Rectangle.Width" Value="18" />
            <Setter Property="Rectangle.Height" Value="18" />

Upvotes: 1

Related Questions