Move panel to the top of the screen

How-to Discussions
1

Hi,

i would like to move a panel to the top of the screen when the keyboard is visible but i don’t know how to do it. Not relative to Keyboard or “Size”.

thnx.

2

Hi!

You can try something along the lines of:

<WhileKeyboardVisible>
    <Change myPanel.Alignment="Top" />
</WhileKeyboardVisible>

You can do arbitrary things in the WhileKeyboardVisible-trigger.

3

Hi!

thnx for ur answer but that does not solve my problem as even if u align the panel Top that won’t work if the panel is inside an StackPanel.

I am looking for something similar to:

<Move Y="-1" Duration="1" Easing="CircularOut" RelativeTo="ParentSize"/>

but i would like to say something like: “relative to StatusBar” o “relative to TopOfTheScreen”

4

Hi!

You can Move relative to any node using the RelativeNode property:

<Move Target="yourElement" Y="-1" RelativeTo="Size" RelativeNode="yourBottomBar"/>
5

That’s way closer to what i was looking for :slight_smile:

but i still have a problem… maybe i should change the layout:

<Page>
    <ClientPanel>
        <Panel ux:Name="Header" Dock="Top">
             ...
        </Panel>

        <Panel ux:Name="Login" Dock="Top">
            <Text> .. <TextInput> .. <Button>
        </Panel>
    </ClientPanel>
</Page>

when i move the Login Panel up it dissapears under the header panel is there a “bring to front” atribute? should i change the Header opacity?

6

There is a <BringToFront /> trigger that you can use, at the same time as your Move

7

Thnx!!

just one final question:

if i am not wrong:

<Move Target="yourElement" Y="-1" RelativeTo="Size" RelativeNode="yourBottomBar"/>

means: yourElement.Y = yourElement.Y + (yourBottomBar.Y * -1)

i would like to move it where “yourBottomBar” is:

yourElement.Y = yourBottomBar.Y

is that possible?