質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
Xcode

Xcodeはソフトウェア開発のための、Appleの統合開発環境です。Mac OSXに付随するかたちで配布されています。

Swift

Swiftは、アップルのiOSおよびOS Xのためのプログラミング言語で、Objective-CやObjective-C++と共存することが意図されています

Q&A

解決済

1回答

1113閲覧

SwiftUIのNavigationLinkで画像がグレーアウトしてしまう

Hyperbolic4183

総合スコア17

Xcode

Xcodeはソフトウェア開発のための、Appleの統合開発環境です。Mac OSXに付随するかたちで配布されています。

Swift

Swiftは、アップルのiOSおよびOS Xのためのプログラミング言語で、Objective-CやObjective-C++と共存することが意図されています

0グッド

0クリップ

投稿2020/05/22 05:28

##起きていること
イメージ説明 イメージ説明

SwiftUIでscrollview水平方向におき、配置された画像を押すことで画面遷移を行いたいです。
添付した右の画像はNavigationLinkを書いていない状態のものです。NavigationLinkを書くと、左の画像のように画像がグレーアウトしてしまいます。原因はどこにあるでしょうか。

##試したこと
SwiftUIの公式チュートリアルを参考にして作っているので、サンプルコードとよく見比べました。

##ソースコード

swift

1import SwiftUI 2 3struct Home: View { 4 var categoryName: String 5 var items: [colorData] 6 7 var body: some View { 8 VStack(alignment: .leading) { 9 Text(self.categoryName) 10 .font(.headline) 11 .padding(.leading, 15) 12 .padding(.top, 5) 13 14 ScrollView(.horizontal, showsIndicators: false) { 15 HStack(alignment: .top, spacing: 0) { 16 ForEach(self.items) { colordata in 17 NavigationLink( 18 destination: ColorCellView( 19 colorData: colordata 20 21 ) 22 ) { 23 CategoryItem(colorData: colordata) 24 25 } 26 } 27 } 28 29 } 30 .frame(height: 185) 31 } 32} 33} 34struct CategoryItem: View { 35 var colorData: colorData 36 var body: some View { 37 VStack(alignment: .leading) { 38 colorData.image 39 .resizable() 40 .frame(width: 155, height: 155) 41 .cornerRadius(5) 42 Text(colorData.name) 43 .foregroundColor(.primary) 44 .font(.caption) 45 } 46 .padding(.leading, 15) 47 } 48} 49 50struct Home_Previews: PreviewProvider { 51 static var previews: some View { 52 Home(categoryName: ColorDataR[3].name, items: Array(ColorDataR.prefix(4))) 53 .environmentObject(testData()) 54 55 } 56} 57

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答1

0

ベストアンサー

buttonStyle を追加してみてください。
これで表示されると思います。

ForEach(self.items) { colordata in NavigationLink(destination: ColorCellView(colorData: colordata)) { CategoryItem(colorData: colordata) } .buttonStyle(PlainButtonStyle()) // 追加 }

が,全体を NavigationView {} でラップしないと遷移はしないと思います。
(あ,親ビューでラップしてるなら二重にかける必要はないです)
モーダル遷移で良ければ .sheet 使えばいいですね。

投稿2020/05/22 06:28

編集2020/05/22 06:36
TakuyaAso

総合スコア1361

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

Hyperbolic4183

2020/05/22 07:12

親viewをNavigationView{}で囲む & .buttonStyle(PlainButtonStyle( ))で解決しました。本当にありがとうございます! 以下詳細です。 NavigationViewで囲むことでグレーアウトではなく、画像のframeが水色で表示されるようになりました。 (画像は表示されませんが、遷移はできる状態) .buttonStyle(PlainButtonStyle( ))で画像が表示されるようになりました。
TakuyaAso

2020/05/22 07:45

想定通りですーありがとうございます。よかったです!
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問