首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

Windows Community Toolkit 3.0 - InfiniteCanvas

概述 InfiniteCanvas 是一个 Canvas 控件,它支持无限画布的滚动,支持 Ink,文本,格式文本,画布缩放操作,撤销重做操作,导入和导出数据。...这是一个非常实用的控件,在“来画视频” UWP 应用的绘画功能中,也用到了这个控件,它对不同画笔的选择,橡皮擦,直尺和圆形尺,文字输入和字体选择等都提供了很便捷的支持,而且支持导入和导出数据,可以很方便的创作绘画作品...中实现了一个 InkCanvas 所以可以实现各种笔触的笔迹绘制; InfiniteCanvas.Events.cs 主要是 Canvas 中的各种按钮点击等事件处理; InfiniteCanvas.TextBox.cs...主要是 Canvas 中 TextBox 控件对应的控件定义和事件处理; 调用示例 InfiniteCanvas 控件的调用非常简单,下面看看 XAML 中的调用: 控件在绘画类场景中有非常多的应用,控件默认实现了多种笔触的绘画,橡皮,文字,redo undo 等重要功能,开发者也可以根据 InfiniteCanvas 的实现自定义 Toolbar

56730

Extensions in UWP Community Toolkit - SurfaceDialTextbox

TextBox 中的数值进行调整,调整方式类似于 NumericUpdown,可以设置数值上限和下限,以及步长;旋转 Dial 可以选择有震动反馈,超过界限后也会有反馈提示,点按 Dial 可以选择...; Nuget: Microsoft.Toolkit.Uwp.UI; 开发过程 代码分析 SurfaceDialTextbox 的处理在类 SurfaceDialTextbox.cs 中,我们先来看看类的结构...public 类型,支持在调用代码中获取 Surface Dial controller 实例,用于 SurfaceDialTextbox 之外的控件上; _stepTextMenuItem - RadialControllerMenuItem...类型,在 Surface Dial 上下文菜单中显示的菜单项; _textBox - SurfaceDialTextbox 对应的 textBox 控件; 接下来看几个 SurfaceDialTextbox...旋转的步长,旋转变化事件;如果允许点击 Focus 到下一个控件,则设置 Radial Controller 的 点击事件; private static void TextBox_GotFocus(object

1.1K80
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    Fabric.js 文本自动换行的实现方式

    本文简介 点赞 + 关注 + 收藏 = 学会了 在 fabric.js 提供的文本组件中,默认状态是不会自动换行。...如果你的使用场景中需要自动文本自动换行,可以使用 Textbox ,并将 splitByGrapheme 设置为 true 即可。...自动换行 }) 在运行时调整 除了初始化 Textbox 时设置宽度外,还可以在运行时让用户调整文本框的宽度,只要 splitByGrapheme 为 true 时,Textbox 里的文本就会实时根据宽度进行换行...禁止用户调整文本框高度 了解过 fabric.js 的工友都知道,fabric.js 默认是允许用户缩放元素的。 如果 Textbox 元素的在页面上被用户垂直拉伸,里面的文本就会变形。...第二个参数设置控件是否可见。true 是默认值,表示可见;设置成 false 代表指定控件不可见。 默认情况 最后回顾一下 Textbox 的默认情况。

    8.5K40

    UWP入门教程1——UWP的前世今生

    目录 引言 设备族群 UI 和通用输入模式 通用控件和布局面板 工具 自适应扩展 通用输入处理 引言 在本篇文章中,可以掌握以下知识: 设备族群,如何决定目标设备 新的UI控件和新面板帮助你适应不同的设备特征...UWP 为开发跨设备App提供了可靠的API 层。这就意味着你只需要开发一次,就可在多种设备中运行。并发布到Windows Store,所有的用户都可以下载试用。 ?...这样做的目的,App会就可以使用所有设备族群,(从通用设备族群派生的) 限制App 适应某一种设备 限制App适应某一类设备 排除只支持某一特殊版本的设备族群 UI 和通用输入 UWP  App能够在具有不同特征的设备中运行...而且控件也做了相应的调整,能够适应大尺寸屏幕。 ? ?...在进行UWP平台的开发时,还可以借助一些开发工具。

    1.2K50

    UWP 入门教程2——如何实现自适应用户界面

    系列文章 UWP入门教程1——UWP的前世今生 如上文所说的,布局面板根据可用的屏幕空间,指定界面元素的大小和位置。例如StackPanel 会水平或垂直排列界面元素。...Grid 布局与CSS 中的表格控件类似,可将各元素按单元排列。 新提供的 RelativePanel 即相对布局,各个元素之间存在相对关系,可用来创建自适应界面。..." RelativePanel.Below="blueButton"/> 使用可视化状态触发器创建自适应UI UWP 提供自适应可视化状态,可根据窗口大小来调整状态值...自适应扩展 Windows 10 引入“缩放模型”的升级版,除了缩放矢量图之外,有一个统一的缩放因子集合,能够保证UI元素在不同的屏幕尺寸和分辨率下,界面元素大小的一致性。...良好的设计从确定用户交互方式开始,同时满足App的功能性和外观。用户体验非常重要直接影响了用户是否喜欢你的App,使用过程中是否愉悦或始终保持积极的情绪,而不受阻碍。

    3.2K50

    Extensions in UWP Community Toolkit - Overview

    来指定是否允许绑定实际尺寸中的 ActualWidth 和 ActualHeight。...的菜单,菜单图标是尺子;点按后可以通过旋转来改变 textbox 的值;如果初始时不点按 Dial,直接旋转也是一样改变 textbox 的值;在值超出 0~100 区间时,Dial 会有震动反馈;...TextBoxMask TextBoxMask 允许用户更简单的输入我们想要的数据格式,比如手机号码等;开发者可以添加这个 mask 属性来防止用户输入指定格式之外的文字; TextBox Mask 支持三种类型的变量字符...[a-Z] 大小写字母;2. [0-9] 数字;3. * 表示前两种都可以;除此之外,还可以支持固定字符,如 ‘-’ 这种不允许修改的占位符; 具体的 mask 书写还需要开发者根据业务需要去制定,我们来看一个简单的例子...总结 到这里我们就把 UWP Community Toolkit 中的 Extensions 的种类和简单的代码调用讲解完成了,希望这些扩展对大家开发 UWP 应用有所帮助,如果大家有更好用的扩展类,也欢迎大家给

    1.4K120

    关于WinForms的跨显示器DPI自适应

    类似的问题也发生在Windows中,特别是老程序,设计的时候只考虑了96 PPI。...首先,我在VS2019中使用150% DPI的主屏幕,设计器视图不模糊,但按钮尺寸有问题,控件位置如下: ? 留意红色箭头位置。在VS里一切正常。...但是在 100% DPI 的屏幕上,虽然UI不模糊,但是控件位置依然不正确,并且TextBox变的巨大无比。 ? 微软文档里没提别的方法。...经过仔细观察,发生问题的并不是 TextBox、Label、Checkbox 这几个控件,而是 MonthCalendar 在100% DPI的屏幕上比 150% 的主屏宽。...具有 Per Monitor-DPI aware 的能力,但是部分控件的尺寸还是会不一样,因此发布程序之前需要仔细测试,保证UI可用性,再向用户提供跨屏幕DPI自适应支持。

    2.6K20

    About Windows 10 SDK Preview Build 17110

    本次 SDK 更新在通知方面的提升主要是通知中图片限制的调整,通知中的进度条和输入选项的增加。 1....,目前在 Windows 预览版系统中支持,用户可以使用触控笔直接在 TextBox,RichTextBox 和 AutoSuggestBox 控件中使用 Windows Ink 进行书写。...来看看内置手写的官方演示: ? 用户可以在文本控件中任何位置进行书写,在候选窗口中识别出手写的结果并给用户推荐使用。用户可以选择一个结果,或在接受结果后继续书写。...UWP Console App 可以访问应用所在目录和所有子目录,因为它的模板中在 manifest 中添加了 AppExecutionAlias 的扩展,这种扩展让用户可以在控制台中输入缩写来启动应用...同时 UWP Console App 也支持多实例运行,因为它的模板中在 manifest 中添加了 SupportsMultipleInstances 能力。

    1.6K40

    WPF 自定义 TextBoxView 的 Margin 大小

    在 WPF 的 TextBox 里有 TextBoxView 用来渲染 TextBox 内容,但是在 TextBox 里面的 TextBoxView 是不能直接设置而且默认的 Margin 是 2,0,2,0...就是 2 这就是默认的大小 最简单的解决方法是通过设置 TextBox 的 Padding 的方法 TextBox Width="100" Padding="-2,0,-2,0"...的偏移,使用相反的值可以让 TextBoxView 的偏移取消,这里的 Padding 需要根据自己的需要设置 如果设置 Padding 的负数比较小,如 -500 就可以在 TextBox 的外面输入...如果这里的 TextBox 不是在 ListView 或其他控件使用了 TextBox 的,可以使用自己创建的类继承 TextBox 可以通过在 Load 重写控件的 Margin 重写 public...如果是使用其他控件,建议使用修改 Padding 的方法

    59120

    合体姿势不对的HeaderedContentControl

    前言 HeaderedContentControl是WPF中就存在的控件,这个控件的功能很简单:提供Header和Content两个属性,在UI上创建两个ContentPresenter并分别绑定到Header...以前的问题 在WPF中,HeaderedContentControl是Expander、GroupBox、TabItem等诸多拥有Header属性的控件的基类,虽然很少直接用这个控件,它的存在也有一定价值...不过在WPF中它的价值也仅此而已,由开发者自己实现也极其容易,以至于后来在Silverlight中就没有提供这个控件(后来放到了Silverlight Toolkit这个扩展里)。...UWP中几乎所有的表单控件都有Header属性,如TextBox、ComboBox等,这么看起来HeaderedContentControl更加重要了,但UWP反而没有提供HeaderedContentControl...,而且和TextBox等控件不同,UWP CommunityToolkit中的Header属性都是string类型,真是任性。

    91330

    了解模板化控件(9):UI指南

    借用附加属性 以TextBox为例,TextBox中包含一个ScrollViewer部件,想要通过属性控制这个ScrollViewer,其中一种做法是在TextBox中添加各项属性,然后在ControlTemplate...在上面这段XAML中,如果DateTimeSelector.IsTabStop=True,在TextBox上需要输入两次“Tab”DateTimeSelector内的CalendarDatePicker...再重申一次,模板化控件的属性默认值要在DefaultStyle中设置,尽量不要在构造函数中设置。 5....控件在获得焦点时会尝试从已加载的ControlTemplate中查找Control.IsTemplateFocusTarget="True"的UI元素,如果找到,就将FocusVisual绘制到这个元素的边界...幸好现在的主流是扁平化的简单的设计,在UWP中按钮的模板被大大简化: <ContentPresenter x:Name="ContentPresenter" BorderBrush="{TemplateBinding

    1.2K20

    【愚公系列】2023年11月 Winform控件专题 TextBox控件详解

    默认情况下,当用户按下回车键时,文本框会将焦点移动到下一个控件,而不是在文本框中插入回车符。如果要允许在文本框中输入回车符,则将AcceptsReturn属性设置为true。...默认情况下,当用户按下Tab键时,文本框会将焦点移动到下一个控件,而不是在文本框中插入制表符。如果要允许在文本框中输入制表符,则将AcceptsTab属性设置为true。...; //不更改文本大小写形式在用户输入数据时,TextBox控件将自动将输入文本转换为所选大小写形式。...注意:SelectedText、SelectionLength和SelectionStart属性都只适用于那些允许用户编辑并选定文本的控件。如果控件不允许用户选定和编辑文本,那么这些属性都将无效。...搜索:将TextBox控件作为搜索框,用户可以在其中输入关键字,搜索框下方显示搜索结果。文本编辑:将TextBox控件作为文本编辑器,用户可以在其中编辑文本,包括格式、字体、大小等。

    56623

    从ContentControl开始入门自定义控件

    前言 我去年写过一个在UWP自定义控件的系列博客,大部分的经验都可以用在WPF中(只有一点小区别)。...在WPF要创建自己的控件(Control),通常可以使用自定义控件(CustomControl)或用户控件(UserControl),两者最大的区别是前者可以通过ControlTemplate对控件的外观灵活地进行定制...控件库中通常使用自定义控件而不是用户控件。 3....除了可继承值的属性,需要适当地将ControlTemplate中的元素属性绑定到所属控件的属性,例如Margin="{TemplateBinding Padding}",这样可以方便控件的使用者通过属性调整...通过Setter改变默认值 通常从父控件继承而来的属性很少在构造函数中设置默认值,而是在DefaultStyle的Setter中设置默认值。

    4.1K40

    【译】Visual Studio 2019 中 WPF & UWP 的 XAML 开发工具新特性

    实时可视化树中的Just My XAML 可移动的应用内工具栏(v16.3): 应用程序内工具栏已得到增强,可在正在运行的 WPF / UWP 应用程序中移动,从而使开发人员能够在应用程序中向左或向右拖动它以解除阻止应用程序...以前的经验丰富的用户在 Visual Studio 会话中存储了每个文件的缩放级别和位置,这在客户经过一段时间后返回文件时引起混乱。...要使用此功能,请先通过“选项”>“预览功能”>“ XAML建议的操作”将其启用。启用后,请单击受支持的控件,然后使用灯泡展开并与“建议操作”用户界面进行交互。...在此版本中,受支持的控件包括:边框,按钮,画布,复选框,组合框,网格,图像,标签,列表框,ListView,StackP anel,TextBlock,TextBox。...合并资源字典 “编辑模板”现在可与第三方控件中的控件一起使用: 即使“编辑模板”现在不是源代码解决方案的一部分,也可以创建控件模板的副本。

    7.4K30

    UWP Brush画笔详解

    Background,Foreground等属性,这就是控件的画笔 TextBox textBox = new TextBox(); textBox.Foreground = new SolidColorBrush...如果终点坐标大于1,则部分图像会被绘制到窗口外面,因此终点的坐标通常小于等于1 修改渐变向量可以达到修改渐变方向的效果 其中无效区并不是说不会被绘制,而是不会出现渐变效果,它的颜色会分别和渐变向量在的起点和终点处的颜色相同...如果希望颜色不随控件大小改变而拉伸,需要把画笔定位方式修改为绝对位置 brush.MappingMode = BrushMappingMode.Absolute; // 绝对坐标 //brush.MappingMode...//加载图片 brush.ImageSource = new BitmapImage(new Uri("ms-appx:///Assets/1.jpg")); //设置图片在保留纵横比的同时适应控件大小...如果以控件作为采样源,那么你可以透过使用了亚克力画笔的控件,隐约看见下面的控件 如果以应用窗口作为采样源,那么你可以透过该控件,隐约看到桌面壁纸 修改覆盖层的颜色和不透明度来达到更美观的效果 //不透明度为

    85820

    【愚公系列】2023年11月 Winform控件专题 Label控件详解

    当文本超出控件的显示区域时,控件将自动添加省略号。可以通过修改控件的大小、字体大小和文本内容等来调整省略号的位置和显示效果。...当AutoSize属性设置为True时,控件将自动根据其内容调整大小。例如,当您在Label控件中显示较长的文本时,它将自动扩展以适应文本。...您还可以在代码中设置它,如下所示:label1.AutoSize = true; //设置AutoSize属性为true您可以在程序运行时动态设置AutoSize属性,例如在窗体加载时根据控件内容调整其大小...在该事件中,判断文本框中是否为空,如果为空则弹出提示框并阻止焦点离开控件。这样,用户就必须输入有效的值才能离开文本框。...例如,如果将一个Label控件的Dock属性设置为Top,则该控件将停靠在其容器的顶部,并且在容器大小改变时,该控件也会随之自动调整大小和位置,以保持停靠在顶部的位置不变。

    90911

    dotnet 从入门到放弃的 500 篇文章合集

    好用的插件 Sublime Text 安装中文、英文字体 sublime Text 正则替换 SublimeText 粘贴图片保存到本地 UWP 分享用那个图标 UWP 和 WPF 对比 UWP 开发中...win10 uwp 获取文件夹出错 win10 uwp 获得元素绝对坐标 win10 uwp 获得缩略图 win10 uwp 萤火虫效果 win10 uwp 让焦点在点击在页面空白处时回到textbox...type-使用构造 win10-uwp-使用md5算法 win10-uwp-保存用户选择文件夹 win10-uwp-入门 win10-uwp-兴趣线 win10-uwp-切换主题 win10-uwp-列表模板选择器...写系统日志 WPF 判断调用方法堆栈 wpf 单例 WPF 只允许打开一个实例 WPF 可获得焦点属性 WPF 在 Alt+Tab 隐藏窗口 WPF 好看的矢量图标 wpf 如何使用 Magick.NET...给博客添加rss订阅 自动机 解决 vs 出现Error MC3000 给定编码中的字符无效 解决 VS 跳转定义和 Resharper 重复 解决 Win10 UWP 无法使用 ss 连接 让 AE

    10.5K20

    以Button为例谈谈如何模仿Aero2主题

    顺便拿Button与WPF的其它控件、及UWP的相同控件做横向对比,使用相同的XAML产生的UI如上图所示(上为UWP,下为WPF)。...再次横向比较一下,这次试用Disabled状态作比较,可以看到每个控件的边框无论在Enabled或Disabled的状态下边框颜色都不一样(除了TextBox和PasswordBox,他们关系好)。...因为看不到Aero2在颜色上有什么要求,我的建议是,如果自定义的控件长得像TextBox就使用TextBox的颜色设置,长得像Button的就用Button,总之尽量模仿原生控件,颜色也尽量使用蓝色或灰色就可以了...不过在实现其它自定义控件的时候我也比较倾向提供VisualState,因为这样可以明确指出控件外观有几种状态,避免了混轮,而且提供了VisualState可以更方便扩展。...对最终用户来说多一个选择并不是坏事。 ? 5. 结语 通过这篇文章读者应该对Aero2的风格有了一定程度的了解。更多Aero和Aero2的相关信息可以看这个Github项目。

    1.2K40
    领券