findNavigatorは、TextEditorビューと組み合わせて使うモディファイアで、TextEditorに検索インタフェースを付与することができます。
findNavigatorを使うと何が出来る？
findNavigatorを使うとTextEditorに入力されている文字列を対象として、検索することができます。
findNavigatorのインタフェースに文字列を入力すると、TextEditor内に同じ文字列があった場合、ハイライトで表示してくれたり、見つかった文字列の数を表示してくれます。
基本的な使い方
サンプルコード
以下にサンプルコードを示します。
サンプルコードの説明
このコードでは、TextEditorにfindNavigatorを付与しています。その下にボタンを設置して、タップするごとに検索インタフェースの表示／非表示を切り替えます。
import SwiftUI
struct FindNavigationSmp: View {
@State var text = "ABBCCCDDDDEEEEEFFFFFFF"
@State var isPresented = false
var body: some View {
TextEditor(text: $text)
.frame(height: 150)
.border(.gray, width: 1)
.padding()
.findNavigator(isPresented: $isPresented)
Button(action: {
isPresented.toggle()
}) {
Label("Find", systemImage: "magnifyingglass")
}
}
}サンプルコードの動作
Findボタンをタップすると、画面下側に検索インタフェースが表示されます。
ここに文字列を入力するとTextEditorビュー内に一致する文字列をハイライト表示します。
検索インタフェースを無効にする【findDisabled】
findNavigatorには関連するモディファイアがあり、findDisabledもその一つです。
findDisabledは、findNavigatorによる検索機能を無効にする機能です。
一見使用する必要がない機能にも思えますが、プログラム制御により検索インタフェースの有効／無効を切り替えたりなどで活用することができます。
サンプルコード
先ほどのサンプルコードにfindDisabledモディファイアを加えています。
import SwiftUI
struct FindNavigationSmp: View {
@State var text = "ABBCCCDDDDEEEEEFFFFFFF"
@State var isPresented = false
@State var isDisabled = false
var body: some View {
TextEditor(text: $text)
.frame(height: 150)
.border(.gray, width: 1)
.padding()
.findDisabled(isDisabled)
.findNavigator(isPresented: $isPresented)
Button(action: {
isPresented.toggle()
}) {
Label("Find", systemImage: "magnifyingglass")
}
Toggle(isOn: $isDisabled) {
Text(isDisabled ? "検索無効" : "検索有効")
}.padding()
}
}サンプルコードの動作
以下のように検索有効／検索無効のトグルスイッチを設置しました。
検索有効の時は、findNavigatorによる検索が可能ですが、無効にするとfindNavigatorが動作しなくなります。
注意点
findDisabledとfindNavigatorの記述順番により、動作が変わりますので注意してください。
上記のサンプルプログラムの場合、順番を逆にすると、findDisabledが機能しなくなります。
置換インタフェースを無効にする【replaceDisabled】
findDisabledと同様で置換機能を無効にする機能があります。replaceDisabledを使います。
使い方はfindDisabledと同様です、
まとめ
findNavigatorを使用することで、SwiftUIアプリケーションのTextEditorビューで簡単に検索機能を追加することができます。
ユーザーがアプリケーション内でテキストを検索できるようにするためには、この機能を利用すると便利です。具体的な要件に応じて、isPresentedの値を制御するロジックを追加するとよいでしょう。
これらの基本的な使い方を参考に、自分のアプリケーションに適した検索機能を実装してみてください。
