WPF: Width=0 for Border object within StackPanel FlowDirection-"RightToLeft.

Question

I have a WPF application in C# on Windows 10. I have a StackPanel with Orientation="Horizontal", HorizontalAlignment="Stretch", and FlowDirection="RightToLeft. The StackPanel Width-1444. Inside the StackPanel I have 3 narrow Canvas objects on the Left. Inside the StasckPanel I also have a Border object with HorizontalAlignment="Stretch". Incorrectly the computed Border Width=0 even though the Border's HorizontalAlignment="Stretch".

Why is the Border Width=0 even though the Width should be the StackPanel - the ActualWidth of the 3 Canvas objects?

How do I get the Bordet Width = the remainder StackPanel not taken up of the Canvas objects?

        <StackPanel Name="CenterArea" Orientation="Horizontal" Margin="5" 
                    FlowDirection="RightToLeft"
                    HorizontalAlignment="Stretch">
            <Canvas Name="Tind" Margin="10" Width="40">
            </Canvas>
            <Canvas Name="Pind" Margin="10" Width="40">
            </Canvas>
            <Canvas Name="Zind" Margin="10" Width="40">
            </Canvas>
            <Border x:Name ="border" 
                VerticalAlignment="Stretch" 
                HorizontalAlignment="Stretch"
                Margin="5,0,5,0">
                <Canvas x:Name="area" Opacity="1" 
                    Height="{Binding ActualHeight, ElementName=border, Mode=OneWay}"   
                    Width="{Binding ActualWidth, ElementName=border, Mode=OneWay}"   >
                   ....
                </Canvas>
            </Border>
        </StackPanel>

Answer 1

The DockPanel with LastChildFill="true" worked.

I did not need to set FlowDirection="RightToLeft". I could DockPanel.Dock = "Dock.Right"

on the elements in the correct order from Right to Left.

The HorizontalAlignment="Stretch" did not work.

Too Bad the Horizontal StackPanel with HorizontalAlignment="Stretch" does not work well.

THANKS.

Answer 2

Hi,@Don Baechtel.Welcome Microsoft Q&A. To make controls fill the rest of the Panel space, you could use DockPanel. Can you use DockPanel? Does your Border make the last control?

StackPanel

Arranges child elements into a single line that can be oriented horizontally or vertically. The default value is stretch for both HorizontalAlignment and VerticalAlignment of content that is contained in a StackPanel.

HorizontalAlignment

When Height and Width properties are explicitly set on an element, these measurements take higher precedent during layout and will cancel the typical effects of setting HorizontalAlignment to Stretch.

• • Unless explicitly specified, Width and Height of child elements are NaN. If you specify an explicit value, StackPanel will honor them over the Horiz and Vert Alignment settings.

You could use DockPanel.

If you set the LastChildFill property to true, which is the default setting, the last child element of a DockPanel always fills the remaining space, regardless of any other dock value that you set on the last child element.

 <DockPanel Name="CenterArea"  Margin="5" 
                    FlowDirection="RightToLeft"
                    HorizontalAlignment="Stretch">
        <Canvas Name="Tind" Margin="10" Width="40" Background="Azure">
        </Canvas>
        <Canvas Name="Pind" Margin="10" Width="40"   Background="Bisque">
        </Canvas>
        <Canvas Name="Zind" Margin="10" Width="40"  Background="BlanchedAlmond">
        </Canvas>
        <Border x:Name ="border" 
                VerticalAlignment="Stretch" 
                HorizontalAlignment="Stretch"
                Margin="5,0,5,0">
            <Canvas  Opacity="1"  Background="AliceBlue" 
                      >
            </Canvas>
        </Border>
    </DockPanel>

The result:

Answer 3

The DockPanel with LastChildFill="true" worked.

I did not need to set FlowDirection="RightToLeft". I could DockPanel.Dock = "Dock.Right"

on the elements in the correct order from Right to Left.

The HorizontalAlignment="Stretch" did not work.

Too Bad the Horizontal StackPanel with HorizontalAlignment="Stretch" does not work well.

THANKS.