swift - 带有标签图像和文本的 SwiftUI 菜单

Question

正如您在图像中看到的那样，我想将照片放在它所说的下拉菜单中Paul。

我试图插入它，但我得到了一个奇怪的效果，恰好图像占据了所有空间，你再也看不到文字了。

你能帮我个忙吗？

import Foundation
import SwiftUI

struct RemoteImage: View {
    private enum LoadState {
        case loading, success, failure
    }
    
    private class Loader: ObservableObject {
        var data = Data()
        var state = LoadState.loading
        
        init(url: String) {
            guard let parsedURL = URL(string: url) else {
                fatalError("Invalid URL: \(url)")
            }
            
            URLSession.shared.dataTask(with: parsedURL) { data, response, error in
                if let data = data, data.count > 0 {
                    self.data = data
                    self.state = .success
                } else {
                    self.state = .failure
                }
                
                DispatchQueue.main.async {
                    self.objectWillChange.send()
                }
            }.resume()
        }
    }
    
    @StateObject private var loader: Loader
    var loading: Image
    var failure: Image
    
    var body: some View {
        selectImage()
            .resizable()
    }
    
    init(url: String, loading: Image = Image(systemName: "photo"), failure: Image = Image(systemName: "multiply.circle")) {
        _loader = StateObject(wrappedValue: Loader(url: url))
        self.loading = loading
        self.failure = failure
    }
    
    private func selectImage() -> Image {
        switch loader.state {
        case .loading:
            return loading
        case .failure:
            return failure
        default:
            if let image = NSImage(data: loader.data) {
                return Image(nsImage: image)
            } else {
                return failure
            }
        }
    }
}

struct Test: View {
    
    var body: some View {
        VStack(alignment: .trailing){
            Menu {
                Button(action: {
                    NSApplication.shared.terminate(self)
                }) {
                    Text("Esci")
                }
            } label: {
                RemoteImage(url: "https://upload.wikimedia.org/wikipedia/commons/thumb/9/96/Leonardo_Dicaprio_Cannes_2019_2.jpg/440px-Leonardo_Dicaprio_Cannes_2019_2.jpg")
                    .aspectRatio(contentMode: .fit)
                    .frame(width: 20, height: 20)
                    .cornerRadius(10)
                Text("Paul")
            }
            .menuStyle(BorderlessButtonMenuStyle())
            .frame(width: 80, height: 16)
            .padding(3)
            .cornerRadius(4)
            .help("Impostazioni")
        }
        .frame(width: 360, height: 360)
    }
}

标签： swiftswiftui