Courseraの"Create the User Interface with SwiftUI"に入門した話。

-





Create the User Interface with SwiftUI


タイトル通り、Courseraの以下のコースに入門しました。

Create the User Interface with SwiftUI


参考本を一通り復習し終わったが、いまいち全体的な開発サイクルを理解できなかったのでSwiftUI周りの開発をどのように進めていくのかを実践的に勉強できるコースを探していたところ、Metaが提供しているコースがあったので入門したという流れ。

今日の0時ごろに登録して1時間半くらい軽く進めて"Setting up SwiftUI"を完了したのでそこで学んだことを備忘的に残しておく。


  • Appleのデバイスには一般的なコンピューター(MacBook,iMacなど)とタッチデバイス(iPhone,Apple Watchなど)に大別される。
    • 上記のうち前者は操作の精度が高いが、後者はディスプレイの小ささなどから捜査の精度が低い。よってデバイス上に表示される情報はシンプルに、そして情報量を制限するべきである。
    • 気になる人はHuman Interface Guideline見てね！とのこと。
    • また、UI的に配色にも注意する。例として挙げられていたのはボタンの配色が全体的に暗いと分かりにくいから操作しやすいように明るい配色にしよう！みたいな話。
  • SwiftUIの利点
    • ダイナミックテキスト(デバイスごとに表示されるテキストのサイズ)が自動的にサポートされていること
    • アクセシビリティ(障がい者向けの対応)やローカライゼーション(異なる言語区分への対応)などがしやすいこと
    • ライトテーマやダークテーマに対応が容易なこと
  • 宣言的(Declarative)シンタックスと命令的(Imperative)シンタックスの違い
    • Declarative = WHAT you want
      • つまり結局何がしたいのかに集約される。(ハンバーガーを注文するときにハンバーガー下さい。で通用する)
    • Imperative = HOW you want
      • どのように用意するのかに集約される。(ハンバーガーを注文するときにパンを用意して、トーストして、肉を焼いて、etc...したものを下さいというようなもの)
    • つまりDeclarativeは処理を書けばマシン側で自動的に最適化をして欲しいものを返してくれる。便利。
  • SceneとViewの違い
    • Scene
      • WindowやViewなどの他の要素のために存在するコンテナのようなもの。デバイスによって表示される形式が異なる。例えば、iPhoneの場合、画面サイズが小さいためにシーンを分割して表示するが、iPadの場合には開発者が何も余分な作業をしなくても、1つの画面に2つの列を横に並べてすべての要素を表示することができる。例：WindowGroup
    • View
      • SwiftUI上で画面に表示されるものはほとんどがView。大きな特徴として、一度作成したビューは、同じアプリ内や複数のアプリで何度でも再利用することができる。例:Texts, TextField, Images
  • あとは細かいクイズと演習

今後の流れ

ひとまず修了するまではこちらの内容にかかりっきりになりそう。
全編英語なので少し気合がいるが、最近は翻訳ソフトのおかげで理解が怪しい部分をそのままにせずにしっかり理解できるようになっているのが救い。

コメント

コメントを投稿

このブログの人気の投稿

Braveブラウザ(iPhone,iPad)にオフラインでもYouTubeの動画が視聴可能なPlaylist機能が追加されていたので使い方をまとめてみた。

-
イメージ
アップデートしたら使えるようになっていた 公式 からリリースされている通り、 BraveのiPhoneとiPadアプリのユーザーは、 新機能「Playlist」 を、 v1.25版 から利用可能になりました。これはユーザーが動画・音声コンテンツを好きなプラットフォームから保存し、楽しめるようにする機能です。Brave Playlistを使うと、ユーザーは複数のプラットフォームから選んだコンテンツを1つのプレイリストに保存して、いつでも、どこでもアクセスできます。音楽、動画、ポッドキャストなどを、通勤や旅行、日常生活で楽しむのに最適な機能です。 オフライン でYouTubeの動画を手元にダウンロードし、どこでも視聴可能になる機能が今回のアップデートで追加されました。 いやいや、これ相当便利ですね。 Braveを使っている方なら、Braveを通してYouTubeを視聴すれば広告を見なくて済むということを知ってらっしゃるとは思うのですが、まさかオフラインでも視聴可能になるとは・・・ AdBlockなどを活用すれば他のブラウザでも広告をブロックすること自体はできたのですが、まさか無償でブラウザ側が実装してくれるとは！ ただ、広告収入をメインにしているYouTube側から規制されそうな気もしますが・・・ どうなんでしょうか？ ちなみにこの機能、よくみたら5日前の段階でリリースされていたようなのですが、チェックできていなかったので先ほどアップデートをしたときに驚きました。 使い方 直感的に使えるので、すぐに使い方は分かるようになるかと思います。 1. YouTubeを開く 2.保存したい動画を開く。この時、画面下部に「Brave Playlistに追加する」と表示されるのでタップ。 3.画面右下の「・・・」をタップし、表示されたPlaylistをタップ 4.ダウンロードが始まっているので、完了するまで待つ。 5.ダウンロードが完了次第いつでもどこでも楽しめるように！ これで完了です。 例えば機内モード(左上の飛行機マークに注目してください)にしたとしても問題なく動画は再生されます。 これで広告無し、しかもオフラインでもYouTubeを楽しめるようになりました！
続きを読む

自作のChrome Extensionをインポートした時に "Invalid value for 'content_scripts[0].matches[0]': Empty path."というエラーが出たので解決した

-
イメージ
タイトル通りのエラーが出た。 Chromeの拡張機能を作っていたところ試しに作った拡張機能をインポートした時にエラーが出た。 調べてみるとmanifest.jsonでエラーが起こっているようで、タイトルのように、"Invalid value for 'content_scripts[0].matches[0]': Empty path."と表示されている。 manifest.jsonの中に書いたmatchesのインデックスの0番目がどうやら空のパスになっているらしい。 ちなみにmanifest.jsonは設定ファイルのようなもので、ここで定義している 'content_scripts[0].matches[0]'はGoogleのURI。 { "name" : "Example Extension" , "version" : "1.0.0" , "manifest_version" : 2 , "description" : "Sample Extension" , "content_scripts" : [ { "matches" : [ "https://www.google.com" ] , "js" : [ "content.js" ] } ] } という内容で、このディレクトリには他に content.js のみ。 なんぞやということで色々調べてみると単純に末尾にスラッシュが足りなかっただけのよう。 { "name" : "Example Extension" , "version" : "1.0.0" , "manifest_version" : 2 , "description" : "Sample Extension" , "content_scrip...
続きを読む

【OSLog】How to log a Swift project

-
イメージ
Overview I found an article on the net that summarized how to use OSLog, I wanted a working sample. I am new to logging, so I wasn’t sure how to interpret the usage of OSLog. So I summarized it in my own way. What is OSLog? It is a library for logging that is provided by Apple and can be used in Swift projects. The official documentation is here . Sample https://github.com/Kuehar/OSLogSample When the above code is run, eight buttons are lined up as shown below. import SwiftUI import OSLog struct ContentView: View { let logger = Logger(subsystem: Bundle.main.bundleIdentifier!, category: "ApplicationCode") var body: some View { VStack { Button(action: { logger.trace("Trace Log") }, label: { Text("Trace") }) Button(action: { logger.debug("Debug Log") }, label: { Text("Debug") ...
続きを読む