StrokeThickness of Line is not working properly when we draw the line at the right end of the Grid WPF

Viewed 282

I am trying to set the StrokeThickness of the line is more than 1. But StrokeThickness is not applied properly in the line which is in the right side of the grid. left side line is working properly. Code snippet

<Grid
        x:Name="BottomRightPanel"
        Width="500"
        HorizontalAlignment="Center"
        VerticalAlignment="Center"
        Background="Yellow">
        <Line
            x:Name="line"
            Stroke="Black"
            StrokeThickness="5"
            X1="0"
            X2="0"
            Y1="0"
            Y2="50" />
        <Line
            x:Name="line1"
            Stroke="Black"
            StrokeThickness="5"
            X1="500"
            X2="500"
            Y1="0"
            Y2="50">
        </Line>
    </Grid>

Screenshot:

Line is cropped

2 Answers

Decrease the X1 and X2 values of the right line to take the stroke thickness into consideration:

<Line
    x:Name="line1"
    Stroke="Black"
    StrokeThickness="5"
    X1="497.5"
    X2="497.5"
    Y1="0"
    Y2="50">

Or use a Border:

<Border Width="500" Background="Yellow"
        BorderBrush="Black" BorderThickness="5 0 5 0"
        HorizontalAlignment="Center"
        VerticalAlignment="Center">
    <Grid>
        <TextBlock />
    </Grid>
</Border>

From my observation, you have provided some thickness for a line like 5, even though it has been drawn correctly due to this added thickness it plot like X position of 505.

Better you can adjust the X postion in below

<Line
            x:Name="line"
            Stroke="Black"
            StrokeThickness="5"
            X1="0"
            X2="0"
            Y1="0"
            Y2="50" />
        <Line
            x:Name="line1"
            Stroke="Black"
           StrokeThickness="5"
            X1="495"
            X2="495"
            Y1="0"
            Y2="50"/>

Or else add like in below

<Canvas>
            <Line
            x:Name="line"
            Stroke="Black"
            StrokeThickness="5"
            X1="0"
            X2="0"
            Y1="0"
            Y2="50" />
            <Line
            x:Name="line1"
            Canvas.Left="500"
            Stroke="Black"
            StrokeThickness="5"
            X1="0"
            X2="0"
            Y1="0"
            Y2="50" />
        </Canvas>
Keep the same line plot values and move that in left most by using Canvas.Left

enter image description here

Related