jsbridge实战1:xcode swift 构建iOS app

[[toc]]

环境安装

macOs: 10.15.5

xcode: 11.6

demo:app 创建 hello world iOS app

创建工程步骤

  1. 选择:Create a new Xcode project
  2. 选择:iOS-> single View App
  3. 填写:
    • project name: swift-app-hello
    • identifer: smile 包名
    • language: swift
    • user interface: swiftUI
  4. 工具栏:点击运行 -》build success -》iOS模拟器

看看默认生成的代码

swift 复制代码
// AppDelegate.swift
@UIApplicationMain //@UIApplication注解:表示这个Class类是程序的入口
class AppDelegate: UIResponder, UIApplicationDelegate {
    // 定义 3个 application 方法
}

// ContentView.swift
import SwiftUI
struct ContentView: View {
    var body: some View {
        Text("Hello, App!")
    }
}
struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}

demo:app+ui 添加图形

步骤

  • 创建工程和前面步骤相同
  • 区别:选择 user interface: storyBoard
swift 复制代码
import UIKit
class ViewController: UIViewController {
    override func viewDidLoad() {
        super.viewDidLoad()
        // 1.1 创建一个视图:400*400
        let v = UIView(frame: CGRect(x:0, y:0, width: 400, height: 400))
        // 1.2 设置背景颜色
        v.backgroundColor = UIColor.yellow
        // 1.3.添加到当前视图
        view.addSubview(v)

        // 2.1 创建一个按钮
        let btn = UIButton(type: .conta	ctAdd)
        // 2.2 添加到当前视图
        v.addSubview(btn)
        // 2.3 添加点击事件
        btn.addTarget(self, action: #selector(btnClick), for: .touchUpInside)
        
        
        // 3.1 添加一个图片: 先在Assets.xcassets放置图片;然后点击添加图片
        let iv = UIImageView(image: (UIImage(named: "flower")!))
        // 3.2 添加到视图
        view.addSubview(iv)
    }
    @objc func btnClick(){
        print(#function)
        print("按钮被点击了!")
    }
}

demp:app+h5 加载h5页面

步骤:

  • 准备好本地h5页面 http://localhost:5173/
  • 工程创建同上 app+ui
  • 修改 ViewController.swift 文件如下
  • 修改配置 info.plist (右键open as source) 如下
swift 复制代码
// ViewController.swift
import UIKit
import WebKit
class ViewController: UIViewController, WKUIDelegate {
    var webView: WKWebView!
    override func loadView() {
        let webConfiguration = WKWebViewConfiguration()
        webView = WKWebView(frame: .zero, configuration: webConfiguration)
        webView.uiDelegate = self
        view = webView
    }
    override func viewDidLoad() {
        super.viewDidLoad()
//         let myURL = URL(string:"https://www.baidu.com") // ok
        let myURL = URL(string:"http://localhost:5173/") // ok
        let myRequest = URLRequest(url: myURL!)
        webView.load(myRequest)
    }
}
xml 复制代码
<!-- info.plist  -->
<key>NSAppTransportSecurity</key>
<dict>
    <key>NSAllowsArbitraryLoads</key>
    <true/>
</dict>

效果:

相关推荐
打工人你好6 小时前
Swift 的 KeyPath 是什么?
swift
Johnny Tong11 小时前
iOS 获取设备占用内存
ios·内存·host_vm
木兰不吃草11 小时前
如何在 Mac 上下载安装仙剑游戏仙剑世界?可以通过IPA砸壳包安装非常简单
游戏·macos·ios·游戏程序·mac
帅次11 小时前
Flutter 异步编程利器:Future 与 Stream 深度解析
android·flutter·ios·小程序·kotlin·webview·android-studio
小鹿撞出了脑震荡14 小时前
Effective Objective-C 2.0 读书笔记——大中枢派发
开发语言·ios·objective-c
struggle202515 小时前
Ollmao (OH-luh-毛程序包及源码) 是一款原生 SwiftUI 应用程序,它与 Ollama 集成,可在 Mac 上本地运行强大的 AI 模型
ios·swiftui·swift
小白教程19 小时前
Python实现语音识别详细教程【2025】最新教程
python·语音识别·xcode
神仙别闹1 天前
基于IOS实现各种倒计时功能
macos·ios·cocoa
gp1031 天前
iOS事件传递和响应
ios·响应链·事件传递
SunshineBrother2 天前
Flutter go_router 路由管理详解&封装
android·flutter·ios