当前位置: 首页 > news >正文

用 .NET MAUI 10 + VS Copilot 从 0 开发一个签到 App(三)

用 .NET MAUI 10 + VS Copilot 从 0 开发一个签到 App(三)

一、本文目标

从这一篇开始,我们正式进入业务功能开发

本文将完成一个最重要的里程碑:

使用 Visual Studio Copilot,从 0 生成一个“可用但不幼稚”的签到页面

读完本文,你将看到:

  • Copilot 在 MAUI + XAML 中能做到什么程度
  • 哪些代码“看起来对,但实际不该直接用”
  • 一个真实项目中,如何控制 Copilot 的参与边界

二、签到页面的设计目标

在写任何代码之前,先明确目标。

这个签到页面需要做到:

  • 一个明确的页面标题
  • 一个「签到」按钮
  • 当前用户最近一次签到时间
  • 不引入复杂 UI 动效

这是一个典型的业务页面,而不是 Demo 展示页。


三、使用 Copilot 生成第一步

1️⃣ Copilot Prompt(原始输入)

我在 MainPage.xaml 中,直接向 Copilot Chat 输入了下面的提示:

制作一个签到app, 要求有身份验证, 多租户, 使用freesql orm

这一步非常关键

Prompt 写得越清晰,后面需要人工修改的成本就越低。

Copilot回复如下

你的需求是将当前的 .NET MAUI 工程改造成一个支持身份验证、多租户,并使用 FreeSql ORM 的签到应用。
我会分步实现基础结构,优先完成以下内容:
1.	添加 FreeSql ORM 支持。
2.	设计用户、租户、签到相关的数据模型。
3.	实现基础身份验证(如简单登录界面和逻辑)。
4.	多租户支持(用户与租户关联)。
5.	基础签到功能界面和逻辑。首先,我将获取项目文件列表,确认需要修改和添加的文件。接下来会逐步实现上述功能。下一步将进行如下操作:
1.	在 MauiProgram.cs 中集成 FreeSql ORM(注册为单例)。
2.	创建数据模型(用户、租户、签到记录)。
3.	添加登录页面和基础身份验证逻辑。
4.	设计多租户结构(用户与租户关联)。
5.	初步实现签到功能界面。

2️⃣ Copilot 生成

Copilot 很快给出了一个完整的文件结构,大致包括:

  • MauiProgram.cs
  • Entities.cs

• 在 MauiProgram.cs 注册了 FreeSql ORM,使用 SQLite 数据库。
• 新建了 Entities.cs,包含租户、用户、签到记录的数据模型。


四、添加登录页面和基础身份验证逻辑,并设计多租户结构与签到功能界面。

继续实现以下内容:

  1. 登录页面(用户名、密码、租户选择)。
  2. 登录逻辑(身份验证,用户与租户关联)。
  3. 登录成功后进入签到页面。
    我将先创建登录页面的 XAML 和后台代码,并实现租户列表加载与登录校验。稍后会添加签到页面。

image

已完成以下步骤:

  1. 创建了登录页面(LoginPage.xaml 和后台代码),支持租户选择、用户名、密码输入。
  2. 登录逻辑实现,校验用户与租户信息,登录成功后跳转签到页面。
  3. 创建了签到页面(SignInPage.xaml 和后台代码),用户可进行签到操作。
  4. 设置应用入口为登录页面。
    你可以直接运行项目,体验多租户身份验证和签到功能。

五、首次运行出错

❌ 问题 1:freesql页面获取实例没弄好, 因为maui10改了一些特性,手工调整了一下ok了

Copilot 有时会:

  • 没有最新SDK的训练数据,写出旧版方法
  • 默认加入不必要的写法

这会让程序运行不起来,需要手工介入。

❌ 问题 2:当前的 App.xaml.cs 文件中,MainPage 和 CreateWindow(IActivationState?) 都设置了主页面,可能导致 MAUI 导航和窗口初始化冲突。

image

Copilot 完美的修复了问题

六、登录页面中文乱码

生成的页面编码不对

  1. 用支持 UTF-8 的编辑器(如 VS、VS Code)打开 LoginPage.xaml。
  2. 点击右下角编码, 用GBK重新打开, 选择“另存为”,编码选 UTF-8。

image


七、这一页完成后的状态

到这一步为止,我们已经拥有:

  • 一个可运行的登录和签到页面
  • 一个结构清晰的 ViewModel
  • 没有任何“Demo 味”的临时代码

这也是整个签到 App 的业务起点


八、Copilot 在这一阶段的真实评价

客观来说:

  • Copilot 可以完成 80%~90% 的样板代码
  • 但剩下的 10%,决定了项目的质量

尤其是在:

  • 新SDK方法
  • 可扩展性

这些地方,人类工程师不可替代


九、下一篇预告

下一篇,我们会把这个“单页签到”升级成真正可用的功能

第 4 篇:签到逻辑落地——从按钮点击到数据持久化(SQLite)

同时,也会开始为后面的:

  • 登录
  • 多租户

正式铺路。

到下一篇,我们开始写“真正的业务代码”。🚀

http://www.jsqmd.com/news/120099/

相关文章:

  • 上海埃飞电子科技有限公司:探寻国内顶尖狭缝涂布机加工厂的卓越之道 - 五色鹿五色鹿
  • Redis多实例部署与主从架构
  • 【linux内核】Linux内核的同步机制
  • (100分)- 部门人力分配(Java JS Python C)
  • npm2100 的电源转换能力优点
  • [20251218]测试sql语句子光标的执行性能(21c).txt
  • 常用 Linux 性能调优参数速查表
  • Scikit-image 实战指南:10 个让 CV 模型更稳健的预处理技巧
  • AgentScope深入分析-LLMMCP
  • (100分)- 测试用例执行计划(Java JS Python C)
  • Redis高级特性与生产环境部署
  • 详细介绍:正则表达式超详细版
  • 数组去重(JS)
  • 高职金融科技应用专业可考取的金融科技类证书
  • NPM2100 支持的电池类型
  • (100分)- 报数游戏(Java JS Python)
  • 大专市场营销专业可考取的实用证书
  • NPM2100 超低功耗模式
  • 达梦数据库与部分的联动使用
  • (100分)- ABR 车路协同场景(Java JS Python)
  • 动态 IP 在爬虫、跨境电商如何避开封禁陷阱
  • nPM2100 自带标准电池模型
  • 完整教程:数据结构**排序** 超越Arrays.sort() 探索Java排序算法的奥秘与魅力
  • 在Photoshop中导出小于100KB的图片:推荐使用“存储为Web所用格式”
  • Spark与Kafka整合:构建实时数据管道完整教程
  • 非线性最优化问题求解器Ipopt介绍
  • (100分)- 表达式括号匹配(Java JS Python C)
  • npm2100 超高效升压转换器
  • 我的256天创作纪念日
  • NPM2100 电池电量估算