SWIFTUI:トップページのボタンが他のページにも反映されてしまう

Question

SwiftUI初心者です。
問題集アプリを作成しようと、まず「トップページ」「問題集リストページ」の骨組みを作りました。
しかし、トップページに挿入したタイトルやボタンが問題集リストページにも反映されてしまって、レイアウトが崩れてしまっています。
トップページのタイトルやボタンが表示されない方法をご教示くださいますようよろしくお願いします。

初歩的な質問ですみません。
よろしくお願い申し上げます。

//（１）トップページ

//
//  ContentView.swift
//  QQQ
//
//  Created by xxx on 2021/01/14.
//

import SwiftUI

struct ContentView: View {
    
    @State var num: Int = 0
    
    var body: some View {
        VStack {
    //タイトル
            Text("問題集タイトル").font(.title).foregroundColor(/*@START_MENU_TOKEN@*/.blue/*@END_MENU_TOKEN@*/)
                .padding(10)
            NavigationView {
                NavigationLink(
                    destination:MenuQ()){
                    Text("学習スタート")
                        
                        }
                    }
    //ボタン
                    Button(action: {
                num = Int.random(in: 0...100)
            }){
                Text("START!!")
                    .font(.largeTitle)
                    .frame(width: 280,height: 60,alignment: .center)
                    .foregroundColor(Color.white)
                    .background(Color.blue)
                    .cornerRadius(15, antialiased: true)
                }
            
        }
    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}


//（２）問題集リストページ

//
//  MenuQ.swift
//  QQQ
//
//  Created by XXX on 2021/01/14.
//

import SwiftUI

struct MenuQ: View {
    var body: some View {
        NavigationView {
            List {
                Text("content 1")
                Text("content 2")
                Text("content 3")
                Text("content 4")
            }
            .navigationTitle(Title))
            .navigationBarTitleDisplayMode(.inline)
        }
    }
}

struct MenuQ_Previews: PreviewProvider {
    static var previews: some View {
        MenuQ()
    }
}


コード

Comments

[hoshi-takanori]

自分も SwiftUI の画面遷移はよく分かってないのですが、たぶん NavigationView を VStack の中ではなく、トップレベルにする必要があると思います。

[kaminiwa]

ご連絡ありがとうございます。
NavigationViewをトップレベルに移動してみましたが、VStack内にあるテキストやボタンが他のページに表示されてしまいます。

ContentView.swiftのデータは他のページにも反映されるのが基本なんでしょうか...

Answer 1

import SwiftUI

struct ContentView: View {

    @State var num: Int = 0

    var body: some View {
    //タイトル
           
        NavigationView {
            VStack{
            Text("問題集タイトル").font(.title).foregroundColor(/*@START_MENU_TOKEN@*/.blue/*@END_MENU_TOKEN@*/)
            NavigationLink(
                destination:MenuQ()){
                Text("学習スタート")
            }

            Button(action: {
            num = Int.random(in: 0...100)
            }){
                Text("START!!")
                .font(.largeTitle)
                .foregroundColor(Color.white)
                .background(Color.blue)
                .cornerRadius(15, antialiased: true)
            }
            }
        }
    //ボタン
                    

    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}


//（２）問題集リストページ

//
//  MenuQ.swift
//  QQQ
//
//  Created by XXX on 2021/01/14.
//

import SwiftUI

struct MenuQ: View {
    var body: some View {

            List {
                Text("content 1")
                Text("content 2")
                Text("content 3")
                Text("content 4")
            }
            .navigationTitle("あ")
            .navigationBarTitleDisplayMode(.inline)
   
    }
}

struct MenuQ_Previews: PreviewProvider {
    static var previews: some View {
        MenuQ()
    }
}

既に解決されてると思いますが、paddingとかは一度弾きました、こうです。
navigationviewのなかのnavigationlink先で新たにnavigationviewを呼ばなくて大丈夫です。navigationviewをいちどよんだらそのview以降はnavigationviewが反映されていることになります。
わかりずらくてすみません。

Comments

[kaminiwa]

ありがとうございました。
解決できました！！