Using percentages in a StackPanel (original title: 2 minor bugs)

How-to Discussions
1

I am currently on the latest version of fuse!

So the first one has to do with textinput

<Rectangle ux:Class="BoxProperties" CornerRadius="25" Width="70%" Height="10%">
        <Stroke Color="#b280b2" />
    </Rectangle>


        <BoxProperties>
            <Circle Height="43%" Width="43%" Alignment="CenterLeft" X="-7%" Y="-.85%">

                <Stroke Color="Black" />
            </Circle>
        <TextInput Alignment="Center" TextColor="#800033" PlaceholderText="Desire Password" Value="{password}" PlaceholderColor="#800033" TextAlignment="Center" IsPassword="true"/>
        </BoxProperties>

for some reason when i have isPassword = true, the placeholdertext appears as a password ******

and then the next has to do with Each

currently in Each you can have a simple case like so

<StackPanel>
    <Each Count="3">
        <Circle Height="20" Width="20" Color="Red" />
    </Each>
</StackPanel>

But when you try to do this in percetanges it does not work

<StackPanel>
    <Each Count="3">
        <Circle Height="20%" Width="20%" Color="Red" />
    </Each>
</StackPanel>

if this could be fixed or implemented that would be fantastic, because it really helps with different platform sizes!

2

Ahh the first error was on my part, I had a valued stored in the wrong area; but the each bug/feature still applies to the thread!

3

Hi!

The problem here is that you are using a StackPanel. A vertical StackPanel (like in this case) has no inherit Height and will size its children to their shortest valid height. So since % is measure in relation to the available space an element is given by its parent, in this case that will be 0. To get the desired effect, use a Grid instead:

<Grid RowCount="3">
    <Each Count="3">
        <Circle Color="Red" />
    </Each>
</Grid>

You can then put height on the Grid instead.