【SwiftUI】NavigationLinkを条件によって画面遷移させる方法

この記事からわかること

  • Swift UINavigationLink条件によってコントロールする
  • クリック以外で画面遷移させる方法
  • リンクボタン有効/無効切り替えるには?
  • EmptyView使い方

index

[open]

\ アプリをリリースしました /

みんなの誕生日

友達や家族の誕生日をメモ!通知も届く-みんなの誕生日-

posted withアプリーチ

Swift UIを使ってiOSアプリを開発中に画面遷移を条件によって有効/無効にする必要があったので実装方法をまとめていきたいと思います。

NavigationLinkを条件によって画面遷移させる方法

公式サイトに方法は載っていましたが、iOS 13.0–16.0は非推奨(Deprecated)になっていたので使用には注意が必要かもしれません。

今回はボタンのクリックにより画面遷移できるように作成していきます。ポイントはBool値を切り替えることなので色々な方法に活用できそうです。

実装方法の流れとポイント

引数に渡すBool値のプロパティを宣言

まずは引数に渡すようのBool値のプロパティを用意します。デフォルト値は画面遷移をしないことを表すfalseにしておきます。

@State  var isActive:Bool = false

NavigationLinkの引数にisActiveを追加

次にNavigationLinkの画面遷移をBool値でコントロールできるように引数にisActiveを追加した構文に書き換えます。

NavigationLink(destination: ListCashView(),
  isActive: $isActive, 
  label: {
    EmptyView()
  })

引数destinationには画面遷移させたいビューを渡します。isActiveには先程定義したプロパティをバインディングしておきます。

空のビューを作成する:EmptyView()

@frozen  struct EmptyView

引数labelには何も表示させたくないのでEmptyView()空のビューを明示的に指定しておきます。

EmptyView()はあらかじめ定義されているView構造体です。中にビューを何かしら定義しないといけない時に使用できます。

Bool値を操作するボタンを用意

これでプロパティとNavigationLinkとの紐付けが完了したのであとはプロパティの真偽値を操作するボタンを作っていくだけです。

Button(action: {
          isActive = true
    }, label: {
        Image(systemName: "list.bullet").padding()
        .font(.system(size: 20))
}) 

ボタンをクリック時に実行されるアクションの中にプロパティisActivetrueを格納する処理を記述します。

これでボタンをクリックされたタイミングで画面遷移が実行される処理が完成しました。プロパティへの真偽値の格納をボタンではなく別の処理にすればNavigationLinkを基本は無効に、特定の場合のみ有効にするといったことも実現可能です。

例えば下記は実際に私がアプリ開発で用いた「allCashData.allDataプロパティが空の場合は無効に、値があれば有効にする」場合のコードです。

Button(action: {
    if allCashData.allData.isEmpty {
        isLinkEnable = false
    }else{
        isLinkEnable = true
    }
    
}, label: {
    Spacer()
    Image(systemName: "list.bullet").padding()
    .font(.system(size: 20))
    
})

NavigationLink(destination: ListCashView(parentRefreshFunction: self.refreshData),isActive: $isLinkEnable, label: {
    EmptyView()
})

まだまだ勉強中ですので間違っている点や至らぬ点がありましたら教えていただけると助かります。

ご覧いただきありがとうございました。

searchbox

スポンサー

ProFile

ame

趣味:読書,プログラミング学習,サイト制作,ブログ

IT嫌いを克服するためにITパスを取得しようと勉強してからサイト制作が趣味に変わりました笑
今はCMSを使わずこのサイトを完全自作でサイト運営中〜

自作iOSアプリ

\ アプリをリリースしました /

mapping

自分だけの地図を作ろう!-mapping-

無料posted withアプリーチ

割り勘アプリ-bill-

旅行におすすめ!
割り勘アプリ-bill-

無料posted withアプリーチ

Imakoko

現在地を取得するアプリ!Imakoko

無料posted withアプリーチ

ふるログ

ふるさと納税管理アプリ-ふるログ-

無料posted withアプリーチ

Remind-シンプル通知アプリ-

シンプル通知アプリ-Remind-

無料posted withアプリーチ

CLIPURL

好きな記事をクリップしよう!-CLIPURL-

無料posted withアプリーチ

記録カレンダー

続けたを可視化できるアプリ!記録カレンダー

無料posted withアプリーチ

CART-共有できるお買い物リスト-

CART-共有できるお買い物リスト-

無料posted withアプリーチ

QuickPressPanel

早押しゲーム-QuickPressPanel-

無料posted withアプリーチ

貸し借り管理アプリ

友達とのお金の管理-貸し借り管理アプリ-

無料posted withアプリーチ

みんなの誕生日

友達や家族の誕生日をメモ!通知も届く-みんなの誕生日-

posted withアプリーチ

Githubにて
iOSアプリのソースコードを公開中!

自作Webアプリ

子育て知識共有サイト-mikata-

子育て知識共有サイト-mikata-

New Article

index