本篇为大家介绍Flyout 控件,Flyout 属于一种轻量级交互控件,可以支持信息提示或用户交互。与传统Dialog 控件不同的是Flyout 控件可通过直接点击对话框外部区域忽略。

Flyout 控件一般常与Button 结合使用,所以Button 控件默认增加了Flyout 属性,当使用Flyout 属性后,点击Button 时就会自动显示Flyout 内容,如下代码所示:

<Button Content="Delete Files">
<Button.Flyout>
<Flyout>
<StackPanel>
<TextBlock FontSize="15" Text="All the files will be deteled, Are you sure?" />
<Button Content="Yes, delete all!"/>
</StackPanel>
</Flyout>
</Button.Flyout>
</Button>

在Flyout 中仍然可以按需要添加各种控件,例如TextBlock、Button等。运行点击“Delete Files”按钮后,Flyout 内容将自动显示,如下图:

对于非Button 控件如何使用Flyout 呢,可以利用FlyoutBase.AttachedFlyout 属性为FrameworkElement 对象添加Flyout 功能,当然需要为该控件增加相应的触发事件来启动Flyout 功能。如下代码:

<TextBox Width="500" HorizontalAlignment="Left" GotFocus="TextBox_GotFocus">
<FlyoutBase.AttachedFlyout>
<Flyout>
<TextBlock Text="You can input 50 words here."/>
</Flyout>
</FlyoutBase.AttachedFlyout>
</TextBox>
private void TextBox_GotFocus(object sender, RoutedEventArgs e)
{
FrameworkElement element = sender as FrameworkElement;
if (element != null)
{
FlyoutBase.ShowAttachedFlyout(element);
}
}

运行效果如下图:

除此之外,也可以将Flyout 定义为StaticResource 供多种控件共享使用。

<Page.Resources>
<Flyout x:Key="FlyoutResources">
<StackPanel>
<TextBlock Text="This is a Flyout."/>
</StackPanel>
</Flyout>
</Page.Resources> <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<StackPanel Margin="50" Orientation="Horizontal" VerticalAlignment="Top">
<Button Content="Click Button" Flyout="{StaticResource FlyoutResources}"/>
<TextBox FlyoutBase.AttachedFlyout="{StaticResource FlyoutResources}" Margin="50,20"
Height="20" Width="150" HorizontalAlignment="Left" GotFocus="TextBox_GotFocus"/>
</StackPanel>
</Grid>

Windows 8.1 新增控件之 Flyout的更多相关文章

  1. Windows 8.1 新增控件之 AppBar

    Windows 8.1 与Windows 8 相比已经有了很多改进,从ITPro 角度这篇文章<What's New in Windows 8.1>已经表述的很详细.对开发者来说,最明显的 ...

  2. Windows 8.1 新增控件之 DatePicker

    大年初一来介绍一个简单易用的DatePicker 控件,这个控件是新增的?印象里很早就有了啊,Anyway来看看Windows 8.1 里的DataPicker 有什么功能吧. 先来看看这个代码,很简 ...

  3. Windows 8.1 新增控件之 Hyperlink

    Hyperlink 控件应该不用过多介绍大家肯定十分清楚其作用,它的功能就像HTML中的<a href="">标签一样,只不过是在XAML中实现. 使用Hyperlin ...

  4. Windows 8.1 新增控件之 MenuFlyout

    开始这篇讲解前,我们先来温习一下Flyout 的内容,当触发应用中某个Button 时会有Flyout 出现提示用户该操作接下来将会发生什么.Flyout 简单来说就是一个轻量级信息提示需要用户确认或 ...

  5. Windows 8.1 新增控件之 TimePicker

    之前已经为大家介绍过DatePicker 控件的相关内容,有日期控件当然就得有时间控件,本篇将和各位一起了解TimePicker 的使用方法. 先来介绍一下ClockIdentifier 属性,默认情 ...

  6. Windows 8.1 新增控件之 CommandBar

    上一篇为大家介绍了AppBar 的相关内容,本篇继续介绍CommandBar 的使用方法.与AppBar 相比而言,CommandBar 在开发使用方面较为单一,在按键布局上分为主控区(Primary ...

  7. 重新想象 Windows 8.1 Store Apps (74) - 新增控件: Flyout, MenuFlyout, SettingsFlyout

    [源码下载] 重新想象 Windows 8.1 Store Apps (74) - 新增控件: Flyout, MenuFlyout, SettingsFlyout 作者:webabcd 介绍重新想象 ...

  8. Windows 8.1 应用再出发 - 几种新增控件(1)

    Windows 8.1 新增的一些控件,分别是:AppBar.CommandBar.DatePicker.TimePicker.Flyout.MenuFlyout.SettingsFlyout.Hub ...

  9. Windows 8.1 应用再出发 - 几种新增控件(2)

    本篇我们接着来介绍Windows 8.1 的新增控件,分别是:Flyout.MenuFlyout.SettingsFlyout.Hub 和 Hyperlink. 1. Flyout Flyout被称为 ...

随机推荐

  1. Swift 初步了解

    Swift 初步了解 前言: 本篇博客会结合OC对Swift进行简单介绍. OC 用NSLog输出日志 NSLog(@"旭宝爱吃鱼"); Swift 用print输出日志 prin ...

  2. tomcat常见错误及解决方案

    一,tomcat启动时错误 1:The JAVA_HOME environment variable is not defined This environment variable is neede ...

  3. 多年前写的DataTable与实体类的转换,已放github

    本文版权归mephisto和博客园共有,欢迎转载,但须保留此段声明,并给出原文链接,谢谢合作. 文章是哥(mephisto)写的,SourceLink 阅读目录 介绍 起因 代码 UnitTest G ...

  4. Servlet/JSP-07 Session应用

    Session应用 一. 避免表单重复提交 1. 表单重复提交的情况 ①在表单提交到一个 Servlet,而 Servlet 又通过请求转发的方式响应了一个 JSP 或者 HTML 页面,此时浏览器地 ...

  5. Using Confluent’s JDBC Connector without installing the entire platform

    转自:https://prefrontaldump.wordpress.com/2016/05/02/using-confluents-jdbc-connector-without-installin ...

  6. uva 6757 Cup of Cowards(中途相遇法,貌似)

    uva 6757 Cup of CowardsCup of Cowards (CoC) is a role playing game that has 5 different characters (M ...

  7. IIS中查看W3P.exe进程对应的应用程序池的方法

    对于IIS6可以运行 iisapp -a来显示应用程序池的性能列表. iisapp.vbs它是一个脚本程序,在安装2003时需要SP1才有 而IIS7可以直接用它的外壳命令 C:"Windo ...

  8. C++浅析——虚表和虚表Hook

    为了探究虚表的今生前世,先来一段测试代码 虚函数类: class CTest { public: int m_nData; virtual void PrintData() { printf(&quo ...

  9. Addthis使用

    一.使用 https://www.addthis.com/.国外的SNS分享站点较多,适用于英文站点内容的分享.有教程. 我的测试代码如下: <html> <meta charset ...

  10. 解决chrome在docky上的图标模糊或不能锁定的问题

    1,终端执行以下命令:sudo nautilus2,打开usr/share/application,找到chrome的图标,右键找到属性,把“命令”里的内容换成/usr/bin/google-chro ...