看见没,点击"Options"按钮,浮动出来一个界面,这个界面可以用xaml自定义. 如果要点击的控件又Flyout属性那么,可以直接按照下面用 <Button Content="Click me"> <Button.Flyout> <Flyout> <TextBlock Text="This is a flyout!"/> </Flyout> </Button.Flyout>…

参考了 http://www.cnblogs.com/zhanggaoxing/p/6403430.html,并加以改进. 最终效果::: Thumb 的原生事件 DragStarted,DragDelta,DragCompleted.DragStarted 和字面意思差不多,开始拖动的时候发生的.DragDelta 拖动进行中,只要你鼠标不放就会一直进行.DragCompleted 拖动结束后发生. 首先需要在合适的页面敲上一个 <Thumb />,给它个 Name="RootTh…

1. 前言 在WPF中,很多打开下拉框(Popup或Flyout)选择一个结果值的控件,除了ComboBox等少数例外,这种控件都以-Picker做名称后缀.因为要打开关闭下拉框和计算下拉框的弹出位置, 这类控件实现起来还挺麻烦的.Silverlight Toolkit中贴心地提供了一个Picker控件,可以作为这类控件的基类,省略了大量代码. 2. 现在的问题 由于UWP中有Flyout,-Picker控件的实现其实算是相当轻松的.如ColorPicker的官方文档就介绍了使用Flyout承载…

目录 说明 WebView存在的价值 使用WebView的几个重要技巧 使用WebView做的聊天框 说明 大家都知道,无论是之前的Winform.WPF还是现在的IOS.Android开发中,都存在一个极其牛茶但是被很多人用错了的控件:Web浏览控件.各个平台中的叫法不同,但是作用类似:能够加载显示HTML.UWP开发中同样存在这样的一个控件:WebView.往大了说,用它可以做一个简单浏览器,但是这篇博客并不打算教大家怎样用它开发一款UWP浏览器,因为我认为它存在的价值并不在此.当然了,你要…

UWP提供的AutoSuggestBox本身非常好用,在项目中经常用到,但是当我们使用时发现一下不人性化的设置,例子1如下: <Page x:Class="SelfInkCanvas.AutoBoxTest" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml&qu…

最近我的uwp需要有一个有声朗读的功能,like this 点击声音按钮就可以有声朗读了.这里主要是用了媒体播放的控件. 一般我们把需求分为两种: 一种是不需要呈现播放器的样子,只需要用户点击一下别的按钮,播放器会在后台播放.像我上面的图一样,不需要展现播放器的样子. 第二种是传统的播放器,需要展现系统播放器的样子,例如进度条等,音量键,停止键等.例如下图最普通的播放器 第一种用的是MediaElement控件. 第二种用的是MediaTransportControls控件. 一:MediaEl…

在写一个看新闻软件的时候,用到了SemanticZoom控件,遇到了一些问题,比如如何根据首字母分类,以及放大视图中有数据的和没数据的通过背景色或前景色区分,幸运的是,all solved. 先来个效果图 主要是参考了msdn的一篇博客,地址已经放在参考链接里了. 首先是一个SemanticZoom控件,这个控件有ZoomedInView和ZoomedOutView两种视图. ZoomedOutView视图就是这个 而ZoomedInView视图就是一个带有列表头的列表的样子,还是上个图好了,我…

本文主要讲一个在绘图中,我们会有一个基础的控件,Line.控件的基本使用和他能做出的我们很多时候需要的界面. 虽然是一个简单控件,但是可以做出很诡异的很好看的UI. 首先,我们要知道,Line就是画直线.当然我们画他一般是在Canvas中. 我们先在一个页面新建一下,写下必要的代码. <Grid Margin="10,10,10,10"> <Canvas> </Canvas> </Grid> 首先我们需要确定直线坐标,用X1X2,Y1Y2…

今天用一个Pivot控件的时候,想修改一下它的Header样式,却发现用Blend和VS无法导出它的默认样式了,导致无法下手,不知道是不是Blend的bug. 在网上搜了一下,在MSDN上还是找到了它的默认样式的,位置如下:https://msdn.microsoft.com/en-us/library/windows/apps/mt299142.aspx.其它的控件默认样式这个地址上也有,如果有需要的可以查询一下.…

通过 Nuget 搜索 Microsoft.Toolkit.Uwp.UI.Controls.DataGrid 安装库,在XAML文件中添加引用库 xmlns:controls="using:Microsoft.Toolkit.Uwp.UI.Controls"   <Page x:Class="App2.MainPage" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation&…

UWP学习记录4-设计和UI之控件和模式1 1.控件和事件简介 在 UWP 应用开发中,控件是一种显示内容或支持交互的 UI 元素. 控件是用户界面的构建基块. 我们提供了超过 45 种控件供你使用,范围从简单按钮到网格视图之类的功能强大的数据控件. 模式是合并多个控件来创造新内容的一种方式. 应用添加控件实现UI,主要是三个步骤: A.将控件添加到你的应用 UI. B.设置控件的属性,如宽度.高度或前景色. C.将代码添加到控件的事件处理程序,从而使其执行一些任务. 添加应用一般通过: A.1…

在 WPF 上可用的控件拖动方法在 UWP 上大多没用,那干脆用 Thumb 仿制一个吧. 关于 Thumb 控件的教程也不多,毕竟在 WPF 控件拖动有很多种方法, Thumb 就显得很鸡肋了.下面我就简单的说说.(MSDN 文档) 不谈什么属性和方法,大多数都是继承的.主要说说 Thumb 的原生事件 DragStarted,DragDelta,DragCompleted. DragStarted 和字面意思差不多,开始拖动的时候发生的. DragDelta 拖动进行中,只要你鼠标不放就会一…

前几天我写了一个UWP图片裁剪控件ImageCropper(开源地址),自认为算是现阶段UWP社区里最好用的图片裁剪控件了,今天就来分享下我编码的过程. 为什么又要造轮子 因为开发需要,我们需要使用一个图片裁剪控件来编辑用户上传的图片.本着尽量不重复造轮子的原则,我找了下现在UWP生态圈里可用的图片裁剪控件,然后发现一个悲惨的事实:UWP生态圈甚至没有一个体验优秀的图片裁剪控件! 举例来说,就连现在商店里做的比较好的网易云音乐.IT之家以及爱奇艺等应用,他们使用的图片裁剪控件体验也糟糕的一塌糊涂…

Windows Community Toolkit 再次更新到 5.0.以前可以在 WPF 中使用有限的 UWP 控件,而现在有了 WindowsXamlHost,则可以使用更多 UWP 原生控件了. 关于 Windows Community Toolkit 早期版本的 Xaml Bridge,可以参见: WPF 使用 Edge 浏览器 - 林德熙 本文内容 安装 NuGet 包 配置 WPF 项目能访问 UWP 的类型 开始在 WPF 中使用 UWP 的控件 可以忽略的错误 最终效果 值得注意…

[源码下载] 背水一战 Windows 10 (31) - 控件(按钮类): ButtonBase, Button, HyperlinkButton, RepeatButton, ToggleButton, AppBarButton, AppBarToggleButton 作者:webabcd 介绍背水一战 Windows 10 之 控件(按钮类) ButtonBase Button HyperlinkButton RepeatButton ToggleButton AppBarButton A…

简介 在当前的开发中,NuGet的使用已经有了不小的地位,特别是应用.NET Core的UWP开发里,模块化的平台本身更是直接依赖于NuGet这一包管理器. 有时自己开发了一个不错的控组件,想通过NuGet与广大开发中分享,以享受包管理器快捷.模块化的优势,该如何做呢?本文将就基本的UWP控件的开发与打包,来为大家介绍UWP与NuGet配合的过程. UWP控件的开发 对于控件的开发,想必大家都是身经百战,已无须多言.不过本文仍有一些小小的建议,可以帮助大家创造出更普适.更易用的控件. 选择库的类…

介绍背水一战 Windows 10 之 控件(按钮类) ButtonBase Button HyperlinkButton RepeatButton ToggleButton AppBarButton AppBarToggleButton 示例1.ButtonBase(基类) 的示例Controls/ButtonControl/ButtonBaseDemo.xaml <Page x:Class="Windows10.Controls.ButtonControl.ButtonBaseDemo…

[源码下载] 背水一战 Windows 10 (79) - 自定义控件: Layout 系统, 控件模板, 事件处理 作者:webabcd 介绍背水一战 Windows 10 之 控件(自定义控件) 自定义控件的 Layout 系统 自定义控件的控件模板和事件处理的相关知识点 示例1.演示自定义控件的 Layout 系统/MyControls/MyControl2.cs /* * 本例通过一个自定义控件来演示 uwp 中可视元素的 Layout 系统 * * uwp 的 layout 是一个递归…

以下再来看看一些前面还没有讲过的控件,只是控件太多以至于无法所有列出来,大家仅仅好举一反三啦. Button 前面最经常使用的控件就是Button啦,Button另一个有意思的属性呢.当把鼠标指针放在Button上时,就会在Button的头顶冒出一串文本啦.这个不太截图哎-- <Button ToolTipService.ToolTip="Go to www.blog.csdn.net/nomasp" Margin="692,458,0,230" />…

前言 在淘宝的收藏夹页面本地化过程中,收藏的宝贝和店铺的分类展示通过一个下拉菜单的方式进行展示.如果单独为此从头重写一个控件,那么不但费时费力,包括所有的动画方式都要全新设计,而且还容易出 bug.好在 Windows 提供了一些类似 “下拉菜单” 的控件,例如 Flyout,这个控件最常的使用场景就是弹出菜单,我们可以在这个基础上进行修改,使得其展示方式尽量贴近淘宝的下拉菜单风格. ---------这里是现实和理想的分割线--------- 以上都是我脑中美好的幻想.现在欢迎来到残酷的现实世…

[源码下载] 背水一战 Windows 10 (35) - 控件(弹出类): FlyoutBase, Flyout, MenuFlyout 作者:webabcd 介绍背水一战 Windows 10 之 控件(弹出类) FlyoutBase Flyout MenuFlyout 示例1.FlyoutBase(基类) 的示例Controls/FlyoutControl/FlyoutBaseDemo.xaml <Page x:Class="Windows10.Controls.FlyoutCont…

1.FlyoutBase(基类) 的示例Controls/FlyoutControl/FlyoutBaseDemo.xaml <Page x:Class="Windows10.Controls.FlyoutControl.FlyoutBaseDemo" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.…

1. 前言 Fall Creators Update中提供了一个新得ColorPicker控件,解决了以前选择颜色只能用Combo Box的窘境. 2. 一个简单的例子 <ColorPicker x:Name="ColorPicker" Margin="5" /> <Grid Margin="5"> <Grid.Background> <SolidColorBrush Color="{x:Bin…

今天是想通过实例将UWP开发常用的数据列表做汇总比较,作为以后项目开发参考.UWP开发必备知识点总结请参照[UWP开发必备以及常用知识点总结]. 本次主要讨论以下控件: GridView:用于显示数据项的水平网格控件 ListView:用于显示数据项的垂直列表控件 ListBox:可选项列表控件 ItemsControl:用于显示数据项的列表控件.是其他控件的父类. Pivot:应用内部标签导航控件 FlipView:每次只显示一个数据项的控件,通过滑动切换数据项 SplitView:包含主视图…

在开发应用的过程中,不可避免的会使用第三方类库.之前用过一个WinRTXamlToolkit.UWP,现在微软官方发布了一个新的开源控件库—— UWPCommunityToolkit 项目代码托管在Github上:https://github.com/Microsoft/UWPCommunityToolkit 包括以下几个类库: 都可以很方便的从Nuget上安装. NuGet Package Name description Microsoft.Toolkit.Uwp 主要包括一些帮助类,如颜色…

在uwp开发中必不可少的一个环节就是各种通用的控件的开发,所以在闲暇时间汇总了一下在uwp开发中控件的几种常用写法,以及属性的几种绑定方式,有可能不全面,请大家多多包涵 :) 1.先从win10新增的{x:Bind}绑定方式说起,相对于{Binding},{x:Bind}在时间复杂度和空间复杂度上都要降低不少.但并不是说{x:Bind}能够完全取代{Binding},因为{x:Bind} 比 {Binding} 少了许多功能,例如 Source.UpdateSourceTrigger等,并且不支…

UWP学习记录10-设计和UI之控件和模式7 1.导航控件 Hub,中心控件,利用它你可以将应用内容整理到不同但又相关的区域或类别中. 中心的各个区域可按首选顺序遍历,并且可用作更具体体验的起始点. 中心的内容可以显示在全景视图中,这样用户一眼就能看见新增内容.可用功能和相关信息. 中心通常具有一个页标题,每个内容部分各有一个部分标题. Pivot,透视表控件,用于导航经常访问的不同内容类别. 透视表允许在两个或多个内容窗格之间进行导航,并且依靠文本标题来表明内容的不同部分. SemanticZ…

UWP学习记录9-设计和UI之控件和模式6 1.图形和墨迹 InkCanvas是接收和显示墨迹笔划的控件,是新增的比较复杂的控件,这里先不深入. 而形状(Shape)则是可以显示的各种保留模式图形对象,例如椭圆.矩形.直线.贝塞尔曲线等,Path 是最通用的 Shape,因为使用它可以定义任意几何图形.图形这块,是和wpf一样的. 2.布局控件 布局控件这块,大体上也是和wpf一样的.布局控件包含边框(Border).画布(Canvas).网格(Grid).RelativePanel.Stack…

UWP学习记录8-设计和UI之控件和模式5 1.日历.日期和时间控件 日期和时间控件提供了标准的本地化方法,可供用户在应用中查看并设置日期和时间值. 有四个日期和时间控件可供选择,选择的依据如下: 日历日期选取器是一个下拉式控件,该控件已针对从日历视图中选取某个日期进行了优化,尤其是能够显示诸如星期几或丰富的日历信息等上下文信息. 可以修改日历以提供其他上下文或限制可用日期. 日历视图让用户查看可按月份.年份或十年期浏览的日历,并与之交互. 用户可选择单个日期或一组日期. 它没有选取器图面,并且…

UWP学习记录7-设计和UI之控件和模式4 1.翻转视图 使用翻转视图浏览集合中的图像或其他项目(例如相册中的照片或产品详细信息页中的项目),一次显示一个项目. 对于触摸设备,轻扫某个项将在整个集合中进行浏览. 对于鼠标,导航按钮显示在鼠标悬停位置上. 对于键盘,使用箭头键移动浏览该集合. 翻转视图最适合浏览小到中型集合中的图像(最多 25 个项目左右). 此类集合的示例包括产品详细信息页中的项目或相册中的照片. 虽然微软不建议将翻转视图用于大多数大型集合,但是该控件通用于查看相册中的个别图像.…