ToB企服应用市场:ToB评测及商务社交产业平台
标题:
Avalonia系列文章之控件简介
[打印本页]
作者:
曂沅仴駦
时间:
2025-2-12 15:16
标题:
Avalonia系列文章之控件简介
对于GUI(图形用户页面)步调来说,控件是创建用户页面的基本构建块,差别的控件代表差别的功能,如按钮,文本框,滑块等。在Avalonia UI中,了解控件的使用及其特性对于创建应用步调至关重要。
什么是控件?
在图形用户页面出现之前,步调的输入输出都是通过命令行举行,输入输出的数据都是最原始的方式。在图形用户页面出现以后,输入输出变得越来越友好,且丰富多样,不仅可以输出格式化表格,图表,以及图像等形式,还能担当用户的输入指令,而这些输入输出都是通过控件实现的。在GUI步调中,控件是用户页面的基本元素,它提供输入,输出,以及操纵数据的功能,所以它答应用户与应用步调举行交互,根据控件的目的和行为,可以分为以下几类:
按钮(Button),按钮常用于在单击或触摸时触发操纵。它们可以包含文本、图标或两者,并经常用于提交表单、打开对话框或实行命令等任务。
文本框(TextBox),文本框答应用户输入和编辑文本。它们用于捕获用户输入,例如用户名、暗码或任何形式的文本信息。文本框还可以根据特定输入模式和验证举行自定义。
标签(Label),标签用于表现静态文本或其他控件的标题。它们为用户提供额外的信息或上下文,通常是不可交互的。
复选框(CheckBox)和单选按钮(RadioButton),复选框和单选按钮用于选择和多选项。复选框答应用户选择一个或多个选项,而单选按钮答应用户从一组选项中选择一个。
滑动条(Slider),滑动条用于从范围中选择一个值。它们提供了一个可视化表现值的方式,可以通过拖动滑块的手柄来调解值。滑块通常用于设置诸如音量控制或图像调解等设置。
列表框(ListBox)和下来列表框(ComboBox),列表框和下拉列表框答应用户从列表或下拉菜单中选择项目。列表框同时表现多个项目,而下拉列表框在初始状态下表现一个项目,并在点击时展开表现列表。
上述列举的控件,是Avalonia UI中常用的一些控件,每个控件都有本身的一组属性,方法,和变乱,答应开发人员根据应用步调的需求举行使用。
内置控件
在Avalonia UI中,提供了很多内置控件,可以直接使用,大要上可以分为以下几种类型:
绘制控件(Drawn Controls),绘制控件负责生成其本身的多少图形或位图举行渲染,这些控件的示例包罗Border,TextBlock,Image等。绘制控件是用于构建其他全部内容的底子控件。大多数的绘制控件具有可以调解其外观和大小的标准属性,但它们不答应重新模板化。
布局控件(Layout Controls),布局控件是特殊的,它本身没有外观,但它可以定义子元素的布局,并充当父容器。子控件负责渲染UI,而布局父控件只设置大小和位置。
用户控件(User Controls),Avalonia UI自身不会提供User Control,因为本身就是个性化的体现,并不具备通用性。
模板化控件(Templated Controls ),在Avalonia UI中,大部分的标准控件都是模板化控件,在应用步调开发中,可以更改模板化控件的XAML模板,使其外观发生改变,而这也是基于XAML的UI框架中最强盛的功能之一。
布局控件
常用的布局控件如下所示:
Border 用边框和背景装饰单个子元素。
Canvas 在指定位置表现子控件。
Dock Panel 将子控件沿指定边缘(顶部、底部、左侧、右侧)排列,并使其中一个填充剩余空间。
Expander 具有标题区域(始终可见)和可折叠的内容区域(单个子元素)。
Grid 将子控件排列在网格的单元格中,按行和列定位。单元格可以跨行和跨列。
Grid Splitter 可以添加到网格中,答应用户在运行时调解行或列大小。
Panel 将子控件堆叠在一起。
Relative Panel 答应多个子控件。子控件的位置和对齐方式可以相对于面板本身指定,也可以相对于其他子控件指定。可以指定子控件的大小,也可以根据关系和对齐方式盘算大小。
Scroll Viewer 如果(单个)子控件大于可用空间,则添加滚动条和滚动行为。
Split View 在其(单个子控件)内容区域的边缘添加可折叠的窗格。
Stack Panel 答应多个子控件,按顺序水平或垂直排列。
Tab Control 标签控件答应将视图细分为标签项。
Uniform Grid 答应多个子控件,以网格形式排列,单元格具有统一的列和行大小。
Wrap Panel 将子控件从左到右按顺序排列,当宽度不足时,换行表现。
按钮
常用的按钮如下所示:
Button 基本按钮控件 - 可以表现文本、图标或两者。具有标准的“点击”行为。
Repeat Button 按钮在按下并保持按住时重复引发其点击变乱。
Radio Button 按钮具有选中状态。它可以放置在一组中,以使一个按钮的选择取消全部其他按钮的选择。
Toggle Button 按钮具有选中状态和未选中状态。后续点击“切换”此状态。通过“checked”伪类可以为选中状态和未选中状态分配差别的样式。
Button Spinner 一个带有两个旋转按钮和内容区域的控件。
Split Button 此按钮具有重要和次要部分,可以独立按下。重要部分的行为类似于标准按钮,而次要部分则打开一个带有附加操纵的弹出菜单。
Toggle Split Button 此按钮具有重要和次要部分,可以独立按下。重要部分的行为类似于切换按钮,而次要部分打开一个带有附加操纵的弹出菜单。
重复数据控件
对于重复的,固定格式的数据表现,常见的控件如下所示:
Data Grid 在可自定义的网格中表现数据。
Items Control 表现来自绑定命据源的项目聚集。
Items Repeater 表现来自绑定命据源的重复数据。它具有布局模板和数据模板。
List Box 一个包含可选择项的控件。
Combo Box 一个带有下拉列表的控件,其中的项目可以选择。
文本表现和编辑控件
文本表现和编辑控件是最常用的控件之一,也相对比较简单,重要有以下几个:
Auto Complete Box 一个表现文本框用于用户输入和一个下拉框,其中包含根据已输入内容可能匹配的项的控件。
Text Block 用于表现文本块的控件。只读。
Text Box 用于表现或编辑文本的控件,没有格式限制。
Masked Text Box 用于在掩码中表现文本;或用于使用掩码编辑文本,以防止无效的用户输入。
值选择控件
值选择控件常用于可枚举的类型的值,重要有以下几种:
Check Box , 值类型为Boolean 以勾选标志形式表现的 True 值。点击交互切换值。具有表现“未知”值的选项。
Slider , 值类型为Double 相对于最大值和最小值的相对值,以滑动条按钮在滑动条轨道上的位置表现。拖动滑动条按钮可以在最大值和最小值之间更改值。键盘和点击交互也可以微调值。
Calendar , 值类型为DateTime 日历是用户选择日期或日期范围的控件。
Calendar Date Picker , 值类型为DateTime 日期选择器的扩展,包罗文本框和按钮。
Color Picker, 值类型为Color / HsvColor 颜色选择器支持用户使用光谱、调色板和组件滑块选择和编辑颜色。它还支持可选的 alpha 分量、RGB 或 HSV 颜色模型和十六进制颜色值。
Date Picker , 值类型为DateTime 日期选择器有三个“微调”控件,答应用户选择日期值。
Time Picker , 值类型为TimeSpan 时间选择器有三个“微调”控件,答应用户选择小时、分钟和秒钟。
图像控件
图像控件通常用于表现位图或矢量图,常用的控件为:
Image 表现位图或矢量图像。
Path Icon 使用当前的Foreground绘制矢量图像。
菜单和弹出框
菜单也是比较常用的控件之一,重要有以下几种:
Menu 表现应用步调菜单。
Flyouts 将弹出菜单或上下文菜单附加到控件。
Tool Tip 当鼠标悬停在控件上时表现工具提示。
创建控件
在实际应用中,如果默认提供的控件不能满足业务需求,则需要创建新的控件,创建控件重要分为四个步骤:
选择自定义控件的类型
Avalonia提供了多种方法来创建自定义控件以满足应用步调的特定需求,常见的自定义控件类型有用户控件(UserControl),模板控件(TemplatedControl)和自绘控件。
用户控件(UserControl),用户控件是在Avalonia中创建自定义控件的一种高级方法。它答应您通过组合现有控件并使用XAML定义布局来构建一个控件。用户控件充当一个容器,封装了多个控件,并提供了一个连贯的用户界面。创建用户控件的步骤如下:
定义XAML:创建一个新的UserControl XAML文件,通过放置控件、设置属性和应用样式来定义控件的布局和外观。
Code-behind:可选项,您可以定义额外的代码后台逻辑来处理变乱、修改行为或为用户控件提供额外的功能。
重用和定制: 用户控件可以在应用步调中轻松重用和定制。当您希望封装一组特定的控件和行为为可重用的组件或"视图"时,它们特殊有用。
模板控件(TemplatedControl),模板控件(也称为“Lookless控件”)为在Avalonia中创建自定义控件提供了更高级和可自定义的方法。模板控件将控件的行为和逻辑与其可视外观分离,答应应用步调开发人员通过控件模板举行样式化和模板化。对于模板控件,您在code-behind类中定义控件的行为和属性,而视觉外观则通过在XAML中定义控件模板来指定。这种分离答应应用步调开发人员自定义控件的外观和给人的感觉,而不会修改其底层行为。创建模板控件需要以下步骤:
定义控件类:创建一个新的类,该类派生自TemplatedControl。这个类定义了控件的行为、属性和变乱。
控件模板:在XAML中创建一个ControlTheme,指定控件的视觉外观和结构。控件模板定义了控件的部分以及它们应该怎样被样式化。
样式和模板化:应用步调开发人员可以通过修改控件模板或应用样式来自定义控件的外观。这样可以实现应用步调中统一和统一的视觉计划。
模板控件提供了更大的机动性和可重用性,使它们非常适合您希望提供一个可以根据差别视觉主题举行样式化或适应各种用户偏好的控件的场景。
自绘控件,自绘控件在Avalonia中提供了最高级别的定制。使用自绘控件,您可以完全控制控件的视觉元素的渲染,从而创建独特而复杂的视觉外观。要创建自绘控件,您需要重写控件的Render方法,并使用低级别的绘制API(例如DrawingContext)来定义控件的外观。这种方法可以对控件的每个像素举行精细控制,实现高度个性化的可视化。创建自绘控件的步骤如下:
定义控件类:创建一个新的类,该类派生自Control。这个类将定义控件的行为和渲染逻辑。
重写Render方法:在控件类中重写Render方法,并使用DrawingContext来绘制控件的内容。
定义属性
在Avalonia UI中,控件的属性可以设置控件的行为和外观,而样式化属性为控件提供了一种强盛而机动的属性定义方式。这些属性专门计划用于支持Avalonia的样式化系统和数据绑定。样式化属性通过使用AvaloniaProperty类举行注册,它具有如下特点:
样式支持:可以通过样式和在XAML或编程中定义的setter轻松地举行定位和修改。
继承:支持继承,这意味着在父控件上定义的属性值可以自动继承到其子控件上,除非明确覆盖。
默认值:可以在控件级别或控件模板中指定默认值,确保在多个控件实例中保持划一的行为。
属性值优先级:它们遵循明确定义的优先级顺序,答应根据当地值、样式setter、触发器和默认值等因素解析值。
验证和强制转换:样式化属性答应控件验证和强制转换传递给它的值,确保控件永久不会处于无效状态。
在Avalonia中,样式化属性通常用于控件的属性,这些属性旨在通过样式轻松定制,从而实现基于各种条件的外观和行为的动态变化。样式化属性定义示例如下所示:
public class MyCustomButton : Button
{
public static readonly StyledProperty<int> RepeatCountProperty =
AvaloniaProperty.Register<MyCustomButton, int>(nameof(RepeatCount), defaultValue: 1);
public int RepeatCount
{
get => GetValue(RepeatCountProperty);
set => SetValue(RepeatCountProperty, value);
}
}
复制代码
在此示例中,为MyCustomButton控件定义了一个名为RepeatCount的自定义整数属性。该属性通过AvaloniaProperty系统举行注册,使得用户可以访问、修改、应用样式和举行数据绑定。还定义了CLR属性,以方便使用该属性,使其在使用上与标准.NET API划一。
定义变乱
通过定义变乱,可以为控件的使用者提供一种在应用步调中响应和处理这些变乱的方法。路由变乱提供了一种处理变乱的机制,这些变乱可以在控件树中传播(或“路由”),答应多个控件对雷同的变乱做出响应。路由变乱提供以下关键特性:
变乱路由:路由变乱可以沿着树向上(冒泡)或向下(隧道)传播,使得差别级别的控件可以处理雷同的变乱。这答应更机动和会合的变乱处理。
变乱处理步调:路由变乱使用变乱处理步调来响应变乱。变乱处理步调可以与特定控件关联,也可以附加到视觉树中的更高级别以处理来自多个控件的变乱。
已处理状态:路由变乱具有Handled属性,可用于标志变乱为已处理,制止进一步的传播。这答应对变乱处理举行精细的控制。
变乱路由策略:Avalonia支持差别的路由策略,如冒泡、隧道和直接路由。这些策略决定了控件接收和处理变乱的顺序。 Avalonia的路由变乱在需要处理可能发生在嵌套控件内部的变乱时特殊有用,大概当您希望在视觉树的较高级别会合变乱处理逻辑时。
路由变乱示例如下所示:
public class MyCustomSlider : Control
{
public static readonly RoutedEvent<RoutedEventArgs> ValueChangedEvent =
RoutedEvent.Register<MyCustomSlider, RoutedEventArgs>(nameof(ValueChanged), RoutingStrategies.Direct);
public event EventHandler<RoutedEventArgs> ValueChanged
{
add => AddHandler(ValueChangedEvent, value);
remove => RemoveHandler(ValueChangedEvent, value);
}
protected virtual void OnValueChanged()
{
RoutedEventArgs args = new RoutedEventArgs(ValueChangedEvent);
RaiseEvent(args);
}
}
复制代码
在此示例中,为MyCustomSlider控件定义了一个名为ValueChangedEvent的自定义路由变乱。该变乱通过RoutedEvent系统举行注册,使得用户可以订阅它。还定义了CLR变乱,以方便使用该变乱,使其在使用上与标准.NET API划一。
定义控件主题
Avalonia答应自定义控件主题,以定制控件的外观和样式。特殊地,无外观的控件(lookless control)在没有控件主题的情况下将没有任何视觉外观;但是您可以为全部类型的控件定义控件主题。
以上就是《Avalonia系列文章之控件简介》的全部内容,旨在抛砖引玉,一起学习,共同进步,更多内容,请参考
官方文档
免责声明:如果侵犯了您的权益,请联系站长,我们会及时删除侵权内容,谢谢合作!更多信息从访问主页:qidao123.com:ToB企服之家,中国第一个企服评测及商务社交产业平台。
欢迎光临 ToB企服应用市场:ToB评测及商务社交产业平台 (https://dis.qidao123.com/)
Powered by Discuz! X3.4