免费获取学习方案
ARTICLE DETAIL

资讯详情

深耕编程基础知识与建站技术分享的一线实战洞察。

界面组件Telerik UI for WPF入门级教程 - 如何创建进度条?

界面组件Telerik UI for WPF入门级教程 - 如何创建进度条? 正在寻找一种简洁而简单的方法来跟踪WPF应用程序中的多步流程不用查找其他工具了Telerik UI for WPF 在R1 2022版本中就已发布了相关的新组件——RadStepProgressBar 组件。为什么要使用StepProgressBar进度条是一个可以设置的视觉元素通过多个不同的步骤显示多步骤过程并在每个步骤之间设置一个进度条以使原本冗长的表单对用户来说变得更简单它适用于注册、预约、包裹状态跟踪、测验、更长的调查等。如何操作在本节中您首先需要一个新的WPF应用程序引用Telerik.Windows.Controls 程序集。telerik:RadStepProgressBar xmlns:telerikhttp://schemas.telerik.com/2008/xaml/presentation telerik:RadStepProgressBarItem ContentOrdered AdditionalContent1/10/2020/ telerik:RadStepProgressBarItem ContentPacked AdditionalContent10/10/2020 / telerik:RadStepProgressBarItem ContentShipped AdditionalContent1/2/2021 / telerik:RadStepProgressBarItem ContentDelivered AdditionalContent5/2/2021 / /telerik:RadStepProgressBar这是开始使用 RadStepProgressBar 的最简单方法如果想要更深入可以在数据绑定场景中使用该控件这可以通过ItemsSource 属性来完成并且还会为数据集合的每个成员自动生成一个 RadStepProgressBarItem。主要功能检查方向和布局如果您希望步骤进度条具有不同的方向可以通过 Orientation 属性更改它流动方向也可以颠倒——从右到左或从下到上。调整步骤如果进度条步骤之间的间距太小或太大可以使用Step Spacing 属性。对于每个 StepProgressBarItem您可以从 Telerik:Geometry 预定义类型中进行选择或创建自定义类型一旦您找到了合适的只需将它分配给任何项目的 ShapeGeometry 属性即可。telerik:RadStepProgressBar telerik:RadStepProgressBarItem ShapeGeometry{telerik:Geometry TypeEllipse} BackgroundMediumPurple Foreground#FFFFFFFF ShapeWidth30 ShapeHeight30/ telerik:RadStepProgressBarItem ShapeGeometry{telerik:Geometry TypeSquare} BackgroundLimeGreen Foreground#FFFFFFFF ShapeWidth30 ShapeHeight30/ telerik:RadStepProgressBarItem ShapeGeometry{telerik:Geometry TypeCloud} BackgroundDeepSkyBlue Foreground#FFFFFFFF ShapeWidth40 ShapeHeight30/ /telerik:RadStepProgressBar每个步骤都可以选择为了跟踪它的状态RadStepProgressBar 公开了三种方便的状态——NotStarted、Indeterminate 和 Completed选择一个步骤会将其状态更改为已完成。每个状态都会在阶梯形状内显示不同的指示符。调整内容每个指标都有内容完全可定制有一组基于步骤状态的 Content 和 ContentTemplate 属性NotStartedIndicatorContentNotStartedIndicatorContentTemplateIndeterminateIndicatorContentIndeterminateIndicatorContentTemplateCompletedIndicatorContentCompletedIndicatorContentTemplatetelerik:RadStepProgressBar Width300 SelectedItemStatusIndeterminate telerik:RadStepProgressBar.Resources DataTemplate x:KeyIndicatorContentTemplate TextBlock Text{Binding} Foreground#1fd6fc / /DataTemplate /telerik:RadStepProgressBar.Resources telerik:RadStepProgressBarItem NotStartedIndicatorContentN/A CompletedIndicatorContentYes IndeterminateIndicatorContent... CompletedIndicatorContentTemplate{StaticResource IndicatorContentTemplate} IndeterminateIndicatorContentTemplate{StaticResource IndicatorContentTemplate} / telerik:RadStepProgressBarItem NotStartedIndicatorContentN/A CompletedIndicatorContentYes IndeterminateIndicatorContent... CompletedIndicatorContentTemplate{StaticResource IndicatorContentTemplate} IndeterminateIndicatorContentTemplate{StaticResource IndicatorContentTemplate}/ telerik:RadStepProgressBarItem NotStartedIndicatorContentN/A CompletedIndicatorContentYes IndeterminateIndicatorContent? CompletedIndicatorContentTemplate{StaticResource IndicatorContentTemplate} IndeterminateIndicatorContentTemplate{StaticResource IndicatorContentTemplate}/ /telerik:RadStepProgressBar有关每个步骤的详细信息可以使用 Content 和 AdditionalContent 属性。自定义外观自定义 RadStepProgressBar 的外观很简单因为它提供了一组丰富的功能并且可以轻松使用。举例来说这里有一些场景说明了自定义 StepProgressBar 的外观和感觉的自由度。​​​​​​​Telerik UI for WPF拥有超过100个控件来创建美观、高性能的桌面应用程序同时还能快速构建企业级办公WPF应用程序。UI for WPF支持MVVM、触摸等创建的应用程序可靠且结构良好非常容易维护其直观的API将无缝地集成Visual Studio工具箱中。
返回列表