从数组中显示带有名称的随机图像。 (SwiftUI)

Posted 2023-02-24

【中文标题】从数组中显示带有名称的随机图像。 (SwiftUI)

【英文标题】：Show random images with their names from an array. (SwiftUI)

【发布时间】：2020-03-21 11:24:42

【问题描述】：

swiftUI 新手，我需要通过按钮操作随机显示图像及其名称。每次用户点击 contentView 文件中的按钮时，我应该如何调用图片的数组来显示随机图片？

这是我想在 contentView 中随机显示的图片数组（图片放在 Assets 文件夹中）：

struct aPicture: Identifiable 
    var id: Int
    var name: String
    var imageName: String



let pictures = [
    aPicture(id: 0, name: "1", imageName: "1"),
    aPicture(id: 1, name: "2", imageName: "2"),
    aPicture(id: 2, name: "3", imageName: "3"),
    aPicture(id: 3, name: "4", imageName: "4"),
    aPicture(id: 4, name: "5", imageName: "5"),
    aPicture(id: 5, name: "6", imageName: "6"),
]

【问题讨论】：

到目前为止你尝试过什么？你会显示代码吗？

【参考方案1】：

你可以试试这个：

 struct ContentView: View 

    struct aPicture: Identifiable 
        var id: Int
        var name: String
        var imageName: String
    

    @State var random : Int = 0


    let pictures = [
        aPicture(id: 0, name: "1", imageName: "1"),
        aPicture(id: 1, name: "2", imageName: "2"),
        aPicture(id: 2, name: "3", imageName: "3"),
        aPicture(id: 3, name: "4", imageName: "4"),
        aPicture(id: 4, name: "5", imageName: "5"),
        aPicture(id: 5, name: "6", imageName: "6"),
    ]

    var body: some View 
        VStack 
            HStack 
                Spacer()
                Text(pictures[self.random].name)
                    .background(Color.white)
                Spacer()
                Button("Next image") 
                    self.random = Int.random(in: 0..<self.pictures.count)
                
                Spacer()
            

            Image(pictures[self.random].imageName)
            .resizable()
            .scaledToFit()
        
    

【讨论】：

如何在文本框中显示“aPicture”的“name”属性，由您的“随机”代码随机选择？

我更新了答案，现在也显示了图片的名称。

【参考方案2】：

我建议你采取不同的方法。 1）你可以直接生成随机元素

let picture = pictures.randomElement() ?? default_if_empty_collection

2) 用户希望在点击后看到不同的图片，这不可能。您的“商店”中的图片越少，您更有可能随机生成相同的图片（这可能看起来像“点击时什么都没有发生”）

下一个 sn-p 展示了如何解决这个问题。每次点击用户都会看到不同的图片，即使我们的收藏中只有树图片。

import SwiftUI

struct ContentView: View 
    @State var img  = Image(systemName: "questionmark.square.fill")
    let imgs = [Image(systemName: "trash"),
                Image(systemName: "trash.fill"),
                Image(systemName: "trash.slash"),

    ]

    var body: some View 
        img
            .resizable()
            .scaledToFit()
            .frame(maxWidth: .infinity)
            .onTapGesture 
                var tmp: Image
                repeat 
                    tmp = self.imgs.randomElement() ?? self.img
                 while tmp == self.img
                self.img = tmp
        
    


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

【讨论】：

谢谢，这很酷。但是我不得不随机选择一个带有各种属性（例如名称、日期、位置等）的图像，然后在堆栈视图中显示它们。

没问题，你可以。你有一些集合，你可以从中随机获取元素并检查它是否与当前不同......