SwiftUI
Listを使って縦スクロール型のビューを組んでいて、初回表示が重くなる問題にぶち当たっています。 実際のコードはもっと複雑ですが、やりたいことはこんな感じです。 List内の各行はItem.typeごとに別々のビューを表示させるようにしています。 struct Cont…
![はてなブックマーク - [SwiftUI] Listでifを使うと初回ロードが重くなる...？](https://b.hatena.ne.jp/entry/image/https://bamboohero.hatenablog.com/entry/swiftui-list-various-types-of-views)
記事タイトルをどうすべきか結構悩んだんですがｗ、要はやりたいのはこういうことです。 Rectangleの高さを、与えられたフレーム幅を基に動的に変化させたいとします。 ここではフレーム幅の半分のサイズの高さを指定することとします。 struct ContentView:…
テキストの先頭にアイコンがあり、2行目のテキストの先頭をアイコンの下に潜り込ませるデザインを、あなたはどのように実装しますか？ SwiftUIのTextを使うと、テキストに画像をインラインで埋め込むことができるので、以下のように簡単に実装できます。 Tex…
![はてなブックマーク - [SwiftUI] インラインでTextにImageを埋め込むデザインを実装しようとして苦労した話](https://b.hatena.ne.jp/entry/image/https://bamboohero.hatenablog.com/entry/inline-icon-image-with-text){kind=icon}
アプリの複数の画面で汎用的に使えるカスタムビューを作ったが、画面によって一部分だけ色を変えたいという要件が出てきたら、どう実装すれば良いでしょうか？ 例えば、ユーザ情報を表示する汎用的なビューを以下のように実装したとします（テキスト思いっき…
![はてなブックマーク - [SwiftUI] カスタムビューに独自のModifierを実装する方法](https://b.hatena.ne.jp/entry/image/https://bamboohero.hatenablog.com/entry/custom-modifier-for-custom-view)
ScrollView内のビューが画面上に表示されたらなにか処理をするという仕組みを実装したので、実装方法をご紹介します。 実装したもの コードの解説 ビューが画面に表示されたかどうかを判定するための情報を整理する 各情報を取得する ビューが画面に表示され…
親ビューと子ビューそれぞれでアラートを表示する実装がある場合、.alert() Modifierの記述箇所を気をつけないと、子ビューのアラートが表示されなくなります。 正しく表示されるケースの実装はこちらです。 struct ParentView: View { @State var showAlert…
![はてなブックマーク - [SwiftUI] .alert()の記述箇所を気をつけないと子ビューのアラートが表示されなくなる](https://b.hatena.ne.jp/entry/image/https://bamboohero.hatenablog.com/entry/swiftui-alert-not-display)
TCAのサンプルの中に Reusable Favoriting Componentというものがあります。 「何かをFavoritingする」という機能を提供する、汎用的なコンポーネントの実装例です。 Getting Startedのサンプルと比べて若干ReducerやStateの書き方が違うので混乱するんです…
まだSwiftUIにはUITextView相当のものが用意されていないので、UIViewRepresentableを使ってUITextViewをSwiftUIビューで使用できるようにしています。 さらに、自分が関わっているプロジェクトではThe Composable Architecture（TCA）を採用しているのです…
The Composable Architecture（TCA）のサンプルからアクションシート（Action Sheet）の実装方法について学びます。 今回扱うサンプルはこちらです。 01-GettingStarted-AlertsAndActionSheets 「Action sheet」ボタンをタップするとアクションシートが表示…
複数画面間での状態の共有をどのように実装するかは、iOSアプリ開発において一つの大きな議論のテーマではないでしょうか？ TCAは複数画面間での状態の共有という課題に対してどのようなソリューションを提供するのか、サンプルから学んでいきましょう。 01-…
The Composable Architecture（TCA）のサンプルからアラート（Alert）の実装方法について学びます。 今回扱うサンプルはこちらです。 01-GettingStarted-AlertsAndActionSheets 「Alert」ボタンをタップするとアラートが表示され、アラートの中の「Increment…
The Composable Architecture（TCA）のサンプルから画面遷移の実装方法について学びます。 今回扱うサンプルは以下の3つです。 01-GettingStarted-OptionalState 03-Navigation-NavigateAndLoad 03-Navigation-LoadThenNavigate Stateがnilとnon-nilのときで…
The Composable Architecture（TCA）のサンプルからBindingの扱い方について学びます。 今回はCaseStudiesの01-GettingStarted-Bindings-Basicsと01-GettingStarted-Bindings-Formsを例に説明します。 単方向データフローの原則を守る Bindingを使った実装方…
SwiftUIで画像をレイアウトする方法についてまとめました。 画像のレイアウトは4つのメソッドの組み合わせで決まる 各レイアウト方法の比較 参考 画像のレイアウトは4つのメソッドの組み合わせで決まる SwiftUIで画像をレイアウトする際は、以下の4つのメソ…
前回はTCAの一番単純なサンプルである01-GettingStarted-Counterについて説明しました。 bamboo-hero.com 今回は01-GettingStarted-Composition-TwoCountersについて説明してみます。 小さいモジュールを組み合わせてアプリを構成する Stateのスコープを絞る…
SwiftUIでデータをリスト表示するときに使用するListの使い方と、Listを使うときに注意すべきデータの一意性についてまとめました。 Listの使い方 データの一意性を担保する まとめ Listの使い方 人物名をリスト表示する例を取り上げます。 実装はこんな感じ…
先日TCAで簡単なサンプルアプリを作ってみたのですが、まだまだTCAの理解が曖昧なところが多々あるため、もう一度サンプルコードを一から丁寧に読んでいます。 bamboo-hero.com 理解できたところは順次アウトプットしていこうと思います。 まずは、一番単純…
2日ほどかけてTCA（The Composable Architecture）を使った簡単なサンプルアプリを作りました。 ログインしてホーム画面に遷移するだけの超簡単なサンプルですが、TCAのサンプルコードをずっと眺めているよりも実際にアプリを実装してみたほうが理解もずっと…
以前の記事でナビゲーションバーの色を変更可能にしたNavigationViewの実装方法を紹介しました。 bamboo-hero.com 上記記事では、カスタムModifierを実装し、以下のようにModifierを指定することでナビゲーションバーの色を変更できるようにしました。 Navig…
現状のSwiftUIではナビゲーションバー（NavigationView）の色を変更するModifierが提供されていません。 しかし、ナビゲーションバーの色を変更したいモチベーションは多々あると思います。 本記事では、ViewModifierを使ってナビゲーションバーのスタイルを…
XCodeでSwiftUIの新規プロジェクトを作ったときに、最初はLife CycleとしてSwiftUI Appを選択したけど、後々AppDelegateに変更したいことがありました。 SwiftUI Appを選択してプロジェクトを作成すると、xxxApp.swiftというファイルが作成されてそれがエン…
