iOSアプリ開発:コードだけでUI画面構成を行う方法〜入門〜
この記事は
iOSアプリの開発で画面構成(UI部分)にはStoryBoardやswiftUIなどがあるようですが、これらはgitとの相性が悪いためコンフリクションを起こしやすく、チーム開発には向いていないらしいです。というわけでStoryBoardでもなくswiftUIでもない、「コードでUIをデザインする」という方法を学習してみます。具体的には「SnapKitなどのライブラリを用いて画面を作っていく」ことになります。
手順
・CocoaPodsとSnapKitをインストールして、SnapKitをプロジェクトに導入する
・StoryBoardを消す
・Scene Delegateを消す
・AppDelegate.swiftの編集
CocoaPodsとSnapKitをインストールして、SnapKitをプロジェクトに導入する
私が過去に書いたこちらの記事を参考に進めて下さい。
参考:Xcode:CocoaPodsをインストールして、CocoaPodsからSnapKitをインストールする!
StoryBoardを消す
以下の手順でStoryBoardを一匹残らず駆逐していきます。
・ナビゲータエリアのプロジェクトをクリック -> General -> Main Interface -> Mainから空欄にする
・ナビゲータエリアのinfo.plist
のうち、Scene Configuration
のStoryboard Name
の項目を削除(右クリック -> Cut)
・Main.storyboard
を削除
Scene Delegateを消す
同様に、以下の手順で一匹残らず駆逐していきます
・info.plist
のApplication Scene Manifest
を根こそぎ削除
・SceneDelegate.swift
ファイルを削除
AppDelegate.swiftの編集
とにかくこうして下さい。
import UIKit
@main
class AppDelegate: UIResponder, UIApplicationDelegate {
var window: UIWindow?
func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?) -> Bool {
// 最初に表示するUIViewControllerを指定する
// windowをスクリーンサイズに合わせて生成
window = UIWindow(frame: UIScreen.main.bounds)
// ViewControllerをインスタンス化、windowのrootに設定する
window!.rootViewController = ViewController()
// 表示する
window!.makeKeyAndVisible()
return true
}
}
以上で何とかなるはずです。
それでは、本当に何とかなるのか試してみましょう。
UIに関するコードはViewController
に書いていきます。
import UIKit
// SnapKitをインポート
import SnapKit
class ViewController: UIViewController {
var label: UILabel!
override func viewDidLoad() {
super.viewDidLoad()
// 背景色を変更
self.view.backgroundColor = UIColor.greem
// 文字を設置
self.label.text = "Hello, World!"
// ラベルを設置
self.view.addSubview(label)
// ラベルの位置をSnapKitで指定
self.label.snp.makeConstraints { (make) in
make.center.equalToSuperview() // 親ビューの真ん中に配置
}
}
}
上記は画面の色を緑色にして、その真ん中にHello, World!を表示させるコードです
これでRunして本当にそうなっていればおkですね。
SnapKitもUIKitも使えていることになります。
なっていなければ、どこかがおかしいのでエラーを見るかデバッグするか。
以上です!
お疲れ様でした!
参考記事
iOS13でSceneDelegateを使わないでアプリを作る
storyboardが使われない設定にしているはずなのにcould not find storyboard named "Main"が出てエラーになる。
Author And Source
この問題について(iOSアプリ開発:コードだけでUI画面構成を行う方法〜入門〜), 我々は、より多くの情報をここで見つけました https://qiita.com/mi_iroha/items/08a649b9e888ecdaabe4著者帰属:元の著者の情報は、元のURLに含まれています。著作権は原作者に属する。
Content is automatically searched and collected through network algorithms . If there is a violation . Please contact us . We will adjust (correct author information ,or delete content ) as soon as possible .