<Button ><Button.Flyout><Flyout><!--浮出的UI内容--></Flyout></Button.Flyout></Button>

<TextBlock Text=" Tapped事件触发Flyout" Tapped="TextBlock_Tapped"><FlyoutBase.AttachedFlyout><Flyout><!--浮出的UI内容--></Flyout></FlyoutBase.AttachedFlyout></TextBlock>

private void TextBlock_Tapped(object sender, TappedRoutedEventArgs e){FrameworkElement element = sender as FrameworkElement;if (element != null){FlyoutBase.ShowAttachedFlyout(element);}}

MainPage.xaml文件主要代码
------------------------------------------------------------------------------------------------------------------<StackPanel><!--最基本的Flyout 控件，自定义其浮出的内容--><Button Content="Show Flyout"><Button.Flyout><Flyout><StackPanel ><TextBox PlaceholderText="请输入名字"/><Button HorizontalAlignment="Right" Content="确定"/></StackPanel></Flyout></Button.Flyout></Button><!--浮出上下文菜单，点击菜单后改变当前按钮上的文本内容--><Button x:Name="menuFlyoutButton" Content="Show MenuFlyout" ><Button.Flyout ><MenuFlyout><MenuFlyoutItem Text="Option 1" Click="MenuFlyoutItem_Click"/><MenuFlyoutItem Text="Option 2" Click="MenuFlyoutItem_Click"/><MenuFlyoutItem Text="Option 3" Click="MenuFlyoutItem_Click"/></MenuFlyout></Button.Flyout></Button><!--浮出选择日期弹窗，点击确定后会触发DatePicked事件，然后可以获取选中的日期--><Button Content="Show DatePicker" ><Button.Flyout><Controls:DatePickerFlyout Title="选择日期："  DatePicked="DatePickerFlyout_DatePicked"/></Button.Flyout></Button><!--浮出选择时间弹窗，点击确定后会触发TimePicked事件，然后可以获取选中的时间---><Button Content="Show TimePicker" ><Button.Flyout><Controls:TimePickerFlyout Title="选择时间："  TimePicked="TimePickerFlyout_TimePicked"/></Button.Flyout></Button><!--浮出选择弹窗，显示底下的确认取消菜单栏并且处理其确认事件Confirmed---><Button Content="Show Picker" ><Button.Flyout><Controls:PickerFlyout   Confirmed="PickerFlyout_Confirmed" ConfirmationButtonsVisible="True"><TextBlock Text="你确定吗？？？？？" FontSize="30" Margin="0 100 0 0"/></Controls:PickerFlyout></Button.Flyout></Button><!--浮出选择列表弹窗，绑定集合的数据，处理选中的事件ItemsPicked--><Button Content="Show ListPicker"><Button.Flyout><Controls:ListPickerFlyout x:Name="listPickerFlyout" Title="选择手机品牌：" ItemsPicked="listPickerFlyout_ItemsPicked"  ><Controls:ListPickerFlyout.ItemTemplate><DataTemplate><TextBlock Text="{Binding}" FontSize="30"></TextBlock></DataTemplate></Controls:ListPickerFlyout.ItemTemplate></Controls:ListPickerFlyout></Button.Flyout></Button><!--使用附加属性FlyoutBase.AttachedFlyout来实现Flyout控件--><TextBlock Text="请点击我！" Tapped="TextBlock_Tapped" FontSize="20"><FlyoutBase.AttachedFlyout><Flyout><TextBox Text="你好！"/></Flyout></FlyoutBase.AttachedFlyout></TextBlock></StackPanel>

MainPage.xaml.cs文件主要代码
------------------------------------------------------------------------------------------------------------------public MainPage(){this.InitializeComponent();// 绑定ListPickerFlyout的数据源listPickerFlyout.ItemsSource = new List<string> { "诺基亚", "三星", "HTC", "苹果", "华为" };}// PickerFlyout的确认事件，在事件处理程序里面可以处理相关的确认逻辑private async void PickerFlyout_Confirmed(PickerFlyout sender, PickerConfirmedEventArgs args){await new MessageDialog("你点击了确定").ShowAsync();}// TimePickerFlyout的时间选中事件，在事件处理程序里面可以获取选中的时间private async void TimePickerFlyout_TimePicked(TimePickerFlyout sender, TimePickedEventArgs args){await new MessageDialog(args.NewTime.ToString()).ShowAsync();}// DatePickerFlyout的日期选中事件，在事件处理程序里面可以获取选中的日期private async void DatePickerFlyout_DatePicked(DatePickerFlyout sender, DatePickedEventArgs args){await new MessageDialog(args.NewDate.ToString()).ShowAsync();}// MenuFlyout的菜单选项的点击事件，点击后直接获取菜单栏的文本显示到按钮上private void MenuFlyoutItem_Click(object sender, RoutedEventArgs e){menuFlyoutButton.Content = (sender as MenuFlyoutItem).Text;}// 通过FlyoutBase.ShowAttachedFlyout方法来展示出Flyout控件private void TextBlock_Tapped(object sender, TappedRoutedEventArgs e){FrameworkElement element = sender as FrameworkElement;if (element != null){FlyoutBase.ShowAttachedFlyout(element);}}// ListPickerFlyout的选中事件，点击列表的某一项便会触发，在事件处理程序中通常会获取选中的项目来进行相关逻辑的处理private async void listPickerFlyout_ItemsPicked(ListPickerFlyout sender, ItemsPickedEventArgs args){if (sender.SelectedItem != null){await new MessageDialog("你选择的是：" + sender.SelectedItem.ToString()).ShowAsync();}}