示例
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. QuickFix/J 源代码

    三). 客户化FIX解析 基础知识:以下文章内容描述的前提是已经根据自己的业务规则,生成了符合要求的数据字典,并且使用QuickFix/J自带的 ant 的 jar target生成了客户化的协议解析 ...

  2. java 26 - 6 网络编程之 TCP协议 传输思路 以及 代码

    TCP传输 Socket和ServerSocket 建立客户端和服务器 建立连接后,通过Socket中的IO流进行数据的传输 关闭socket 同样,客户端与服务器是两个独立的应用程序 TCP协议发送 ...

  3. Cordova - 使用Cordova开发iOS应用实战4(调用摄像头拍照,并编辑)

    使用Cordova可以很方便的通过js代码来使用设备摄像头拍照,只需把camera插件添加进来即可. 一,添加camera插件 首先我们要在“终端”中进入工程所在的目录,然后运行如下命令: 1 cor ...

  4. MVP 实例

    引言 可能有的朋友已经看过我翻译的Jean-Paul Boodhoo的 模型-视图-提供器 模式 一文了(如果没有,建议你先看下再看这篇文章,毕竟这两篇是紧密联系的).在那篇文章中,作者为了说明 MV ...

  5. 【java】企业级分布式搜索平台Solr视频教程

    课程背景为了满足高可用.可扩展并容错的分布式搜索引擎.Solr是一个高性能,采用Java5开发, 基于Lucene的全文搜索服务器.同时对其进行了扩展,提供了比Lucene更为丰富的查询语言,同时实现 ...

  6. CareerCup All in One 题目汇总 (未完待续...)

    Chapter 1. Arrays and Strings 1.1 Unique Characters of a String 1.2 Reverse String 1.3 Permutation S ...

  7. beaglebone_black_学习笔记——(9)UART使用

    笔者通过查阅相关资料,了解了BeagleBoneBlack开发板的UART接口特性,掌握的UART接口的基本使用方法,最后通过一个C语言的例程实现串口的自发自收.有了这个串口开发板就可和其他设备进行串 ...

  8. jQuery api 快速参考[转]

    选择符 匹配 * 所有元素 #id 带有给定ID的元素 element 给定类型的所有元素,比如说html标签 .class 带有给定类的所有元素 a,b 匹配a或者匹配b的元素 a b 作为a后代的 ...

  9. 新时代的coder如何成为专业程序员

    在移动互联网"泛滥"的今天,越来越多非专业(这里的非专业指的是非计算机专业毕业的程序员)程序员加入到了IT行业中来了,可能是因为移动互联网的火爆导致程序员容易就业而且工资很高,可能 ...

  10. TCP/IP中最高大上的链路层简介(二)

    引言 对于程序猿来讲,似乎越接近底层,就越显得高大上.这也算是程序猿们的共同认知吧,虽然不是所有人.今天LZ就和各位一起探讨一下TCP/IP中最高大上的一层,也就是最底层的链路层. 这一层LZ了解的还 ...