Blazor ColorGradient概述

的Blazor的ColorGradient控件中选择颜色HSVAcanvas，或输入特定的RGB/HEX颜色值。相比之下ColorPalette组件， ColorGradient允许从无限数量的颜色中进行选择。高级用户也可能更喜欢它。

ColorGradient组件是Blazor的Telerik UI，一个专业级的UI库，包含100个本地组件，用于构建现代和功能丰富的应用程序。想要试用它，可以注册一个30天的免费试用期。

下载免费试用

在本文中:

• 基础知识
• 例子
• 特性
• 使用多种输入格式
• 支持的值格式

基础知识

为Blazor使用Telerik ColorGradient:

1. 添加TelerikColorGradient标签。
2. 设置它价值属性的十六进制/ RGB字符串变量通过单向或双向绑定。
3. (可选)设置ValueFormat而且格式attrbutes到所需的颜色格式。

例子

这里是一个ColorGradient声明和生成的UI。

@* Blazor ColorGradient *@  @code {string值{get;设置;} = "rgb(40,47,137)";｝

特性

ColorGradient通过其属性公开了以下特性:

• 价值-字符串-设置ColorGradient值不同的颜色格式．支持双向绑定。
• 格式-IEnumerable < ColorFormat >-定义可用的颜色格式，用户可以看到，切换和编辑通过输入。这两个十六进制而且Rgb格式是默认启用的，用户可以用一个按钮在它们之间切换。
• 格式-ColorFormat-指定用户使用的值格式最初看到（ColorFormat。Rgb默认情况下)。支持双向绑定。的Rgb输入格式允许用上/下方向键改变文本框的值。
• ValueFormat-ColorFormat-设置颜色格式组件将返回在应用程序代码中(ColorFormat。Rgb默认情况下)。
• ShowOpacityEditor-保龄球-指定用户是否可以添加不透明度(透明度)到颜色值(真正的默认情况下)。

支持的值格式

ColorGradient接受应用程序代码中以下格式的值:

• 十六进制
  • 3位数-# f00
  • 6位数-# ff0000
  • 8位数字，包括alpha透明度-# ff000080
• RGB或RGBA
  • 整型颜色值-Rgb (255,0,0)
  • 百分比颜色值-Rgb (100%， 0%， 0%)
  • alpha不透明度必须始终是0到1 -之间的十进制数Rgba (100%， 0%， 0%， 0.5)．注意rgba ()符号，与rgb ()以上。

用户可以输入以下格式的值:

• 所有的十六进制
• RGB和RGBA的整型颜色值

不支持颜色关键字。如果这是首选的用例场景，请考虑ColorPalette组件．

另请参阅

• ColorGradient事件
• ColorGradient现场演示