快速入门

---

应用构建工具提供的教程可指导您完成创建包含数字输入框、按钮及曲线图的简单 APP 的过程。数字输入框用来支持用户的参数输入，按钮支持用户触发提交，曲线图显示结果。您可通过执行此处所列的教程步骤创建此 APP。

步骤一：搭建界面

APP 需要三个数字输入框，一个按钮，一个曲线图。要添加组件，请将组件从组件库拖到 APP 画布上。然后，您可以单击选中组件，在右侧属性面板中设置属性，或直接在画布上编辑组件的某些方面（如大小和位置），来更改该组件的外观。

创建数字输入框组件

从左侧组件库中拖入数字输入框，单击选中输入框，在出现的右侧面板中的定制属性一栏，label 属性内设置为"振幅"，第一个输入框完成定义。依次添加振幅，频率，采样率三个组件，并设置其 label 。

设置数字输入框组件默认值

振幅，频率，采样率三个组件的默认值需要调整一下，继续选中输入框组件，在右侧属性面板中，定制属性 value 一栏输入合适的默认值，这里设置成振幅为 1 ，频率为 10 ，采样率为 1000 。

添加绘图按钮

从左侧组件库中，拖入按钮组件放置到合适的位置。然后选中组件，在右侧属性面板-定制属性，设置其内容，可以更改按钮的显示文本。这里改成"绘图"。

添加曲线图组件

曲线图组件用于将数据以图形化的形式呈现。从左侧组件库中找到曲线图组件，拖入到画布中去。

步骤二：添加按钮的回调函数

使用回调函数对 APP 行为进行编程。回调函数是当 APP 用户执行特定交互时执行的函数。 选中绘图按钮，右侧属性面板中有事件回调方法一栏，展开可看到对特定事件的回调函数编辑按钮。

单击编辑按钮，弹出回调方法编写弹窗。在此处，我们需要编写代码实现取参，计算，呈现等逻辑。

目前仅支持 Julia 语言，可将以下代码粘贴进入回调方法中。

using TyDSPSystem
amplitude = VInputNumber["value"]
frequency = VInputNumber1["value"]
samplesPerFrame = VInputNumber2["value"]
sine1 = dsp_SineWave(Amplitude=amplitude,Frequency=frequency,SamplesPerFrame=samplesPerFrame)
y = step(sine1)
x = LinRange(0, samplesPerFrame, samplesPerFrame)
VPlot["lineDatas"] = [Dict("x" => x, "y" => y, "name" => "正弦曲线")]

单击确定，即可完成回调函数编写。

步骤三：打包构建

在工具栏区域找到构建按钮，单击打开构建参数输入弹窗，输入构建参数，参照下图所示。

单击开始构建，当打包完成，右下角弹出成功提示，显示 APP 安装文件位置。

步骤四：安装运行

在左侧资源管理器打开生成的 APP 安装文件目录位置，右键安装文件，单击安装扩展 VSIX。

安装成功后，右下角弹出安装成功提示

安装成功后，使用快捷键 Ctrl+Shift+P ，弹出命令输入框，输入我们打包构建输入的 AppId 。

回车，弹出 APP 窗口，呈现形式正如我们摆放的一样。

单击绘图按钮，如下结果。

更换参数，振幅2，频率30，采样率1000。计算得出如下结果。