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

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

例如,前述例子DateTimeSelector包含一个TimePicker部件,可以公开一个TimePickerStyle属性让TimePicker绑定到这个属性。...对于复合型控件(即ControlTemplate包含其它控件控件,譬如DateTimeSelector,它本身是一个控件,又包含CalendarDatePickerTimePicker),很多时候需要将...DateTimeSelectorCalendarDatePicker都是Control,Tab会让DateTimeSelector先获得焦点,然后才让CalendarDatePicker获得焦点。...幸好现在主流是扁平化简单设计,在UWP按钮模板被大大简化: <ContentPresenter x:Name="ContentPresenter" BorderBrush="{TemplateBinding...例如这个对话框,一不小心就点击左边<em>的</em>“取消”按钮了。 9. 符合典型<em>的</em>GUI设计原则 在控件层级就应该将UI设计成符合设计原则,例如对齐,使用字体<em>和</em>颜色突出主要<em>内容</em>,易于操作等。 ?

1.2K20

了解模板化控件(5.1):TemplatePart vs. VisualState

不过在实际应用这两种实现方式并不是互斥,很多模板化控件都同时使用这两种方式, 使用VisualState有如下好处: 代码UI分离。 可以更灵活地扩展控件。 可以使用Blend轻松实现动画。...某个行为时固定,不需要扩展。 需要在代码操作UI,譬如SliderComboBox。 为了强调某个部件是控件必须。...2.1 使用TemplatePart DateTimeSelector组合了CalendarDatePickerTimePicker,用于选择日期时间(SelectedDateTime)。...DateChangedTimePickerTimeChanged来改变SelectedDateTime值。...这里给出了两个Style,分别使用了CalendarDatePicker DatePicker ,通过TwoWay Binding访问DateTimeSelector2Date属性。

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

WPF UWP ,不用设置 From To,Storyboard 即拥有更灵活动画控制

WPF UWP ,不用设置 From To,Storyboard 即拥有更灵活动画控制 发布于 2017-10-26 04:55...在 UWP 动画效果 image.png 预备代码 为了让读者能够最快速地搭建一个可供试验 DEMO,我这里贴出界面部分核心代码。...XAML 是这样(这里 XAML,WPF UWP 完全一样,可以互相使用而不用修改任何代码): 布局部分 <Grid.RowDefinitions...可以不通过 From To 来指定动画起始值终止值;但如果真的不指定 From To,需要提前播放一次动画以确保动画能保持住元素状态; 在 WPF ,如果没有指定 From To,那么动画结束后依然能直接为元素属性复制...,且会立刻生效(正常情况下需要先清除动画); 在 UWP ,必须指定动画 To 才能按照期望播放到目标值。

1.1K10

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

本文是记录我从入门到放弃写博客 博客包括 C#、WPF、UWP、dotnet core 、git VisualStudio 一些算法,所有博客使用 docx 保存 下载:dotnet 从入门到放弃...信息 C# 转换类型字符串 C# 遍历枚举 C# 金额转中文大写 C#将dll打包到程序 c-70 c-设计模式-责任链 cant found Microsoft.VSSDK.BuildTools.15.0.26201...WPF 对比 UWP 开发,需要知道1000个问题 Visual studio C# 代码使用 NotNull visual Studio 无法调试,提示程序跟踪已退出 visual-studio-...win10 uwp 使用动画修改 Grid column 宽度 win10 uwp 依赖属性 win10 uwp 修改CalendarDatePicker图标颜色 win10 uwp 修改Pivot...给博客添加rss订阅 自动机 解决 vs 出现Error MC3000 给定编码字符无效 解决 VS 跳转定义 Resharper 重复 解决 Win10 UWP 无法使用 ss 连接 让 AE

10.4K20

TDesign 更新周报(2022年9月第4周)

,tdesign-vue-nex#1722不提供expandedRowKeys绑定会报错 ,缺少判空,tdesign-vue-nex#1704 @chaishi (#1562)修复视图切换表格变化场景下... 传入 lambda 函数被频繁触发问题 @HQ-Lin (#1569)TimePicker: 修复部分场景 style 属性内 token 缺失导致滚动异常问题 @uyarn (common#877...@chaishi (#1723)移除文档不存在 API customDraggerRender,请使用 dragContent  children 自定义拖拽区域@chaishi (#1723) ... @sechi747 (#1739)TreeSelect: 修复 popuoContent 无 padding @fenbitou (#1714)Hooks: 修复使用 v-model.trim 会将内容清空问题...情况下,输入值超出 maxcharacter 问题 @anlyyao (#883)DateTimePicker: 修复选项重置错误问题 @LeeJim (#888)详情见:https://github.com

1.2K10

TDesign 更新周报(2022年5月第3周)

组件库 Vue2 for Web 发布 0.41.5 Features Form:支持 help 配置表单项说明内容与错误提示同时展示,未配置 help 时不再默认占位 Table: 树形结构,...insertBefore 树形结构,支持在当后节点之后插入新节点 insertAfter Tree:label 支持多行文本展示 Bug Fixes Table:列拖动优化;修复选中行后列拖动距离被重置问题...Table:修复 多级表头 + 列配置 综合示例,列数量超出一定限制时报错 Transfer:修复列表数量变化时页码展示问题 Input:修复 clear 触发后 focus, 修复外部传入...TimePicker:修复TimePicker展开宽度问题 Others 统一全局受控 hooks & 优化组件初始值设置 详情见:https://github.com/Tencent/tdesign-vue-next...Color style 色彩样式层级命名修改 3.

2.8K30

TDesign 更新周报(2022年9月第1周)

组件库Vue2 for Web 发布 0.46.4 FeaturesPopup: 新增 delay 属性用于控制延时显示隐藏浮层,修复子 Popup 销毁时父级意外关闭问题 @ikeq (#1436...模式下 filter 能力 @skytt (#1427)修复过滤掉数据后上下键仍可以选择过滤外数据问题 @sechi747 (#1434)Button: 区分 loading  disabled... 数据变成数组 (vue-next #1502)修复 ellipsisTitle 配置优先级低于 ellipsis 问题 @Tomaolala (#1408)SelectInput: 修复多选清除无效导致... Cascader 点击清除按钮表现异常问题 @pengYYYYY (#1457)Watermark: 修复 removable 属性设置不生效,及 content 不支持动态修改变化问题 @carolin913...: 修复下拉菜单定位错误问题 @LeeJim (#836)Tabs: 修复垂直模式下内容区域绑定事件无效问题 @anlyyao (#837)Fab: 修复悬浮按钮随页面滚动问题 @anlyyao

2.6K20

TDesign 更新周报(2022年6月第3周)

组件库Vue2 for Web 发布 0.42.1FeaturesForm:实例方法 reset 支持重置指定字段,新增参数 { type:'initial' | 'empty', fields:number...[] }实例方法 validate 支持值校验而不显示每个组件错误信息文本,新增参数 { showErrorMessage }FormItem 支持自定义 help 内容,插槽渲染函数均可新增纯净校验方法...样式及交互,移除 range api,分别导出 Datepicker 与 DateRangePicker,存在不兼容更新TimePicker:重构TimePicker为 compositionAPI,全新...UI样式及交互,disableTime API 有所调整, 调整交互为点击确认按钮保留改动, 直接关闭弹窗不保留改动恢复初始值,存在不兼容更新FeaturesTable:筛选对话框输入筛选内容之后按回车应该按确定按钮一样... 存在时,拖拽排序顺序不正确问题timepicker: 修复初始化滚动问题Select: 修复 minCollapsedNum 无效问题Skeleton: 修复 ts 类型问题Tabs: 修复左右切换渲染问题

3K10

TDesign 更新周报(2022年7月第2周)

Cascader: 修复多选时,文本过长未处理问题修复选中内容过多时,再点击选择器后闪动问题SelectInput: 修复 overlayStyle 响应式无法更新问题TagInput: 修复 inputProps...属性透传无效Transfer: 修复穿梭框进行穿梭时报错问题Table: 树形结构支持懒加载Dialog: 修复打开对话框时出现滚动条问题DatePicker: 修复日期格式化问题TimePicker...: 支持毫秒使用场景Tree: tree 支持拖拽 Bug FixesSpace: 通过FOR循环内容 没有实现间隔效果DatePicker: 修复日期格式化问题TimePicker: 优化可输入模式使用体验...修复异步加载回显展示问题Textarea: 修复无法传入 attrs style详情见:https://github.com/Tencent/tdesign-vue-next/releases/tag...: 支持毫秒场景使用 Bug FixesTable: 可编辑功能,值为 null 时会导致页面报错,如清除 Select 数据Dialog: 修复 dialog 阻止冒泡导致 popup 无法正常关闭Input

2.2K10

Date & Time组件(下)

简直把我丑哭了,有木有,终于知道为什么那么多人喜欢自定义这种类型控件了!但是毕竟 提纲上写了,自己写提纲,含着泪也要把他写完...当我把DatePicker写到布局,然后看下预览图。...android:dayOfWeekTextAppearance:顶部星期几文字颜色 android:endYear:去年(内容)比如2010 android:firstDayOfWeek...),比如19940年 android:yearListItemTextAppearance:列表文本出现在列表。...: android:timePickerMode:组件外观,同样可选值为:spinnerclock(默认) 前者是旧版本TimePicker。...嗯,好像变化不大,接下来我们简单看下文档给我们提供属性 android:firstDayOfWeek:设置一个星期第一天 android:maxDate :最大日期显示在这个日历视图mm

12420

Android开发笔记(二十三)文件对话框FileDialog

首先要提供日期对话框时间对话框布局文件,例如R.layout.dialog_format_dateR.layout.dialog_format_time,布局文件需分别集成DatePicker...然后分别初始化DatePickerTimePicker对象,分别设置当前日期与当前时间。...最后还要提供一个回调接口,用于主页面上处理日期时间选择事件,同时在确定按钮点击事件要触发该回调接口方法。...在newInstance创建一个实例,并传入需要参数信息,比如标题、内容等等字段。...当然不要忘了在主页面的回调方法对选定文件做具体处理,文件打开之后要如何读取数据,又要如何把内存数据保存到文件。 下面是文件打开对话框与文件保存对话框页面截图: ? ?

3.2K30

Vue 折腾记 - (17) 基于Ant Design Vue 封装一个配置式表单组件

---- 实现思路功能 基础功能直接配置上来渲染,而上传组件就不大合适了; 所以选择了slot来实现,如何保证传入form-item布局一致,则是拿slot-scope 我这边选型用是vue...handleSubmit">查询 重置...判断moment value = value.map(item => item.valueOf()); } } // 若是为字符串则清除两边空格...{ display: block; margin-bottom: 24px; white-space: nowrap; } } 复制代码 ---- 问题 暴露方法搜索组件一样...排查了许久,目前还没找出具体缘由; ---- 总结 antd vue版本目前功能复现上,还是有所欠缺,可能vuereact实现机子不一致导致; 不管怎么说,不考虑极端情况下,目前这个库用起来感觉还好

4.1K40
领券