项目介绍

       水印相机APP是一个利用智能手机的摄像头为拍摄的照片添加本地时间、位置信息的应用。

主要功能包括：

1. 拍照功能：使用智能手机的摄像头拍摄照片。APP提供拍照界面，用户可以实时预览拍摄效果。
2. 保存：用户可以将带有水印的照片保存到手机相册。

总之，水印相机APP项目可以帮助用户为照片添加本地时间、位置信息水印。

平台支持

• Android

 AiFlutter市场链接：水印相机App

水印相机源码下载：源码下载

平台实现步骤

一、注册登录

打开 低代码平台登录网页 ，使用微信快捷登录或者扫描二维码登录。

二、创建项目

1. 点击【新增项目】>【手动添加】，在平台内部创建项目

​

2. 在跳出的弹窗中输入项目名称、项目描述，建议结合项目功能描述命名，便于检索

3. 输入完成后点击确定

三、页面设计

效果图

实现流程

1. 点击已经创建好的项目进入到操作界面，默认会存在一个HomePage页面，操作界面相关详情可查看教程 操作界面， 在【​页面管理】中单击HomePage页面，然后在右侧的属性编辑器中配置属性，属性信息如下：

2. 在【​页面管理】中单击HomePage页面，在右侧的属性编辑器中添加页面变量

需要定义的变量如下

操作成功如下

3. 添加页面初始化动作，在右侧的属性编辑器中点击【动作】> 【打开】

​

在操作流程编辑器中，页面初始化 事件下点击＋号添加事件，再点击＋号添加动作，动作按顺序依次添加如下

（1）动作类型 --【定位服务】，经度值绑定--【lon】，纬度值绑定 --【lat】，具体位置绑定 --【placeStr】

（2）动作类型 --【自定义代码块】，添加customCode1自定义代码块并选择

customCode1内容如下

void function(){

timer?.cancel();

      timer?.cancel();
      DateFormat df = DateFormat('yyyy-MM-dd HH:mm:ss');
      timer = Timer.periodic(Duration(seconds: 1), (timer) {
        if (mounted) {
          setState(() {
             time = df.format(DateTime.now());
          });
        }
      });

}

4. 页面内容设计

（1）从【​小部件面板】> 【常用元素】中选择【容器小部件】拖入到页面编辑窗口内的上下布局中，然后在右侧的属性编辑器中配置属性，属性信息如下：

​​​​（2）从【​小部件面板】> 【常用元素】中选择【上下布局小部件】拖入到页面编辑窗口内的【容器小部件】中

​​​​（3）从【​小部件面板】> 【基本元素】中选择【条件生成器小部件】拖入到页面编辑窗口内的【上下布局小部件】中，然后在右侧的属性编辑器中绑定变量_takeStatus

​​（4）当  _takeStatus = TakeStatus.confirm，从【​小部件面板】> 【常用元素】中选择【容器小部件】拖入到页面编辑窗口内的【条件生成器小部件】中，然后在右侧的属性编辑器中绑定变量

 （5）当  _takeStatus != TakeStatus.confirm，从【​小部件面板】> 【基本元素】中选择【左右布局小部件】拖入到页面编辑窗口内的【上下布局】中，然后在右侧的属性编辑器中配置属性，属性信息如下：

（6）从【​小部件面板】> 【布局元素】中选择【条件生成器小部件】拖入到【左右布局小部件】中，然后在右侧的属性编辑器中绑定变量_isTouchOn

（7）当  _isTouchOn = true，从【​小部件面板】> 【基本元素】中选择【按钮小部件】拖入到页面编辑窗口内的【条件生成器小部件】中，然后在右侧的属性编辑器中配置属性，属性信息如下：

按钮动作面板中打开动作流程编辑器，单击 事件下点击＋号添加事件，再点击＋号添加动作，信息如下

• 动作类型 --【硬件动作】，硬件类型 --【相机】，相机操作类型 --【拍照】，拍照操作 --【关闭闪光灯】

（8）从【​小部件面板】> 【常用元素】中选择【图标小部件】拖入到【按钮布局小部件】中，然后在右侧的属性编辑器中配置属性，属性信息如下：

（9）当  _isTouchOn = false，从【​小部件面板】> 【基本元素】中选择【按钮小部件】拖入到页面编辑窗口内的【条件生成器小部件】中，然后在右侧的属性编辑器中配置属性，属性信息如下：

​按钮动作面板中打开动作流程编辑器，单击 事件下点击＋号添加事件，再点击＋号添加动作，信息如下

• 动作类型 --【硬件动作】，硬件类型 --【相机】，相机操作类型 --【拍照】，拍照操作 --【打开闪光灯】

（10）从【​小部件面板】> 【常用元素】中选择【图标小部件】拖入到【按钮布局小部件】中，然后在右侧的属性编辑器中配置属性，属性信息如下：

​ （11）从【​小部件面板】> 【布局元素】中选择【条件生成器小部件】拖入到【左右布局小部件】中，然后在右侧的属性编辑器中绑定变量_isFrontCamera

 （12）当  _isFrontCamera = true，从【​小部件面板】> 【基本元素】中选择【按钮小部件】拖入到页面编辑窗口内的【条件生成器小部件】中，然后在右侧的属性编辑器中配置属性，属性信息如下：

按钮动作面板中打开动作流程编辑器，单击 事件下点击＋号添加事件，再点击＋号添加动作，信息如下

• 动作类型 --【硬件动作】，硬件类型 --【相机】，相机操作类型 --【拍照】，拍照操作 --【打开后置相机】

（13）从【​小部件面板】> 【常用元素】中选择【图标小部件】拖入到【按钮布局小部件】中，然后在右侧的属性编辑器中配置属性，属性信息如下：

（14）当  _isFrontCamera = false，从【​小部件面板】> 【基本元素】中选择【按钮小部件】拖入到页面编辑窗口内的【条件生成器小部件】中，然后在右侧的属性编辑器中配置属性，属性信息如下：

​按钮动作面板中打开动作流程编辑器，单击 事件下点击＋号添加事件，再点击＋号添加动作，信息如下

• 动作类型 --【硬件动作】，硬件类型 --【相机】，相机操作类型 --【拍照】，拍照操作 --【打开前置相机】

（15）从【​小部件面板】> 【常用元素】中选择【图标小部件】拖入到【按钮布局小部件】中，然后在右侧的属性编辑器中配置属性，属性信息如下：

​（16）从【​小部件面板】> 【交互行为】中选择【相机区域】拖入到【上下布局】中，然后在右侧的属性编辑器中配置属性，属性信息如下：

 ​（17）从【​小部件面板】> 【常用元素】中选择【文本小部件】拖入到【相机区域】中，然后在右侧的属性编辑器中配置属性，属性信息如下：

 ​（17）从【​小部件面板】> 【常用元素】中选择【文本小部件】拖入到【相机区域】中，然后在右侧的属性编辑器中配置属性，属性信息如下：

 ​（17）从【​小部件面板】> 【常用元素】中选择【文本小部件】拖入到【相机区域】中，然后在右侧的属性编辑器中配置属性，属性信息如下：

（18）从【​小部件面板】> 【基本元素】中选择【条件生成器小部件】拖入到页面编辑窗口内的【上下布局小部件】中，然后在右侧的属性编辑器中绑定变量_takeStatus

​​（19）当  _takeStatus != TakeStatus.confirm，从【​小部件面板】> 【基本元素】中选择【按钮小部件】拖入到页面编辑窗口内的【条件生成器小部件】中，然后在右侧的属性编辑器中配置属性，属性信息如下：

​按钮动作面板中打开动作流程编辑器，单击 事件下点击＋号添加事件，再点击＋号添加动作，信息如下

• 动作类型 --【硬件动作】，硬件类型 --【相机】，相机操作类型 --【拍照】，拍照操作 --【拍照】

（20）当  _takeStatus = TakeStatus.confirm，从【​小部件面板】> 【常用元素】中选择【左右布局小部件】拖入到【条件生成器小部件】中，然后在右侧的属性编辑器中配置属性，属性信息如下：

 ​​（21）从【​小部件面板】> 【基本元素】中选择【按钮小部件】拖入到页面编辑窗口内的【左右布局小部件】中，然后在右侧的属性编辑器中配置属性，属性信息如下：

​按钮动作面板中打开动作流程编辑器，单击 事件下点击＋号添加事件，再点击＋号添加动作，信息如下

• 动作类型 --【硬件动作】，硬件类型 --【相机】，相机操作类型 --【拍照】，拍照操作 --【取消拍照】

（22）从【​小部件面板】> 【常用元素】中选择【图标小部件】拖入到【按钮布局小部件】中，然后在右侧的属性编辑器中配置属性，属性信息如下：

 （23）从【​小部件面板】> 【基本元素】中选择【按钮小部件】拖入到页面编辑窗口内的【左右布局小部件】中，然后在右侧的属性编辑器中配置属性，属性信息如下：

​按钮动作面板中打开动作流程编辑器，单击 事件下点击＋号添加事件，再点击＋号添加动作，信息如下

• 动作类型 --【硬件动作】，硬件类型 --【相机】，相机操作类型 --【拍照】，拍照操作 --【确认拍照】

（24）从【​小部件面板】> 【常用元素】中选择【图标小部件】拖入到【按钮布局小部件】中，然后在右侧的属性编辑器中配置属性，属性信息如下：