SwiftUI 列表不显示图像
SwiftUI List not showing images
我创建了以下结构,这是我希望在 SwiftUI 的列表中使用的数组的一个简短示例:
import Foundation
import SwiftUI
struct Rune: Identifiable {
var runeName: String
var runeImage: String
var runeDescription: String
let id = UUID()
}
let runesArray = [Rune(runeName: "Fehu", runeImage: String(("Fehu.png")), runeDescription: "(Description Goes Here"),
Rune(runeName: "Uruz", runeImage: String(("Uruz.png")), runeDescription: "(Description Goes Here"),
Rune(runeName: "Thurisaz", runeImage: String(("Thurisaz.png")), runeDescription: "(Description Goes Here"]
当我使用以下代码时,我的图像没有显示,但是当我单击该行并转到我的 DetailView 时,我的文本 runeName 文本 runeDescription 按预期显示,但我不知道为什么:
内容视图:
import SwiftUI
struct ContentView: View {
var body: some View {
NavigationView {
List(runesArray) { rune in
NavigationLink(destination: DetailView(rune: rune)) {
RuneRow(rune: rune)
}
}
.navigationBarTitle("Rune Companion")
}
}
}
struct ContentView_Previews: PreviewProvider {
static var previews: some View {
ContentView()
}
}
struct RuneRow: View {
let rune: Rune
var body: some View {
HStack {
Image(rune.runeImage)
.resizable()
.aspectRatio(contentMode: .fit)
.frame(width: 60, height: 60)
Spacer()
Text(rune.runeName)
.font(.title)
.fontWeight(.bold)
Spacer()
}
}
}
详细视图:
import SwiftUI
struct DetailView: View {
let rune: Rune
var body: some View {
NavigationView {
VStack {
Spacer()
Image(rune.runeImage)
.resizable()
.aspectRatio(contentMode: .fill)
.frame(width: 200, height: 200)
Spacer()
Text(rune.runeDescription)
.padding(.horizontal)
Spacer()
}
.navigationBarTitle(rune.runeName)
.navigationBarTitleDisplayMode(.large)
}
}
}
struct DetailView_Previews: PreviewProvider {
static var previews: some View {
DetailView(rune: runesArray[0])
}
}
当我将 Image(rune.runeImage)
更改为 Image("Fehu")
时,Fehu 的图像确实出现了,但它应该填充所有三行,表明我的图像可以成功加载。知道我做错了什么吗?
您无需为图片指定扩展名 (.png
)。
替换:
runeImage: String(("Fehu.png"))
与:
runeImage: "Fehu"
当您在 runesArray
中创建符文时。
我创建了以下结构,这是我希望在 SwiftUI 的列表中使用的数组的一个简短示例:
import Foundation
import SwiftUI
struct Rune: Identifiable {
var runeName: String
var runeImage: String
var runeDescription: String
let id = UUID()
}
let runesArray = [Rune(runeName: "Fehu", runeImage: String(("Fehu.png")), runeDescription: "(Description Goes Here"),
Rune(runeName: "Uruz", runeImage: String(("Uruz.png")), runeDescription: "(Description Goes Here"),
Rune(runeName: "Thurisaz", runeImage: String(("Thurisaz.png")), runeDescription: "(Description Goes Here"]
当我使用以下代码时,我的图像没有显示,但是当我单击该行并转到我的 DetailView 时,我的文本 runeName 文本 runeDescription 按预期显示,但我不知道为什么:
内容视图:
import SwiftUI
struct ContentView: View {
var body: some View {
NavigationView {
List(runesArray) { rune in
NavigationLink(destination: DetailView(rune: rune)) {
RuneRow(rune: rune)
}
}
.navigationBarTitle("Rune Companion")
}
}
}
struct ContentView_Previews: PreviewProvider {
static var previews: some View {
ContentView()
}
}
struct RuneRow: View {
let rune: Rune
var body: some View {
HStack {
Image(rune.runeImage)
.resizable()
.aspectRatio(contentMode: .fit)
.frame(width: 60, height: 60)
Spacer()
Text(rune.runeName)
.font(.title)
.fontWeight(.bold)
Spacer()
}
}
}
详细视图:
import SwiftUI
struct DetailView: View {
let rune: Rune
var body: some View {
NavigationView {
VStack {
Spacer()
Image(rune.runeImage)
.resizable()
.aspectRatio(contentMode: .fill)
.frame(width: 200, height: 200)
Spacer()
Text(rune.runeDescription)
.padding(.horizontal)
Spacer()
}
.navigationBarTitle(rune.runeName)
.navigationBarTitleDisplayMode(.large)
}
}
}
struct DetailView_Previews: PreviewProvider {
static var previews: some View {
DetailView(rune: runesArray[0])
}
}
当我将 Image(rune.runeImage)
更改为 Image("Fehu")
时,Fehu 的图像确实出现了,但它应该填充所有三行,表明我的图像可以成功加载。知道我做错了什么吗?
您无需为图片指定扩展名 (.png
)。
替换:
runeImage: String(("Fehu.png"))
与:
runeImage: "Fehu"
当您在 runesArray
中创建符文时。