第 4 回 中学生でもわかるiPhoneアプリ開発を始めます。
この入門ではSwiftUIを用いて、動画投稿アプリ(Y○utube)を真似したアプリを作成及び解説をして参ります。
上記の動画ではハンズオン形式で解説しておりますので是非興味がある方はご覧ください。٩( ‘ω’ )و
今までにXCodeやプログラミンをしたことがない方やiPhoneアプリを開発したことがない方でも開発できるように解説して参ります。不明な点などございましたらYouTubeのコメントください。
今回は画面遷移について勉強します。
画面遷移には大きく分けて2パターンあります。
| ・NavigationView(NavigationLink)遷移⬅︎今回はこちらをご紹介します |
| ・sheet遷移 |
★NavigationView(NavigationLink)とは
簡単に説明するとボタンです。NavigationLink(ボタン)を押下すると画面遷移ができます。
ただ、NavigationLinkはそのまま使用することはできません。NavigationViewの元で使用することができます。
★一般的に使用される公式
①NavigationLink(destination: View , isActive : $Bool変数 , label : Text or Image )
②NavigationLink(title : Title , destination : View)
| ・destination : 遷移するViewを指定できます。 |
| ・isActive : @Stateで指定した変数を指定することで、その変数の Bool 値 がtrueとなる時画面遷移することもできます。 |
| ・label : Text や Image のボタンにすることができます。 |
| ・title : ボタンのタイトルを指定します。 |
実際に確認してみましょう。
下記のようにコーディングします。
struct ContentView: View {
var body: some View {
NavigationView {
NavigationLink(destination: NextView(),label : {Text("画面遷移します")})
}
}
}
struct NextView: View {
var body: some View {
Text("画面遷移されました")
}
}これで実行してみましょう。
「画面遷移します」ボタンを押下してみます。
このようにボタンを押下することで画面遷移することができました。
★補足説明
NavigationLinkのLabelで表示している「画面遷移します」ボタンを押下すると、NavigationLinkのdestination : で指定しているNextViewの「画面遷移されました」の画面に遷移されていることが確認できます。
※「Back」ボタンはNavigationViewを設定していることで自動的に設置されます。
以上で
第 4 回 中学生でもわかるiPhoneアプリ開発を終了致します。ご視聴いただきありがとうございました。(#^.^#)
参考文献
NavigationView(Apple Developer Documentation)
※個人の見解による意見でございます。参考程度にお願い致します。
著作者 Nishimura Taichi , Kurogi Misato
コメント