继续学习 https://www.hackingwithswift.com/100 ,
昨天学习了基本语法,今天试着照着教程实现第一个项目
以下步骤和教程可能不一样
此文对应教程 day16-day18 的内容
一、创建一个Single View App
- 创建项目步骤略
- 添加content中的资源,这个资源是教程中提供的,把这个文件夹拖到项目中,
勾选“Copy items if need”和"Create groups"选项,以资源的形式添加
二、编辑界面
- 修改Main.storyboard
1.先把View Controller Scene删掉
- Cmd + Shift + L 打开库面板,搜索UITableViewController,把组件添加到界面上
3.,左边资源管理,打开ViewController.swift,修改成继承UITableViewController,
4.选中UITableViewController.scene,打开"show the identity inspector" (看图),把Class改成ViewController,并勾选"inherit Module From Target"
5.选中"TableViewCell",改他的名称为“Picture”,并把Style改成默认(Basic)
proj1修改TableView.jpg
proj1修改TableCell.jpg
添加NavgationController
菜单 Editor > Embed in > NavigationController
截图后补新建显示图片的场景
- Cmd + Shift + L 打开库面板,拖入一个ViewController到任意位置
- Cmd + Shift + L 打开库面板,拖入一个ImageView到这个新场景下,拖住边界的块,放大到全屏
- 添加限制
- 在文件中新建一个DetailViewController.swift,继承自ViewController,
5, 修改这个场景的Class,指向DetailViewController
最终界面
proj1界面效果.jpg
三、编辑代码
ViewController.swift
import UIKit
class ViewController: UITableViewController {
var pictures = [String]()
override func viewDidLoad() {
super.viewDidLoad()
// Do any additional setup after loading the view.
title = "Storm Viewer"
navigationController?.navigationBar.prefersLargeTitles = true
let fm = FileManager.default
let path = Bundle.main.resourcePath!
let items = try! fm.contentsOfDirectory(atPath: path)
for item in items {
if item.hasPrefix("nssl"){
pictures.append(item)
}
}
}
override func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
return pictures.count
}
override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
let cell = tableView.dequeueReusableCell(withIdentifier: "Picture", for: indexPath)
cell.textLabel?.text = pictures[indexPath.row]
return cell
}
override func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) {
if let vc = storyboard?.instantiateViewController(withIdentifier: "Detail") as? DetailViewController{
vc.selectedImage = pictures[indexPath.row]
navigationController?.pushViewController(vc,animated:true)
}
}
}
DetailViewController.swift
import UIKit
class DetailViewController: UIViewController {
@IBOutlet weak var imageView: UIImageView!
var selectedImage:String?
override func viewDidLoad() {
super.viewDidLoad()
if let imageToLoad = selectedImage {
imageView.image = UIImage(named: imageToLoad)
}
//项目三,添加一个navBtn
navigationItem.rightBarButtonItem = UIBarButtonItem(barButtonSystemItem: .action, target: self, action: #selector(shareTapped))
}
override func viewWillAppear(_ animated: Bool) {
super.viewWillAppear(animated)
navigationController?.hidesBarsOnTap = true
}
override func viewWillDisappear(_ animated: Bool) {
super.viewWillDisappear(animated)
navigationController?.hidesBarsOnTap = false
}
}
//项目三,添加导航栏按钮的响应
@objc func shareTapped(){
guard let image = imageView.image?.jpegData(compressionQuality: 0.8) else {
print("No Image found")
return
}
let vc = UIActivityViewController(activityItems: [image], applicationActivities: [])
vc.popoverPresentationController?.barButtonItem = navigationItem.rightBarButtonItem
present(vc,animated: true)
}
运行效果:
四、总结
1.刚开始接触xcode和swift,英语渣,连设置界面ID都不知道在哪里,花了比较多时间。
这个项目知道了xcode界面界面的基本操作,比如把组件@IBOutlet到ViewController,创建布局限制
2.有导航栏的界面,应该把导航栏的Scene设置成程序入口
2.ViewController的生命周期,在加载和显示两个状态
ViewController -> UIResponse -> NSObject
ViewController 是视图控制类的基类,继承自ViewController的有
UITabBarController
UITableViewController
UINavigationControllerAPI 节选 具体看源代码或帮忙文档
var view:UIView!
var viewIfLoaded:UIView?
var isViewLoaded:Bool
var title:String?
生命周期
loadView
viewDidLoad
ViewWillAppear
ViewDidAppear
ViewWillDisappear
ViewDidDisappear
ViewDidUnload
五、新增 使用系统的分享工具
- 在导航栏添加一个按钮并弹出分享功能
navigationItem.rightBarButtonItem = UIBarButtonItem(barButtonSystemItem: .action, target: self, action: #selector(shareTapped))
扩展
#selector 和 @objc 是什么
#selector是一个编译参数,把swift类的方法绑定到UI类的事件处理,
@objc可以把方法暴露给oc..
https://swifter.tips/selector/