示例
1、ToolTip 的示例
Controls/FlyoutControl/ToolTipDemo.xaml

<Page
x:Class="Windows10.Controls.FlyoutControl.ToolTipDemo"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:Windows10.Controls.FlyoutControl"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"> <Grid Background="Transparent">
<StackPanel Margin="10 0 10 10"> <!--
ToolTip - 提示框控件
Content - 提示内容
Placement - 提示框的显示位置(Bottom, Right, Mouse, Left, Top)
HorizontalOffset - 水平偏移量
VerticalOffset - 垂直偏移量
IsOpen - 提示框是否是显示状态(如果要设置此属性的话,需要等到宿主加载完之后再设置)
Closed - 提示框关闭后触发的事件
Opened - 提示框打开后触发的事件
--> <TextBlock Name="textBlock1" Text="TextBlock" Margin="5"
ToolTipService.ToolTip="ToolTip 的内容"
ToolTipService.Placement="Right" /> <TextBlock Name="textBlock2" Text="TextBlock" Margin="5">
<ToolTipService.ToolTip>
<ToolTip Content="ToolTip 的内容" Placement="Mouse"
HorizontalOffset="120" VerticalOffset="0"
Opened="toolTip_Opened" Closed="toolTip_Closed" />
</ToolTipService.ToolTip>
</TextBlock>
<TextBlock Name="lblMsg" Margin="5" /> </StackPanel>
</Grid>
</Page>

Controls/FlyoutControl/ToolTipDemo.xaml.cs

/*
* ToolTip - 提示框控件(继承自 ContentControl, 请参见 /Controls/BaseControl/ContentControlDemo/)
*/ using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls; namespace Windows10.Controls.FlyoutControl
{
public sealed partial class ToolTipDemo : Page
{
public ToolTipDemo()
{
this.InitializeComponent();
} private void toolTip_Opened(object sender, RoutedEventArgs e)
{
lblMsg.Text = "textBlock2 toolTip_Opened";
} private void toolTip_Closed(object sender, RoutedEventArgs e)
{
lblMsg.Text = "textBlock2 toolTip_Closed";
}
}
}

2、Popup 的示例
Controls/FlyoutControl/PopupDemo.xaml

<Page
x:Class="Windows10.Controls.FlyoutControl.PopupDemo"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:Windows10.Controls.FlyoutControl"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"> <Grid Background="Transparent">
<StackPanel Margin="10 0 10 10"> <!--
Popup - 弹出框控件
Child - 弹出框的内容([ContentProperty(Name = "Child")]),一个 UIElement 类型的对象
ChildTransitions - 显示弹出框时,其内容的过渡效果
IsLightDismissEnabled - 点击非 Popup 区域时否关闭 Popup
HorizontalOffset - 水平方向上的偏移量
VerticalOffset - 垂直方向上的偏移量
-->
<Popup Name="popup" Margin="5"
HorizontalOffset="200" VerticalOffset="10" IsLightDismissEnabled="{Binding IsChecked, ElementName=chkIsLightDismissEnabled}">
<Border BorderBrush="Red" BorderThickness="1" Background="Orange" Width="200" Height="200">
<StackPanel HorizontalAlignment="Center" VerticalAlignment="Center">
<TextBlock Text="我是 Popup" HorizontalAlignment="Center" />
<Button Name="btnClosePopup" Content="关闭" HorizontalAlignment="Center" Click="btnClosePopup_Click" />
</StackPanel>
</Border>
<!--为弹出框增加 PopupThemeTransition 效果-->
<Popup.ChildTransitions>
<TransitionCollection>
<PopupThemeTransition />
</TransitionCollection>
</Popup.ChildTransitions>
</Popup>
<TextBlock Name="lblMsg" Margin="5" /> <!--
显示 xaml 方式定义的 popup
-->
<StackPanel Orientation="Horizontal" Margin="5">
<Button Name="btnOpenPopup" Content="弹出 Popup" Click="btnOpenPopup_Click" />
<CheckBox Name="chkIsLightDismissEnabled" IsChecked="False" Content="IsLightDismissEnabled" Margin="10 0 0 0" />
</StackPanel> <!--
显示 code-behind 方式定义的 popup
-->
<Button Name="btnOpenPopupToast" Content="弹出仿 toast 的 Popup" Click="btnOpenPopupToast_Click" Margin="5" /> </StackPanel>
</Grid>
</Page>

Controls/FlyoutControl/PopupDemo.xaml.cs

/*
* Popup - 弹出框控件(继承自 FrameworkElement, 请参见 /Controls/BaseControl/FrameworkElementDemo.xaml)
* IsOpen - 弹出框是否是打开的状态(如果要设置此属性,需要在控件加载之后)
* Opened - 弹出框打开后触发的事件
* Closed - 弹出框关闭后触发的事件
*/ using Windows.UI;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;
using Windows.UI.Xaml.Controls.Primitives;
using Windows.UI.Xaml.Media;
using Windows.UI.Xaml.Media.Animation; namespace Windows10.Controls.FlyoutControl
{
public sealed partial class PopupDemo : Page
{
// 仿 toast 的 Popup
private Popup _popupToast = new Popup(); public PopupDemo()
{
this.InitializeComponent(); popup.Opened += delegate { lblMsg.Text = "popup.Opened"; };
popup.Closed += delegate { lblMsg.Text = "popup.Closed"; };
} private void btnOpenPopup_Click(object sender, RoutedEventArgs e)
{
if (!popup.IsOpen)
popup.IsOpen = true;
} private void btnClosePopup_Click(object sender, RoutedEventArgs e)
{
if (popup.IsOpen)
popup.IsOpen = false;
} private void btnOpenPopupToast_Click(object sender, RoutedEventArgs e)
{
if (!_popupToast.IsOpen)
{
// 设置 Popup 中的内容
Border border = new Border();
border.BorderBrush = new SolidColorBrush(Colors.Red);
border.BorderThickness = new Thickness(1);
border.Background = new SolidColorBrush(Colors.Blue);
border.Width = 600;
border.Height = 100;
border.Child = new TextBlock() { Text = "我是 Popup", HorizontalAlignment = HorizontalAlignment.Center, VerticalAlignment = VerticalAlignment.Center }; // 设置 Popup 的相关属性
_popupToast.IsLightDismissEnabled = true;
_popupToast.Child = border;
_popupToast.VerticalOffset = 100d; // 设置 Popup 的显示位置(Popup 的默认显示位置在窗口 0,0 点)
_popupToast.ChildTransitions = new TransitionCollection() { new PaneThemeTransition() { Edge = EdgeTransitionLocation.Left } }; _popupToast.IsOpen = true;
}
}
}
}

3、PopupMenu 的示例
Controls/FlyoutControl/PopupMenuDemo.xaml

<Page
x:Class="Windows10.Controls.FlyoutControl.PopupMenuDemo"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:Windows10.Controls.FlyoutControl"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"> <Grid Background="Transparent">
<StackPanel Margin="10 0 10 10"> <TextBlock Name="lblMsg" Margin="5" /> <TextBlock Name="lblDemo" Margin="5">
鼠标右键我或触摸 press-and-hold 我,以弹出 PopupMenu
</TextBlock> </StackPanel>
</Grid>
</Page>

Controls/FlyoutControl/PopupMenuDemo.xaml.cs

/*
* PopupMenu - 上下文菜单(未继承任何类)
* Commands - 上下文菜单中的命令集合,返回 IList<IUICommand> 类型的数据
* IAsyncOperation<IUICommand> ShowAsync(Point invocationPoint) - 在指定的位置(PopupMenu 的默认显示位置在窗口 0,0 点)上显示上下文菜单,并返回用户激发的命令
* IAsyncOperation<IUICommand> ShowForSelectionAsync(Rect selection, Placement preferredPlacement) - 在指定的矩形区域的指定方位显示上下文菜单,并返回用户激发的命令
*
* IUICommand - 命令
* Label - 显示的文字
* Id - 参数
*
* UICommandSeparator - 分隔符
*/ using System;
using Windows.UI.Popups;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;
using Windows.UI.Xaml.Input;
using Windows10.Common; namespace Windows10.Controls.FlyoutControl
{
public sealed partial class PopupMenuDemo : Page
{
public PopupMenuDemo()
{
this.InitializeComponent(); lblDemo.RightTapped += lblDemo_RightTapped;//右键单击
        this.Tapped += PopupMenuDemo_Tapped;//左键点击
}

      private async void PopupMenuDemo_Tapped(object sender, TappedRoutedEventArgs e)
          {
            var msgDialog = new  MessageDialog("我是一个提示内容") { Title = "提示标题" };
            msgDialog.Commands.Add(new UICommand("确定", uiCommand => { tb.Text = $"您点击了:{uiCommand.Label}"; }));
            msgDialog.Commands.Add(new UICommand("取消", uiCommand => { tb.Text = $"您点击了:{uiCommand.Label}"; }));
            await msgDialog.ShowAsync();

}

        private async void lblDemo_RightTapped(object sender, RightTappedRoutedEventArgs e)
{
PopupMenu menu = new PopupMenu(); menu.Commands.Add
(
new UICommand
(
"item1",
(command) =>
{
lblMsg.Text = string.Format("command label:{0}, id:{1}", command.Label, command.Id);
},
"param1"
)
); menu.Commands.Add
(
new UICommand
(
"item2",
(command) =>
{
lblMsg.Text = string.Format("command label:{0}, id:{1}", command.Label, command.Id);
},
"param2"
)
); // 分隔符
menu.Commands.Add(new UICommandSeparator()); menu.Commands.Add
(
new UICommand
(
"item3",
(command) =>
{
lblMsg.Text = string.Format("command label:{0}, id:{1}", command.Label, command.Id);
},
"param3"
)
); // 在指定的位置显示上下文菜单,并返回用户激发的命令(测试的时候这里有时会发生异常,不知道什么原因,所以还是尽量用 MenuFlyout 吧)
IUICommand chosenCommand = await menu.ShowForSelectionAsync(Helper.GetElementRect((FrameworkElement)sender), Placement.Below);
if (chosenCommand == null) // 用户没有在上下文菜单中激发任何命令
{
lblMsg.Text = "用户没有选择任何命令";
}
else
{
lblMsg.Text += Environment.NewLine;
lblMsg.Text += string.Format("result label:{0}, id:{1}", chosenCommand.Label, chosenCommand.Id);
}
}
}
}

控件(弹出类): ToolTip, Popup, PopupMenu的更多相关文章

  1. 根据条件决定My97DatePicker日期控件弹出的日期格式

    代码如下: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <tit ...

  2. my97日期控件弹出位置显示异常

    使用my97日期选择控件的时候,如果整个页面是有滚动条的,根据触发显示日期的控件的父控件的position不同会显示不同的情况 1.position不为fixed则滑动滚动条,显示的日期层不会出现异常 ...

  3. 背水一战 Windows 10 (36) - 控件(弹出类): ToolTip, Popup, PopupMenu

    [源码下载] 背水一战 Windows 10 (36) - 控件(弹出类): ToolTip, Popup, PopupMenu 作者:webabcd 介绍背水一战 Windows 10 之 控件(弹 ...

  4. 背水一战 Windows 10 (37) - 控件(弹出类): MessageDialog, ContentDialog

    [源码下载] 背水一战 Windows 10 (37) - 控件(弹出类): MessageDialog, ContentDialog 作者:webabcd 介绍背水一战 Windows 10 之 控 ...

  5. 背水一战 Windows 10 (35) - 控件(弹出类): FlyoutBase, Flyout, MenuFlyout

    [源码下载] 背水一战 Windows 10 (35) - 控件(弹出类): FlyoutBase, Flyout, MenuFlyout 作者:webabcd 介绍背水一战 Windows 10 之 ...

  6. 背水一战 Windows 10 (32) - 控件(选择类): Selector, ComboBox

    [源码下载] 背水一战 Windows 10 (32) - 控件(选择类): Selector, ComboBox 作者:webabcd 介绍背水一战 Windows 10 之 控件(选择类) Sel ...

  7. 背水一战 Windows 10 (31) - 控件(按钮类): ButtonBase, Button, HyperlinkButton, RepeatButton, ToggleButton, AppBarButton, AppBarToggleButton

    [源码下载] 背水一战 Windows 10 (31) - 控件(按钮类): ButtonBase, Button, HyperlinkButton, RepeatButton, ToggleButt ...

  8. 控件(按钮类): ButtonBase, Button, HyperlinkButton, RepeatButton, ToggleButton, AppBarButton, AppBarToggleButton

    介绍背水一战 Windows 10 之 控件(按钮类) ButtonBase Button HyperlinkButton RepeatButton ToggleButton AppBarButton ...

  9. 【WPF】监听WPF的WebBrowser控件弹出新窗口的事件

    原文:[WPF]监听WPF的WebBrowser控件弹出新窗口的事件 WPF中自带一个WebBrowser控件,当我们使用它打开一个网页,例如百度,然后点击它其中的链接时,如果这个链接是会弹出一个新窗 ...

  10. 背水一战 Windows 10 (62) - 控件(媒体类): InkCanvas 保存和加载, 手写识别

    [源码下载] 背水一战 Windows 10 (62) - 控件(媒体类): InkCanvas 保存和加载, 手写识别 作者:webabcd 介绍背水一战 Windows 10 之 控件(媒体类) ...

随机推荐

  1. GNU make简要介绍①指定变量、自动推导规则、清除工作目录过程文件

    Makefile简介 在执行make之前需要一个命名为Makefile的特殊文件来告诉make需要做些什么. 当使用 make 工具进行编译时,工程中以下几种文件在执行 make 时将会被编译 (重新 ...

  2. Windows系统Stunnel客户端的配置

    Stunnel官方就有Windows版本,到下面的地址下载: https://www.stunnel.org/downloads.html 选择”stunnel-X.XX-installer.exe“ ...

  3. window对象的inner/outer/page/screen详解

    innerHeight : 返回窗口的文档显示区的高度,包含工具条与滚动条.说明:ie8以下不支持 outerHeight : 返回窗口的外部高度,包含工具条与滚动条.说明:ie8以下不支持 page ...

  4. ie 7/8不支持trim的属性的解决方案

    if(!('trim' in String.prototype)){ String.prototype.trim = function(){ return this.replace(/^[\s\uFE ...

  5. 启动Eclipse后卡在 android sdk content loader 的解决办法

    Make sure that eclipse is not active. If it is active kill eclipse from the processes tab of the tas ...

  6. smarty foreach循环

    1,smarty foreach1,单纯的数组array(1000,2000,3000),使用foreach(from = $array item=foo){$foo}2,键值对数组<ul> ...

  7. P3369 【模板】普通平衡树(Treap/SBT)

    题目描述 您需要写一种数据结构(可参考题目标题),来维护一些数,其中需要提供以下操作: 插入x数 删除x数(若有多个相同的数,因只删除一个) 查询x数的排名(若有多个相同的数,因输出最小的排名) 查询 ...

  8. [Azure] 使用 Visual Studio 2013 管理中国版 Azure 订阅

    比较关心微软平台技术的朋友应该都知道,微软云服务(Microsoft Azure)以下简称Azure分为全球版和中国版,由于政府法规问题中国版的服务是由二十一世纪互联运营,整体来看中国版Azure和全 ...

  9. jboss:在standalone.xml中设置系统属性(system-properties)

    就象在.net的web应用中,可以在web.config中设置appSettings一样,jboss的standalone.xml中也可以由开发人员自行添加系统属性,用法如下: </extens ...

  10. 获取图片base64编码的几种方法

    前文中我们聊了 Data URI 和 base64编码,稍微回顾下.base64编码 是将数据用 64 个可打印的字符进行编码的方式,任何数据底层实现都是二进制,所以都可以进行 base64编码,ba ...