SwiftUIをはじめよう!!

SwiftUIとSwiftの違い

2019年に、SwiftUIは発表されました。それよりも前は、Swiftを使っていました。それでは、SwiftとSwiftUIの差は何なのでしょうか。

画面デザインの仕方

画面デザインの違い
SwiftUI Swift
コードの書き方

コードの中に直接記述

Xcodeに搭載されているLivePreviewで、デザインを作ることができます。

StoryBoardで作る

xmlで記述します。こちらもxcodeに搭載されている機能で、デザインを作ることができます。

デバイスの差

自動で並べるので、どのデバイスでも設定せずに同じように表示可能!

HStackなどを使うので、簡単に並べられます。

オートレイアウトで並べる

Xcodeの機能のInterface Builderを使います。

画面遷移

画面遷移の違い
SwiftUI Swift
画面遷移の仕方

NavigationViewを使う

コードで囲むことで簡単に画面遷移ができます。

ViewController同士を繋ぐ

Interface Builderのところで、ViewController同士をつなぎます。

SwiftUIのNavigationViewの説明は記事に書きます。

部品のデザイン

部品のデザインの仕方の違い
SwiftUI Swift
ボタンなどのデザイン

宣言型シンタックスで簡単に記述!!

.background
(Color.orange)

(本当は一文です)

このコードをボタンのTextのすぐ下に書けば、簡単に変えられます。そして見やすい!

定義したボタン名で設定する

button.background
Color = .red

(本当は一文です)

アプリを起動したときに、実行されるようにします。

 

デザインがわかる時

宣言型シンタックスを書いたとき

コードを書いた時点で、LivePreviewがすぐに表示してくれます。

ビルドしたとき

ViewControllerとStoryBoardが分かれているので、デザインがわかるのはビルドをして合わさったときです。

コーディング

コーディングの仕方の違い
SwiftUI Swift
Buttonの接続の仕方

コードを書いた時点で接続します。

Button(action: {})・・・

という風に書けば、もう接続しています。

自分で繋げます。

ViewControllerでボタンを定義し、そのあとStoryBoardで接続します。

コードの書き方

actionに記述

Button(action:{この中に書きます。)・・・

関数を作ります。

@IBOutlet func button {

}

まとめ

まとめ

SwiftUIはSwiftより使いやすくなった!

SwiftUIのほうが少ないコードで同じことができる!

おすすめの本

Swiftを始める時にインターネットだけでの独学は難しい!!と考える人もいると思います。「SwiftUI iPhoneアプリ開発入門ノート」は丁寧に解説してくれるのでとても便利です。

COMMENT

メールアドレスが公開されることはありません。