超链接
本节主要介绍 AppStudio 控件库里的超链接控件。
属性
CloudPSS 提供了一套统一的控件属性参数
通用样式
参数名 | 键值 (key) | 单位 | 备注 | 类型 | 描述 |
---|---|---|---|---|---|
是否隐藏 | hidden | 选择是否隐藏控件 | 选择 | 选择隐藏或者显示,隐藏当前控件,或者显示当前控件,默认为显示状态 | |
透明度 | style/opacity | 输入透明度 | 常量 | 输入透明度值,控件按照透明度值变化,范围为0~1 ,默认为 1 |
样式
参数名 | 键值 (key) | 单位 | 备注 | 类型 | 描述 |
---|---|---|---|---|---|
大小 | size | 选择样式大小 | 选择 | 样式大小:S、M、L、XL,默认为 M | |
下划线 | attribute/quiet | 下划线开关 | 开关 | 默认为否,不显示下划线 | |
背景 | attribute/over-background | 背景开关 | 开关 | 默认为否 |
文本样式
参数名 | 键值 (key) | 单位 | 备注 | 类型 | 描述 |
---|---|---|---|---|---|
文字字体 | style/font-family | 选择文字字体 | 选择 | 标签文字字体样式,字体类型包括:默认、宋体、黑体、楷体、微软雅黑、Georgia、Palatino Linotype、Times New Roman、Arial、Arial Black、Verdana、Courier New、Trebuchet MS | |
文字间距 | style/letter-spacing | 输入文字间距 | 常量 | 文字间距 | |
文字字号 | style/font-size | 输入文字字号 | 常量 | 输入文字字号 | |
默认颜色 | style/--spectrum-link-primary-m-text-color | 文本默认颜色 | 颜色选择器 | 点击默认颜色,弹出颜色选择器自定义文本默认颜色 | |
按下颜色 | style/--spectrum-link-primary-m-text-color-down | 文本按下颜色 | 颜色选择器 | 点击按下颜色,弹出颜色选择器自定义文本按下颜色 | |
悬浮颜色 | style/--spectrum-link-primary-m-text-color-hover | 文本悬浮颜色 | 颜色选择器 | 点击悬浮颜色,弹出颜色选择器自定义文本悬浮颜色 | |
文字粗细 | style/font-weight | 选择文字粗细 | 选择 | 选择标签文字粗细,默认、100、200、300、400、500、600、700、800、900、1000 |
内容
参数名 | 键值 (key) | 单位 | 备注 | 类型 | 描述 |
---|---|---|---|---|---|
文本 | innerText | 控件文本内容 | 常量 | 按钮控件文本内容,默认为:Click Me! | |
链接 | href | 控件链接 | 常量 | 按钮控件链接 | |
目标 | target | 超链接 | 常量 | 超链接打开的位置:_blank 表示在新窗口打开;self 表示在当前窗口打开;默认为 _blank | |
禁用 | disabled | 禁用开关 | 开关 | 禁用选择开或者关,开启后控件禁止点击和交互,默认为关 |
事件
参数名 | 键值 (key) | 单位 | 备注 | 类型 | 描述 |
---|---|---|---|---|---|
点击 | @click | 当点击时触发 | 函数 | 采用点击方式触发函数 |
案例介绍
跳转链接到 CloudPSS 首页
-
创建一个超链接控件,在右侧的属性配置区内给超链接命名为 A
-
鼠标选中超链接 A 的内容/链接属性栏,输入
https://www.cloudpss.net
-
点击工具栏的预览快捷超链接(或者 Ctrl + P ),进入预览模式,点击超链接即可跳转到 CloudPSS 首页
常见问题
- 什么是事件触发机制?
-
AppStudio 场景标签页内控件的属性有两种输入模式,一种是 (x) 值输入模式,另一种是 f(x) 表达式输入模式。 值输入模式是通过在属性框内直接输入值来配置控件属性,表达式输入模式则是在属性框内输入由变量/函数资源键名、控件属性键名构成的 math.js 表达式,通过表达式解析器计算出表达式的值来配置控件属性值。详情参见 控件属性的表达式输入
- (x) 与 f(x) 的区别
-
事件是指对控件操作后产生的效果,事件触发使用 HTML 元素事件触发的回调函数结合 math.js 的表达式解析器进行控件属性或者资源的调用。详情参考 事件触发机制