TipKitTips

2026.02.22 Hakodate.swift #1

Transcript

10. TipKit! TipKitの話します。
11. TipKitはこういうヒントを表示するためのフレームワークです。
12. ドキュメントを見るとiOS17以上！
13. そういえば先週、トヨタさんがこんなツイートしてましたね
14. そういえば先週、トヨタさんがこんなツイートしてましたね
15. はい、みなさん使えますね！ガンガンTipKit使っていきましょう！
16. 基本のTipの使い方はこんな感じです。
17. Tipを定義して、
18. popoverTipでボタンにTipを生やしています。
19. Tipの出し方はinlineとpopoverの2種類あり、ここではpopoverを使ってます。
20. ここでTip！背景色を変えたい。
21. これを
22. …こうしたい。
23. 一部の簡単なスタイル変更は、専用のAPIが用意されています。 背景色を変更するには、tipBackgroundが使えます。
24. ドキュメントを見るとpopoverのTipには現在適用されないということになってますが…
25. 使えます。
26. ここでTip！もっとスタイルを変えたい。
27. これを
28. …こうしたい。
29. もっとカスタマイズしたい場合はTipViewStyleを使います。 TipViewStyleを適用した構造体にスタイルを定義し、スタイルを適用したいTipの階層にtipViewStyleで設定すればカスタマイズできます。 こんな感じでZStackでColorを敷いて、吹き出しをプライマリーカラーになるようにして〜… …おっと。しっぽの部分に色がついてない！
31. TipViewStyleは尻尾の部分をいじることができません。 そんなときは先ほどのtipBackgroundを使うと背景をつけることだけはできます！
33. さて、TipKitの大きな特徴として、Tipの状態をTipKit側で制御してくれます。 書き方は大きく2種類あり、TipKitのマクロの@Parameterから判定する方法と、Eventを定義して、そのイベントから判定する方法です。 TipKitが状態を持ってくれるなんて便利だなぁ…アプリに新規で実装する場合はそう思うかもしれません。
34. 問題となるのは、既存のヒントをTipKitに移行する場合です。 例えば、 アプリが制御していたものをTipKit内部のものに差し替えることになるので表示条件の状態がリセットされたり TipKit内ではAPIやUserDefaultを呼び出せなかったり Viewと状態がめちゃ密結合で既存のアーキテクチャと合わなくてキモかったり @ParameterはTipKitのマクロなので、外部の値をそのまま挿入できなかったり… つまりTipKitから状態を剥がさないと使いにくい状況になります。
35. ここでTip！TipKitから状態を引き剥がしたい
37. まず、普通にTipKit内で状態を管理するパラメータを定義します。
38. そして、Rulesでパラメータがtrueの時に表示するように設定します
39. @ParameterはTipKitのマクロなので、ここにそのまま値を挿入することはできません。なので、値を挿入できるようにラップしていきます。
41. 挿入したい値をwrappingValueとして定義しています。ここは本来ViewModelなどもっと上層からTipKitに渡したい値になりますが、便宜上@Stateとして定義しています。
42. onChangeでwrappingValueの変更を監視し、MemoTipのパラメータに挿入します。
43. onChangeだけだと初期化時にwrappingValueの値がMemoTipのパラメータに反映されないので、onAppearでも挿入します。
44. こうすることで、TipKitから状態を引き剥がし、外部から値を挿入することができるようになります。 TipKitくんがよかれと思って状態管理を引き取ったことで事態が複雑化していて、世の無情さを感じることができますね。
45. こうすることで、TipKitから状態を引き剥がし、外部から値を挿入することができるようになります。 TipKitくんがよかれと思って状態管理を引き取ったことで事態が複雑化していて、世の無情さを感じることができますね。
46. TipKitの哀愁を感じたところで、TipKitTips is over！ 自分ならもっとTipKitをイキイキさせてやれると思った方、TipKitチャンスです。 今回はLTなので大幅に端折ってますが、インタラクションを入れたり、結構色々な使い方ができます。 ぜひTipKitを使って快適なアプリ体験を提供しましょう！ありがとうございました〜