ItemSpacing in StackPanel inside a DockPanel misbehaving

Check the following test; clicking the button will slide it up, although it shouldn’t move. Also, while the ItemSpacing is positive, the text overlaps the bounds of the stackpanel. If we only leave the stackpanel without the dock, it acts ok. Tried also specifying a Dock attribute for the stackpanel, but it doesn’t help.

<App Theme="Basic">

    <JavaScript>
    var Observable = require('FuseJS/Observable');

    var label = Observable('text 1');

    function clicked()
    {
        label.value = 'text 2';
    }

    module.exports = {
        label: label,
        clicked: clicked
    };
    </JavaScript>

    <StackPanel Orientation="Vertical" Width="75%" Alignment="Center" ItemSpacing="16">
        <Panel Background="#fc0">
            <Text Value="{label}" />
        </Panel>
        <Button Text="click me" Clicked="{clicked}" Alignment="Center" />
    </StackPanel>

</App>

Just changed the content, because the wrapping DockPanel wasn’t making a difference. Just the StackPanel is enough. Haven’t tested it on a device yet, so it may be a preview only issue.

Hi!

Looks likes a bug to me! Thanks for reporting, I have filed a ticket for this issue :slight_smile: