跳到主要内容

Markdown 文本框

本节主要介绍 AppStudio 控件库里的 Markdown 文本框控件。

MarkDown 文本框控件
MarkDown 文本框控件

属性

CloudPSS 提供了一套统一的控件属性参数

通用样式

参数名键值 (key)单位备注类型描述
缩放比例$scale输入控件缩放比例常量输入缩放比例数值,控件按照比例放大或者缩小,默认为 1 倍大小
是否隐藏hidden选择是否隐藏控件选择选择隐藏或者显示隐藏当前控件,或者显示当前控件,默认为显示状态

样式

参数名键值 (key)单位备注类型描述
文字字号style/font-size输入文字字号常量输入文字字号
文字颜色style/color选择文字颜色颜色选择器点击文字颜色,弹出颜色选择器自定义颜色
背景style/background样式背景颜色选择器点击文字颜色,弹出颜色选择器自定义背景颜色
链接悬浮颜色style/--cwe-markdown-link-hover-color链接悬浮颜色颜色选择器点击文字颜色,弹出颜色选择器自定义链接悬浮颜色
链接活动颜色style/--cwe-markdown-link-active-color链接活动颜色颜色选择器点击文字颜色,弹出颜色选择器自定义链接活动颜色
标题颜色style/--cwe-markdown-header-color标题颜色颜色选择器点击文字颜色,弹出颜色选择器自定义标题颜色
pre边框颜色style/--cwe-markdown-pre-border-colorpre边框颜色颜色选择器点击文字颜色,弹出颜色选择器自定义pre边框颜色
pre背景颜色style/--cwe-markdown-pre-background-colorpre背景颜色颜色选择器点击文字颜色,弹出颜色选择器自定义pre背景颜色
代码颜色style/--cwe-markdown-code-color代码颜色颜色选择器点击文字颜色,弹出颜色选择器自定义代码颜色
代码块边框颜色style/--cwe-markdown-code-border-color代码块边框颜色颜色选择器点击文字颜色,弹出颜色选择器自定义代码块边框颜色
引用主题颜色style/--cwe-markdown-blockquote-theme-color引用主题颜色颜色选择器点击文字颜色,弹出颜色选择器自定义引用主题颜色
高亮背景颜色style/--cwe-markdown-mark-background-color高亮背景颜色颜色选择器点击文字颜色,弹出颜色选择器自定义高亮背景颜色
表头背景颜色style/--cwe-markdown-table-header-background-color表头背景颜色颜色选择器点击文字颜色,弹出颜色选择器自定义表头背景颜色
表格边框颜色style/--cwe-markdown-table-header-border-color表格边框颜色颜色选择器点击文字颜色,弹出颜色选择器自定义表格边框颜色
分割线颜色style/--cwe-markdown-divider-color分割线颜色颜色选择器点击文字颜色,弹出颜色选择器自定义分割线颜色

内容

参数名键值 (key)单位备注类型描述
srcdocMarkdown 文本框控件内容表格点击编辑数据按钮,弹出 Markdown 文本框控件内容表格
溢出显示style/overflowMarkdown 文本框控件溢出显示方式选择文本溢出显示方式分为:自动、滚动、可见、隐藏,默认为自动

案例介绍

典型应用

  1. 创建一个 MarkDown 文本框控件,在右侧的属性配置区内给 MarkDown 文本框命名为 A

  2. 创建静态资源 asset1,值设置为 This is a demo...

  3. 将输入框 A 的内容/值属性切换到 fx 表达式模式,设置为 $asset1.value

  4. 点击工具栏的预览快捷按钮(或者 Ctrl + P ),进入预览模式,在预览模式下显示 MarkDown 文本框 A 的内容

创建 MarkDown 文本框控件
创建 MarkDown 文本框控件
创建静态资源
创建静态资源
配置 MarkDown 文本框属性
配置 MarkDown 文本框属性
预览模式
预览模式
典型应用使用详情

常见问题

什么是事件触发机制?

AppStudio 场景标签页内控件的属性有两种输入模式,一种是 (x) 值输入模式,另一种是 f(x) 表达式输入模式。 值输入模式是通过在属性框内直接输入值来配置控件属性,表达式输入模式则是在属性框内输入由变量/函数资源键名、控件属性键名构成的 math.js 表达式,通过表达式解析器计算出表达式的值来配置控件属性值。详情参见 控件属性的表达式输入

(x) 与 f(x) 的区别

事件是指对控件操作后产生的效果,事件触发使用 HTML 元素事件触发的回调函数结合 math.js 的表达式解析器进行控件属性或者资源的调用。详情参考 事件触发机制