演练：创建第一个应用程序

在本教程中，您将：-在步骤上显示消息 - 输入自定义消息- 创建消息计数 - 记录最近显示消息的日期和时间。

在本练习中，您将通过构建多个功能完善的应用程序组件来学习应用程序的基础知识。

练习结束后，您将得到一个 Hello World 应用程序，它看起来像这样：

{height="" width="""}

练习 1：创建 Hello World 应用程序

在本练习中，您将创建一个简单的应用程序，通过按钮触发器显示一条消息。

创建应用程序

1. 在 "应用程序"选项卡中，单击 "应用程序"。
2. 单击右上角的**+ 创建应用程序**。
3. 将应用程序命名为 "Hello World - 示例"。您还可以选择添加说明，以便其他用户了解此应用程序的用途。
4. 单击**+ 创建**。在应用程序详细信息页面，您可以单击右上角的编辑，或单击无标题步骤名称进入应用程序编辑器。在构建任何内容之前，让我们为基础布局添加一些基本设计元素。

设计基本布局

1. 从左侧的 "步骤"选项卡中，选择 "基本布局"。
2. 单击图标，然后选择一个矩形。调整矩形的宽度，使其横跨整个应用屏幕，然后单击并将其拖动到屏幕顶部。要更改矩形的颜色，请单击 "小工具"选项卡中的 "填充"方框，然后选择淡灰色。
3. 选择形状并按CTRL/CMD + C复制。将第二个矩形拖到屏幕底部。
4. 单击 "输入 "并选择 "变量"。在 "小工具"选项卡中，单击 "选择数据源"字段。单击App Info旁边的箭头，然后选择App 名称。
5. 单击并拖动变量到左上角的矩形顶部。
6. 再添加两个变量：
7. 从应用程序信息数据源列表中选择步骤名称。将此变量置于右上角。
8. 从应用程序信息数据源列表中选择已登录用户。将此变量置于左下角。
9. 最后，单击按钮并选择菜单。单击并拖动按钮到屏幕底部。

您的基本布局将如下所示：

接下来，我们将在一个步骤上构建功能。

添加 hello world 按钮

1. 在 "步骤"选项卡中，选择 "无标题步骤"。双击它以重命名，然后输入 "显示消息"。
2. 单击 "按钮"并选择 "按钮"。使用按钮周围的方格调整按钮大小，使其更大。将按钮置于屏幕中央。{height="" width="""}
3. 为按钮添加以下样式：
4. 文本 - "Hello World
5. 按钮颜色 - 绿色
6. 图标 - 平移工具

按钮外观如下：

接下来，我们将为该按钮添加一个触发器，使其发挥作用。

添加按钮触发器

1. 选择 "Hello World "按钮，然后导航到 "Widget"选项卡中的 "触发器"部分。单击**+**添加新触发器。{height="" width="""}
2. 将触发器命名为 "Hello world"。
3. 在 Then 语句中，添加以下逻辑**：显示消息→静态值→文本**→ "Hello World"

您的触发器应符合以下内容：

1. 单击保存。

测试应用程序时，其操作如下：

练习 2：存储输入数据

在本练习中，您将建立将输入文本存储到变量中的逻辑。

1. 添加一个新步骤，并将其命名为 "存储信息"。
2. 单击 "**输入 "**并选择 "文本"。
3. 在 "小工具"选项卡中，单击数据源框。选择**+ 添加变量**。
4. 将变量命名为 "信息"，然后单击**+ 创建**。

测试应用程序时，输入的文本会保存到变量 "message "中。您可以在 "开发者模式 "窗口左侧的 "变量"面板中看到存储的值。{height="" width="""}

练习 3：计算打招呼的次数

在本练习中，您将创建一个分析，计算 "Hello world"按钮被按下的次数。

1. 在 "显示消息"步骤中，单击 "嵌入"并选择 "分析"。单击并拖动 Widget 到Hello world按钮的左侧。
2. 单击 "选择分析"，然后单击 "创建分析"。
3. 单击显示类型下拉菜单并选择单值。
4. 单击操作选项卡并添加新操作。
5. 选择聚合函数，然后选择记录计数。{height="" width="""}
6. 单击编辑器右侧的侧箭头，展开可视化窗格。在**"值**"下方，单击**+ 添加字段**并选择 "记录数"。{height="" width="""}
7. 单击分析标题并将其重命名为 "Count of hellos"（打招呼次数），然后单击保存。
8. 单击右上角的 "保存并关闭"。

由于在 "开发者模式 "下不会保存完成，因此请单击 "运行 "在郁金香播放器中测试该分析。

练习 4：使用表达式计算最后一个 hello

在本练习中，您将在触发器中编写一个表达式，存储到一个变量中，以显示应用程序最后一次说 hello 的时间。

1. 在侧窗格中，导航到应用程序选项卡。
2. 在变量旁边，选择X。
3. 单击**+ 创建变量**。
4. 将变量命名为 "上次说你好"，然后单击**+ 创建**。
5. 在 "显示消息"步骤中，单击 "世界你好 "按钮并添加新的触发器。
6. 在触发器中添加以下操作**：数据操作→存储→表达式**：'您最后一次说你好是在' + ' ' + App Info.Current Date and Time.Current Time →变量→ 您最后一次说你好

1. 在 "打招呼次数"步骤中，单击文本并选择变量。
2. 在数据选项下的侧窗格中，单击空白数据源字段，然后选择上次说你好变量。

测试应用时，表达式会保存到变量Last time you said hello中，并显示为时间戳。

下一步

现在您已经创建了第一个应用程序，请在此了解如何发布和运行它。

了解有关应用程序构建的更多信息：*应用程序构建基础知识* Tulip 应用程序编辑器介绍* 如何设计有效的基础布局

成为 Tulip 认证的应用程序构建者：基本应用程序构建者认证

找到您想要的内容了吗？

您还可以前往community.tulip.co发布您的问题，或查看其他人是否遇到过类似问题！