Popup Control in UWP

Hello, welcome to Universal Windows programming tutorial

This tutorial I am going to explain about how to use a pop-up control

If you go to UWP LinkedIn app, if you click the work item, one small window it will come

So this is a pop-up control. This area is a pop-up control

pop-up control how to use this control in our application so I'm going to

show you really created one sample project this project I am going to call

the pop-up control first I just add on relative panel that one adding one

button the button click I'm going to call the pop-up window next I'm adding the pop-up control

so pop up I give a name for this control my pop-up and width of the controller say

for example I make 200 width and height right now I give on 300 and dismiss mode

it's like this piece mode is true so that if I click anywhere in the application pop-up should

automatically hidden then this pop-up contain one stack panel just for example make the difference I

make some color here then adding one text block here my pop-up window and font

size just make difference 25 so going back to view model page here button click

I am just make is opening call to true so we have to set the default is a false here default is true you have to set is here is a false so that you don open once button click only application pop control will open

yeah started click the button here you can see it's just overlapping anyway that pop-up is coming

if I click any outside anywhere so it's go it's the pop-up condition it's hidden okay so I need

this go to the right side first I need this control go to the right side so I'm

doing here I just make relative relative panel align with the right with panel so

let's go to the right side okay so next on the height is its minimum so I need

the height look like same my window height so for that what we what we need

to before invoking we need to assign the height also pop up height equal to

So still it not coming But it good to the right right side okay check that tight issue I it is this pop control it is right but the stack panel is

eight less that's the reason it will see only the small amount of area so what

I'm going to do here this site also I make just just make name of my stack

deploy her starter. So click it. Now here you can see the pop up, it's fit our complete window

But you can notice here it's look like binded with our window only if going back to LinkedIn

here you can see it's like on it's coming on top of the window the pop-up

is coming on top of the window but in our application is coming within the

same window how to do that how to on top of window that how we can do it that you

Effect Again click here you can see a little bit it like on top but it not completely it

look like not completely but it's working like on top so how to do that so for that

what we have to do we have to add the animation effect so I'm just adding the animation effect pop

up child child transition and transition collection transition collection pan team transition edge so

these are the animation for example if my my pop-up should come from bottom so

we give the so many is there like for example bottom left to right bottom left

to right top whatever it is for a figure right then right pop-up I am a

started with the right side. Restore completed. Deploy started. So it's coming from the right

say and that pop up is coming on top of the window now it's clearly visible or pop up is coming on top of window

so i hope you can understand how to use a pop-up control in universal windows programming application

thanks to all