ポップアップ
このサンプルは次のXAMLを使用しています。
<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<Button x:Name="btnBack" Content="戻る" HorizontalAlignment="Left" Height="55" Margin="97,63,0,0" VerticalAlignment="Top" Width="162" FontSize="20" Background="#FFFF9A9A" Click="btnBack_Click" FontFamily="Global User Interface"/>
<Button x:Name="btn1" FontSize="20" Content="ポップアップを表示" Margin="97,196,0,526" Width="200" Height="50" FontFamily="Global User Interface">
<Button.Flyout>
<Flyout Opened="pop_Open"
Closed="pop_Close">
<StackPanel>
<TextBlock FontSize="24">
<Run Text="こんにちは"/>
</TextBlock>
</StackPanel>
</Flyout>
</Button.Flyout>
</Button>
</Grid>
ボタンコントロールの配下に
Flyoutを使ってOpenedとClosedメソッドを実装しています。
プロパティにメソッドを指定する場所があります。
また、ポップアップとして表示する内容として
TextBlockコントロールを使用しています。
このサンプルでは「こんにちは」という文字列を表示させるため
図のように設定しています。
このように実装することでクリックしたタイミングで
ポップアップが表示され、再度クリックすると
ポップアップは非表示になります。
このサンプルではイベントの内部処理に
何もしていません。
ヘッダファイルです。
実行した結果です。
左側が初期状態もしくはポップアップを非表示にした場合です。
右側がポップアップを表示した状態となります。
|
|