aopstudio 的个人博客

记录精彩的程序人生

AOP=art of programming=编程的艺术=程艺
  menu
38 文章
0 浏览
2 当前访客
ღゝ◡╹)ノ❤️

iOS开发小白学习笔记1

本学习笔记基于XCode16版本,以标准iOS App为模版,使用SwiftUI作为界面语言

新建一个项目名称为“L2_Demo”的项目后出现以下界面:

截屏2025012519.49.13.png

下面针对不同的部分分别进行阐述:

项目目录

截屏2025012519.50.08.png

Assets.xcassets

截屏2025012519.52.43.png

AccentColor:在此可以设置应用程序主题色

AppIcon:在此可以设置应用程序图标

此外可以拖拽App开发的一些媒体资源也存放在这,拖拽图片到该界面即可导入,导入后的界面如下:

截屏2025012519.54.43.png

ContentView.swift

创建项目后默认进入的文件,即用户界面设计文件,相当于web开发的HTML文件

[项目名]App.swift

在此编写交互逻辑,相当于web开发的JavaScript文件

用户界面开发基础

在ContentView页面,点击模拟器右上方的“+”按钮,可以看到很多XCode已经预定好的工具

截屏2025012520.01.31.png

Views

打开的页面中选中这个正方形中间有个圆形的小洞图标,可以查看Views,相当于HTML的元素

截屏2025012520.03.53.png

鼠标选中元素后拖拽至代码文件中即可将该元素放置到该位置

录屏2025012520.17.34.gif

一些常用的元素

Image()

图片组件,顾名思义,用于展示图片

在图片组件的参数中直接填写Assets.xcassets中的资源名即可引入该文件

截屏2025012520.21.33.png

相关修饰符

.resizable():调整原始图片大小,使其能在屏幕中完整展示
.aspectRatio():调整布局模式

这里提到修饰符了,干脆就介绍一下,同样是点击右上角的+图标打开,不过这时得选中第二个滑块图标

截屏2025012520.23.06.png

同样可以拖拽到代码文件中

录屏2025012520.24.17.gif

VStack:

垂直容器,在它之中的元素纵向从上到下排列

HStack

水平容器,在它之中的元素横向从左到右排列

ZStack

z轴容器,在它之中的元素沿z轴从最底层开始向最高层排列

Spacer

空白填充元素,用于填充元素之间的空白,增加元素之间的间距

修饰符

.cornerRadius

使元素边缘呈现圆角矩形

.padding()

留一些元素外和其他元素之间的空隙

.background()

设置元素背景

SF Symbols

苹果官方退出的图标库,有非常多的现成图标可以直接使用,具体可以访问官网https://developer.apple.com/sf-symbols/ 下载官方app查看图标信息

在XCode使用SF Symbols图标,只需在Image元素参数中填写systemName: "图标名称"即可,且大部分的图标都有空心和实心两种版本

截屏2025012520.32.23.png


标题:iOS开发小白学习笔记1
作者:aopstudio
地址:https://neusoftware.top/articles/2025/01/25/1737808451901.html