实战编程·使用SwiftUI从0到1完成一款iOS笔记App(三)(1)

简介: 实战编程·使用SwiftUI从0到1完成一款iOS笔记App(三)

实战编程·使用SwiftUI从0到1完成一款iOS笔记App(三)

前提回顾

在上两章节中,我们完成了念头笔记首页新建笔记页面的页面构建,以及两个页面之间的简单交互。单独从前端角度来看,静态项目已经搭建完毕,接下来我们要进入到更加深层次一点点的学习。

在本章中,我们将实现继续实现念头笔记的新建一条笔记的交互。

新建笔记

我们先来完成新建笔记的操作,在之前的章节里我们创建了一个类NoteItem来作为Model数据用来遍历列表数据,而新建笔记的方法也很简单,我们只需要在NoteItem类数组中插入一条数据,并且插入的数据信息是我们标题输入框以及内容输入框输入的数据就行了。

首先需要在NewNoteView视图中,创建用于双向绑定的NoteItem类数组,如下代码所示:

@Binding var noteItems: [NoteItem]

因为使用@Binding进行双向绑定,在NewNoteView视图预览时需要加一个默认值,如下代码所示:

less

复制代码

NewNoteView(title: "", content: "", showNewNoteView: .constant(true), noteItems:  .constant([]))

image.png

报错是因为我们在ContentView首页视图中通过模态弹窗跳转到NewNoteView新建笔记视图,而NewNoteView刚刚使用@Binding绑定的参数在ContentView首页视图缺少关联。

很多情况都是这样,只要使用了@Binding绑定了参数,就必须在其他与该页面关联的页面双向绑定,也是挺烦的。

我们回到ContentView首页视图,做一下双向绑定,如下图所示:

image.png

新建笔记方法

新建笔记操作可以和创建View视图的方式一样,先创建一个方法,然后在需要的地方调用这个方法,新建笔记的方法如下代码所示:

// MARK: 新建笔记方法
func addNote(writeTime:String,title:String,content:String) {
    let note = NoteItem(writeTime: writeTime, title:title,content:content)
    noteItems.append(note)
}

image.png

上述代码中,我们创建了一个新建笔记的方法addNote,传入三个String类型的参数:writeTime录入时间、title标题、content内容。

然后将传入的参数的值赋予NoteItem模型类中,并赋值给note常量。

声明note常量是常用的编程方法,当代码太长的时候就会抽离出来赋值,后面再使用。

最后我们noteItems数组使用append将note的内容插入到noteItems数组数组中。

使用addNote方法时,只需要在执行动作时调用并且赋值就行了。在NewNoteView新建笔记视图中,点击“完成”按钮时,创建将会创建一条新笔记,我们在点击“完成”按钮时调用addNote方法。如下代码所示:

addNote(writeTime: "", title: title, content: content)

image.png

上述代码中,我们在saveBtnView“完成按钮”视图点击时调用addNote方法,并且将3个参数赋值,但我们看到writeTime参数是String字符串类型,我们赋值了空值。

获得时间方法

writeTime参数是录入时间,我们需要在新建笔记时需要获得当前系统的时间,并存起来。这里需要注意2点,一是时间需要精确到“”,二是writeTime参数是String字符串类型,而时间常常是Date类型,还有可能做格式转换。

我们依旧可以创建一个方法来获得当前的系统时间,如下代码所示:


// MARK: 获取当前系统时间
func getCurrentTime() -> String {
    let dateformatter = DateFormatter()
    dateformatter.dateFormat = "YYYY.MM.dd"
    return dateformatter.string(from: Date())
}

image.png

上述代码中,我们创建一个获得当前时间的方法getCurrentTime,获得时间后返回 一个String类型的返回值。

使用DateFormatter格式化方法,时间格式为“YYYY.MM.dd”,也就是XXXX年XX月XX日的展示格式,最后return当前时间戳。

我们将getCurrentTime方法赋予addNote添加笔记的方法中的writeTime参数,当我们迫不及待地回到ContentView首页视图想尝试使用时,发现并没有实现新建笔记操作.

这是因为什么呢?

我们看看原来NoteListView笔记列表视图的方法,发现这里使用@State声明了NoteItem模型类数组,是的,这导致了在NewNoteView新建笔记视图的新建笔记参数没有能回传回来

是的,这里埋了一个坑。


相关文章
|
2天前
|
JavaScript 搜索推荐 Android开发
【01】仿站技术之python技术,看完学会再也不用去购买收费工具了-用python扒一个app下载落地页-包括安卓android下载(简单)-ios苹果plist下载(稍微麻烦一丢丢)-客户的麻将软件需要下载落地页并且要做搜索引擎推广-本文用python语言快速开发爬取落地页下载-优雅草卓伊凡
【01】仿站技术之python技术,看完学会再也不用去购买收费工具了-用python扒一个app下载落地页-包括安卓android下载(简单)-ios苹果plist下载(稍微麻烦一丢丢)-客户的麻将软件需要下载落地页并且要做搜索引擎推广-本文用python语言快速开发爬取落地页下载-优雅草卓伊凡
21 8
【01】仿站技术之python技术,看完学会再也不用去购买收费工具了-用python扒一个app下载落地页-包括安卓android下载(简单)-ios苹果plist下载(稍微麻烦一丢丢)-客户的麻将软件需要下载落地页并且要做搜索引擎推广-本文用python语言快速开发爬取落地页下载-优雅草卓伊凡
|
1月前
|
安全 数据安全/隐私保护 Android开发
【05】2025年1月首发完整版-篇幅较长-苹果app如何上架到app store完整流程·不借助第三方上架工具的情况下无需花钱但需仔细学习-优雅草央千澈详解关于APP签名以及分发-们最关心的一篇来了-IOS上架app
【05】2025年1月首发完整版-篇幅较长-苹果app如何上架到app store完整流程·不借助第三方上架工具的情况下无需花钱但需仔细学习-优雅草央千澈详解关于APP签名以及分发-们最关心的一篇来了-IOS上架app
223 75
|
2天前
|
数据采集 JavaScript Android开发
【02】仿站技术之python技术,看完学会再也不用去购买收费工具了-本次找了小影-感觉页面很好看-本次是爬取vue需要用到Puppeteer库用node.js扒一个app下载落地页-包括安卓android下载(简单)-ios苹果plist下载(稍微麻烦一丢丢)-优雅草卓伊凡
【02】仿站技术之python技术,看完学会再也不用去购买收费工具了-本次找了小影-感觉页面很好看-本次是爬取vue需要用到Puppeteer库用node.js扒一个app下载落地页-包括安卓android下载(简单)-ios苹果plist下载(稍微麻烦一丢丢)-优雅草卓伊凡
23 7
【02】仿站技术之python技术,看完学会再也不用去购买收费工具了-本次找了小影-感觉页面很好看-本次是爬取vue需要用到Puppeteer库用node.js扒一个app下载落地页-包括安卓android下载(简单)-ios苹果plist下载(稍微麻烦一丢丢)-优雅草卓伊凡
|
2月前
|
存储 监控 API
app开发之安卓Android+苹果ios打包所有权限对应解释列表【长期更新】-以及默认打包自动添加权限列表和简化后的基本打包权限列表以uniapp为例-优雅草央千澈
app开发之安卓Android+苹果ios打包所有权限对应解释列表【长期更新】-以及默认打包自动添加权限列表和简化后的基本打包权限列表以uniapp为例-优雅草央千澈
87 11
|
3月前
|
传感器 iOS开发 UED
探索iOS生态系统:从App Store优化到用户体验提升
本文旨在深入探讨iOS生态系统的多个方面,特别是如何通过App Store优化(ASO)和改进用户体验来提升应用的市场表现。不同于常规摘要仅概述文章内容的方式,我们将直接进入主题,首先介绍ASO的重要性及其对开发者的意义;接着分析当前iOS平台上用户行为的变化趋势以及这些变化如何影响应用程序的设计思路;最后提出几点实用建议帮助开发者更好地适应市场环境,增强自身竞争力。
|
3月前
|
API Android开发 iOS开发
深入探索Android与iOS的多线程编程差异
在移动应用开发领域,多线程编程是提高应用性能和响应性的关键。本文将对比分析Android和iOS两大平台在多线程处理上的不同实现机制,探讨它们各自的优势与局限性,并通过实例展示如何在这两个平台上进行有效的多线程编程。通过深入了解这些差异,开发者可以更好地选择适合自己项目需求的技术和策略,从而优化应用的性能和用户体验。
|
3月前
|
设计模式 Swift iOS开发
探索iOS开发:从基础到高级,打造你的第一款App
【10月更文挑战第40天】在这个数字时代,掌握移动应用开发已成为许多技术爱好者的梦想。本文将带你走进iOS开发的世界,从最基础的概念出发,逐步深入到高级功能实现,最终指导你完成自己的第一款App。无论你是编程新手还是有志于扩展技能的开发者,这篇文章都将为你提供一条清晰的学习路径。让我们一起开始这段旅程吧!
|
5月前
|
Swift iOS开发 UED
揭秘一款iOS应用中令人惊叹的自定义动画效果,带你领略编程艺术的魅力所在!
【9月更文挑战第5天】本文通过具体案例介绍如何在iOS应用中使用Swift与UIKit实现自定义按钮动画,当用户点击按钮时,按钮将从圆形变为椭圆形并从蓝色渐变到绿色,释放后恢复原状。文中详细展示了代码实现过程及动画平滑过渡的技巧,帮助读者提升应用的视觉体验与特色。
87 11
|
9月前
|
iOS开发 开发者
苹果iOS App Store上架操作流程详解:从开发者账号到应用发布
很多开发者在开发完iOS APP、进行内测后,下一步就面临上架App Store,不过也有很多同学对APP上架App Store的流程不太了解,下面我们来说一下iOS APP上架App Store的具体流程,如有未涉及到的部分,大家可以及时咨询,共同探讨。
|
9月前
|
安全 数据安全/隐私保护 iOS开发
iOS App 上架流程图文教学
在上架App 之前必须先准备好开发者帐号,但申请开发者帐号因法兰克早在之前已经申请好了,故就跳过此步骤,直接从产生凭证到上传App开始讲起。首先,要将自己辛苦写好的App 送审的话,则要依序做完下列几件事情即可。

热门文章

最新文章

  • 1
    MNN-LLM App:在手机上离线运行大模型,阿里巴巴开源基于 MNN-LLM 框架开发的手机 AI 助手应用
  • 2
    【11】flutter进行了聊天页面的开发-增加了即时通讯聊天的整体页面和组件-切换-朋友-陌生人-vip开通详细页面-即时通讯sdk准备-直播sdk准备-即时通讯有无UI集成的区别介绍-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草Alex
  • 3
    微信小程序 app.json 配置文件解析与应用
  • 4
    【Azure App Service】基于Linux创建的App Service是否可以主动升级内置的Nginx版本呢?
  • 5
    【05】flutter完成注册页面完善样式bug-增加自定义可复用组件widgets-严格规划文件和目录结构-规范入口文件-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草央千澈
  • 6
    【Azure Function】Function App出现System.IO.FileNotFoundException异常
  • 7
    原生鸿蒙版小艺APP接入DeepSeek-R1,为HarmonyOS应用开发注入新活力
  • 8
    【Azure Logic App】使用MySQL 新增行触发器遇见错误 :“Unknown column 'created_at' in 'order clause'”
  • 9
    【08】flutter完成屏幕适配-重建Android,增加GetX路由,屏幕适配,基础导航栏-多版本SDK以及gradle造成的关于fvm的使用(flutter version manage)-卓伊凡换人优雅草Alex-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草Alex
  • 10
    阿里云APP备案流程图以及备案所需材料整理,跟着教程一步步操作
  • 1
    【02】仿站技术之python技术,看完学会再也不用去购买收费工具了-本次找了小影-感觉页面很好看-本次是爬取vue需要用到Puppeteer库用node.js扒一个app下载落地页-包括安卓android下载(简单)-ios苹果plist下载(稍微麻烦一丢丢)-优雅草卓伊凡
    23
  • 2
    【01】仿站技术之python技术,看完学会再也不用去购买收费工具了-用python扒一个app下载落地页-包括安卓android下载(简单)-ios苹果plist下载(稍微麻烦一丢丢)-客户的麻将软件需要下载落地页并且要做搜索引擎推广-本文用python语言快速开发爬取落地页下载-优雅草卓伊凡
    21
  • 3
    uniapp开发ios打包Error code = -5000 Error message: Error: certificate file(p12) import failed!报错问题如何解决
    141
  • 4
    【05】2025年1月首发完整版-篇幅较长-苹果app如何上架到app store完整流程·不借助第三方上架工具的情况下无需花钱但需仔细学习-优雅草央千澈详解关于APP签名以及分发-们最关心的一篇来了-IOS上架app
    223
  • 5
    app开发之安卓Android+苹果ios打包所有权限对应解释列表【长期更新】-以及默认打包自动添加权限列表和简化后的基本打包权限列表以uniapp为例-优雅草央千澈
    87
  • 6
    深入探索iOS开发中的SwiftUI框架
    143
  • 7
    ios样式开关按钮jQuery插件
    58
  • 8
    Android与iOS生态差异深度剖析:技术架构、开发体验与市场影响####
    74
  • 9
    深入探索iOS与Android操作系统的安全性差异
    102
  • 10
    安卓与iOS开发中的跨平台策略:一次编码,多平台部署
    174