Perguntas[swiftui](coding)

Estou curioso, há uma maneira de dizer ao chartXSelection(value:)modificador para incluir a área do eixo x ao responder aos gestos do usuário? Sei que iniciar um toque na área do gráfico e arrastar para baixo funciona, mas gostaria que o usuário pudesse apenas tocar em um valor que ele gosta no eixo x e tê-lo registrado por chartXSelection.

Veja o código de exemplo abaixo (editado para incluir tall axisMarks para demonstrar um problema com uma solução proposta):

private struct PlotPoint {
    let x: Double
    let y: Double
}

private struct PlotSeries: Identifiable {
    let id: Int
    let name: String
    let points: [PlotPoint]
}

private let data: [PlotSeries] = [
    PlotSeries(id: 0, name: "Series A", points: stride(from: 0.0, through: 1.0, by: 0.05).map { y in PlotPoint(x: y*y, y: y) }),
    PlotSeries(id: 1, name: "Series B", points: stride(from: 0.0, through: 1.0, by: 0.05).map { y in PlotPoint(x: y*y, y: y/2) })
]

struct AxisTap: View {
    @State private var selectedX: Double?
    var body: some View {
        VStack {
            Chart {
                if let selectedX {
                    BarMark(xStart: .value("x", selectedX), xEnd: .value("x", selectedX + 0.05))
                        .foregroundStyle(.yellow.opacity(0.5))
                }

                ForEach(data) { series in
                    let plot = LinePlot( series.points, x: .value("x", \.x), y: .value("y", \.y))
                    
                    plot
                        .symbol(by: .value("Series", series.name))
                        .foregroundStyle(by: .value("Series", series.name))
                }
            }
            .chartXAxis {
                AxisMarks() { value in
                    AxisGridLine()
                    AxisTick()
                    AxisValueLabel() {
                        if let axisValue = value.as(Double.self) {
                            VStack {
                                Text("|")
                                Text("v")
                                Text("\(axisValue.formatted())")
                            }
                        }
                    }
                }
            }
            .chartXSelection(value: $selectedX)
            .padding()
            Text("selectedX is: \(selectedX ?? 0.0)")
        }
    }
}

Gostaria que o usuário pudesse tocar em "0,5" no eixo x e obter um resultado como o mostrado abaixo (com "selectedX is: ~0,5" abaixo).

Tenho um SwiftUI List(no macOS) onde quero exibir alguns TextFieldsem cada linha e observar como o foco muda conforme um campo de texto individual é selecionado ou desmarcado. Isso parece funcionar bem se eu apenas tiver a Listexibição pura TextFieldem cada linha, mas se eu incorporar TextFielddentro de uma Buttonvisualização, as notificações de mudança de foco param de funcionar. Quero a funcionalidade de 'botão' para que o usuário possa tocar em qualquer lugar da linha e ter o campo de texto ativado, em vez de tocar exatamente no limite do campo de texto.

Aqui está um código para demonstrar o problema. Se Listvocê tiver RowViewdescomentado (1), então as notificações de mudança de foco funcionam. Se você comentar isso e descomentar RowViewWithButton(2), então a funcionalidade do botão funciona, mas não consigo mais receber notificações de mudança de foco.

import SwiftUI

// test on macOS target
struct ContentView: View {
    @State private var textFields = Array(repeating: "", count: 4)
    @FocusState private var focusedField: Int?

    var body: some View {
        List(0..<4, id: \.self) { index in
            
            // 1. works with focus notification changes
            RowView(index: index, text: $textFields[index], focusedField: $focusedField)
            
            // 2. button works, but no focus notifications on text field
            //RowViewWithButton(index: index, text: $textFields[index], focusedField: $focusedField)
        }
    }
}

struct RowView: View {
    let index: Int
    @Binding var text: String
    @FocusState.Binding var focusedField: Int?

    var body: some View {
        HStack {
            Text("Row \(index + 1):")
            TextField("", text: $text)
                .multilineTextAlignment(.leading)
                .focused($focusedField, equals: index)
        }
        .onChange(of: focusedField) { newFocus in
            if newFocus == index {
                print("TextField \(index) is in focus")
            } else {
                print("TextField \(index) lost focus")
            }
        }
        .padding(.vertical, 4)
    }
}


struct RowViewWithButton: View {
    let index: Int
    @Binding var text: String
    @FocusState.Binding var focusedField: Int?

    var body: some View {
        Button (action: {
            print("RowView - button selected at index \(index)")
            focusedField = index
        }) {
            HStack {
                Text("Row \(index + 1):")
                TextField("", text: $text)
                    .multilineTextAlignment(.leading)
                    .focused($focusedField, equals: index)
            }
            .onChange(of: focusedField) { newFocus in
                if newFocus == index {
                    print("TextField \(index) is in focus")
                } else {
                    print("TextField \(index) lost focus")
                }
            }
            .foregroundColor(.primary)
        }
        .buttonStyle(BorderlessButtonStyle())
        .padding(.vertical, 4)
    }
}

#Preview {
    ContentView()
        .frame(width: 320, height: 250)
}

Curiosamente, quando eu testo isso no iOS, funciona bem em ambos os casos. Mas eu preciso da solução para macOS.

ATUALIZAR:

Usar onTapGestureem vez de a Buttonmelhora as coisas, mas introduz um novo bug. Se eu tocar na linha inicialmente, inicialmente funciona bem, e tocar em qualquer lugar ativará o campo de texto. Mas depois de digitar algum texto e pressionar a tecla Enter (ou perder o foco de qualquer forma), se eu tentar tocar na parte da linha onde TextFieldestá o, ele só funciona se tocado no texto existente... não no espaço vazio na frente dele.

Adicionei .background(.red)ao HStack e .background(.blue)adicionei uma captura de tela para demonstrar o problema.

Não consegui encontrar nenhum exemplo para reproduzir a seguinte parte da interface do usuário (exemplo retirado do XCode):

Um botão + (encontrei muitos deles - este é um botão de gradiente) na parte inferior de uma lista (também muitos exemplos) que, quando clicado com o botão esquerdo, abre um menu com qualquer seta.

Encontrei um exemplo de botões que mostram um popover, mas sempre há uma seta. E usar Menu(no macOS) na verdade mostra um menu (com uma seta).

Estou tentando escrever uma versão para macOS de https://stackoverflow.com/a/74935849/2178159 .

Pelo que entendi, eu deveria conseguir definir a menupropriedade de um NSRespondere ela será exibida automaticamente ao clicar com o botão direito.

Eu tentei algumas coisas:

A: definido menuem um NSHostingController's view- quando eu faço isso e clico com o botão direito ou ctrl, nada acontece. B: definido menudiretamente NSHostingController- quando eu faço isso, ocorre um travamento Abstract method -[NSResponder setMenu:] called from class _TtGC7SwiftUI19NSHostingControllerGVS_21_ViewModifier_...__. Subclasses must override C: chamada manual NSMenu.popupem uma subclasse personalizada do método NSHostingControllerou NSView's rightMouseDown- nada acontece.

extension View {
    func contextMenu(menu: NSMenu) -> some View {
        modifier(ContextMenuViewModifier(menu: menu))
    }
}

struct ContextMenuViewModifier: ViewModifier {
    let menu: NSMenu

    func body(content: Content) -> some View {
        Interaction_UI(
            view: { content },
            menu: menu
        )
            .fixedSize()
    }
}

private struct Interaction_UI<Content: View>: NSViewRepresentable {
    typealias NSViewType = NSView

    @ViewBuilder var view: Content
    let menu: NSMenu

    func makeNSView(context: Context) -> NSView {
        let v = NSHostingController(rootView: view)

        // option A - no effect
        v.view.menu = menu

        // option B - crash
        v.menu = menu

        return v.view
    }

    func updateNSView(_ nsView: NSViewType, context: Context) {
        // part of option A
        nsView.menu = menu
    }
}

Estou tentando clonar o aplicativo Notas.

Estou implementando um layout de 3 colunas usando NavigationSplitView.

var body: some View {
    NavigationSplitView {
        GroupListView(selectedGroup: $selectedGroup)
    } content: {
        DiaryListView(selectedDiary: $selectedDiary)
            .environment(\.horizontalSizeClass, horzSizeClass)
    } detail: {
        DiaryView(diary: selectedDiary)
            .environment(\.horizontalSizeClass, horzSizeClass)
    }
}

Em WindowGroup, ocultei a barra de título.

WindowGroup {
    MainLayoutView()
        .environmentObject(auth)
}
.windowStyle(.hiddenTitleBar)

Na coluna "Conteúdo", estou exibindo uma lista usando Liste adicionei botões usando .toolbar.

No entanto, como não há fundo, o conteúdo se sobrepõe.

Por outro lado, se eu mostrar a barra de título novamente, as colunas "Conteúdo" e "Detalhe" não serão distinguidas visualmente na barra de título.

Como posso implementá-lo exatamente como o aplicativo Notas?

Estou tentando criar uma visualização circular de conquistas semelhante à vista no Apple Game Center usando SwiftUI. A visualização deve ter texto circular no topo e um texto wrapper de arco centralizado.

Aqui está o que pretendo alcançar:

Texto Circular: Texto organizado de forma circular na parte superior da visualização. Título do Arco: Um título que envolve um arco, centralizado dentro da visualização circular. Tentei usar as visualizações ZStack e Texto com rotação, mas estou tendo problemas para alinhar o texto corretamente em um caminho circular. Além disso, não tenho certeza de como posicionar o título do arco corretamente.

Esta é uma pergunta complementar à minha pergunta anterior aqui :

Na resposta, o passo dos tiques é codificado, com base nos dados de exemplo que forneci:

AxisMarks(position: .bottom, values: .stride(by: 100)) {
    AxisValueLabel(anchor: .top)
}

Mas os dados são variáveis ​​e, às vezes, o passo precisa ser, por exemplo, apenas 10 ou qualquer outro número.

Então comecei com uma variável local:

var xStride = 100, o que me deu o seguinte erro:

Não é possível converter o valor do tipo 'Int' para o tipo de argumento esperado 'Calendar.Component'

Então tentei converter a variável:

var xStride = Calendar.Component(100), e agora o erro é:

'Calendar.Component' não pode ser construído porque não possui inicializadores acessíveis

O que eu também não entendo é que meu gráfico é apenas um gráfico xy e não lida com dias, anos ou o que quer que seja.

Então, posso fazer isso e como?

Eu sei que essa pergunta já foi feita muitas vezes e ela se resume a melhorar seu código, mas não consigo descobrir onde está o problema. Espero que alguém com mais conhecimento possa me ajudar.

fineDine.rápido

import SwiftUI
import SwiftData

@main
struct fineDineApp: App {
    var body: some Scene {
        WindowGroup {
            searchResults(searchValue: "")
                .modelContainer(for: Review.self)
        }
    }
}

resultados de pesquisa.swift

import SwiftUI
import SwiftData

struct searchResults: View {
    @State private var isPresentingNewMealView = false
    @State var searchValue: String
    @Query var review: [Review]
    @Environment(\.modelContext) var modelContext
    
    var body: some View {  <---Where the error always pops up
        NavigationStack {
            ZStack {
                LinearGradient(gradient: Gradient(colors: [Color(red: 0.9725490196078431, green: 0.9607843137254902, blue: 0.8627450980392157, opacity: 1), Color(red: 0.9137254901960784, green: 0.9254901960784314, blue: 0.8509803921568627, opacity: 1), Color(red: 0.9882352941176471, green: 0.7529411764705882, blue: 0.13333333333333333, opacity: 1), Color(red: 0.9450980392156862, green: 0.47058823529411764, blue: 0.08627450980392157, opacity: 1)]), startPoint: .top, endPoint: .bottom).ignoresSafeArea()
                VStack{
                    Text("Which Food...")
                        .font(.system(size: 30, weight: .bold, design: .default))
                        .padding()
                    Image(systemName: "fork.knife.circle.fill")
                        .font(.system(size: 100))
                        .foregroundStyle(.black)
                    TextField("Enter Food or Restaurant", text: $searchValue)
                        .frame(width: 300, height: 50, alignment: .center)
                        .background(Color.white.opacity(0.4).cornerRadius(10))
                        .fontWeight(.medium)
                        .foregroundColor(Color.black)
                        .multilineTextAlignment(TextAlignment.center)
                    
                    Spacer()
                    
                    List {
                        
                        ForEach(review) { review in
                            NavigationLink(destination: IndividualItemView())
                            {
                                VStack(alignment: .leading)
                                {
                                    Text(review.foodName)
                                        .font(.headline)
                                }
                            }
                        }.listRowBackground(Color.white.opacity(0.4).cornerRadius(5))
                    }  .scrollContentBackground(.hidden)
                    
                    .toolbar {
                     Button(action: {isPresentingNewMealView = true}
                    ) {
                     Image(systemName: "plus")
                     }
                    
                    .sheet(isPresented: $isPresentingNewMealView) {
                         EditMealView(isPresentingNewMealView: $isPresentingNewMealView, mealImage: Image(""), review: Review(foodName: "", restaurantName: "", rating: 3, foodType: "", reviewNotes: "Enter Notes"))
                     }
                     
                     }
                     
                    
                }
            }
                }
            
            }
        
        }

#Preview {
    searchResults(searchValue: "")
}

individualItemView.swift

import SwiftUI
import SwiftData

struct IndividualItemView: View {
    @Bindable var review: Review <---- commenting this out and then fixing the other issues seems to resolve the error but then nothing shows.
    @Environment(\.modelContext) private var modelContext

    var body: some View {
        NavigationStack {
        ZStack {
            LinearGradient(gradient: Gradient(colors: [Color(red: 0.9725490196078431, green: 0.9607843137254902, blue: 0.8627450980392157, opacity: 1), Color(red: 0.9137254901960784, green: 0.9254901960784314, blue: 0.8509803921568627, opacity: 1), Color(red: 0.9882352941176471, green: 0.7529411764705882, blue: 0.13333333333333333, opacity: 1), Color(red: 0.9450980392156862, green: 0.47058823529411764, blue: 0.08627450980392157, opacity: 1)]), startPoint: .top, endPoint: .bottom).ignoresSafeArea()
            
            VStack {
            VStack(alignment: .leading)
            {
                Text(review.foodName)
                   .font(.system(size: 30, weight: .bold, design: .default))
                Text(review.restaurantName)
                Text(review.foodType)
            }
                VStack {
                    Image("friedFood")
                        .resizable()
                    .frame(width: 300, height: 300)
                        .cornerRadius(5)
                        .padding()
                    Label("\(review.rating)", systemImage: "star.fill")
                        .foregroundStyle(Color.mint)
                        .multilineTextAlignment(.center)
                        .padding()
                    Text(review.reviewNotes)
                        .padding(.horizontal)
                }
            }

        }
    }
    }
}

#Preview {
    //IndividualItemView(review: Review(backingData: any ))
      IndividualItemView(review: Review(foodName: "", restaurantName: "", rating: 0, foodType: "", reviewNotes: ""))
}

EditarMealView.swift

import SwiftUI
import PhotosUI
import SwiftData


struct EditMealView: View {
    @Binding var isPresentingNewMealView: Bool
    @Environment(\.modelContext) private var modelContext
    @State var mealImage: Image?
    @State var imageSelection: PhotosPickerItem? = nil
    @Bindable var review: Review
    
    let foodType: [String] = ["Select One...", "Fast Food", "Vegetarian", "Central African", "East African", "North African", "Southern Africa", "West African", "Latin American", "Native American", "Canadian", "Carribean", "Mexican", "American", "Southern American", "Fusion", "Central American", "South American", "Chinese", "Japanese", "Korean", "Indian", "Middle Eastern", "Thai", "Turkish", "Vietnamese", "Italian", "French", "German", "Spanish", "Greek", "Romanian", "Russian", "Eastern European", "Scandinavian", "British", "Dutch", "Swedish", "Norwegian", "Icelandic", "Irish", "Polynesian", "Australian", "New Zealand", "Other"]
    
    var body: some View {
        NavigationStack {
            ZStack {
                LinearGradient(gradient: Gradient(colors: [Color(red: 0.9725490196078431, green: 0.9607843137254902, blue: 0.8627450980392157, opacity: 1), Color(red: 0.9137254901960784, green: 0.9254901960784314, blue: 0.8509803921568627, opacity: 1), Color(red: 0.9882352941176471, green: 0.7529411764705882, blue: 0.13333333333333333, opacity: 1), Color(red: 0.9450980392156862, green: 0.47058823529411764, blue: 0.08627450980392157, opacity: 1)]), startPoint: .top, endPoint: .bottom).ignoresSafeArea()
                
                    .navigationTitle("Add Meal")
                
                VStack{
                    Form {
                        
                        TextField("Food Name", text: $review.foodName)
                            .listRowBackground(Color.clear)
                        
                        TextField("Restaurant", text: $review.restaurantName)
                            .listRowBackground(Color.clear)
                        
                        Picker(selection: $review.foodType, label: Text("Select Style")) {
                            ForEach(0..<foodType.count, id: \.self) {
                                Text(foodType[$0])
                            }
                        }
                            .listRowBackground(Color.clear)
                        
                        VStack{
                            Text("Current \(Image(systemName: "star.fill")) Rating: \((review.rating), format: .number.rounded(increment: 0.1))")
                            Slider(value: $review.rating, in: 1...5, step: 0.5)
                        }
                        .listRowBackground(Color.clear)
                        .padding()
                        VStack{
                            HStack {
                                mealImage?
                                    .resizable()
                                    .frame(width: 300, height: 300)
                                
                            }
                            HStack {
                                Spacer()
                                PhotosPicker( selection: $imageSelection) {
                                    Image(systemName: "photo.circle.fill").imageScale(.large)
                                }
                                .task(id: imageSelection) {
                                    mealImage = try? await imageSelection?.loadTransferable(type: Image.self)
                                }
                                Spacer()
                            }.padding()
                        }
                        .listRowBackground(Color.clear)
                        .padding()
                        
                        TextEditor(text: $review.reviewNotes)
                            .listRowBackground(Color.clear)
                    }
                }
                
                
                
                .scrollContentBackground(.hidden)
                .toolbar {
                    ToolbarItem(placement: .cancellationAction) {
                        Button("Dismiss") {
                            isPresentingNewMealView = false
                        }
                    }
                    ToolbarItem(placement: .confirmationAction) {
                        Button("Add") {
                            let newReview = review
                            modelContext.insert(newReview)
                            isPresentingNewMealView = false
                            
                        }
                    }
                }
                
            }
        }
        

    }
    
}

#Preview {
    do {
        let config = ModelConfiguration(isStoredInMemoryOnly: true)
        let container = try ModelContainer(for: Review.self, configurations: config)
        
        let example = Review(foodName: "Cheetos", restaurantName: "House", rating: 3, foodType: "American", reviewNotes: "Delicious")
       return EditMealView(isPresentingNewMealView: .constant(true), mealImage: Image(""), review: example)
            .modelContainer(container)
    } catch {
        fatalError("Failed to create model container.")
    }

}

Tentei tudo que pude encontrar. Como esse erro é tão vago e depende da eficiência do código, é difícil entendê-lo como um novo desenvolvedor.

No meu aplicativo, preciso exibir imagens (texturas). Algumas são em mosaico e outras são esticadas .

No momento, eu tinha esse código funcionando:

Image(frame.image)
.resizable(resizingMode: (frame.repeatTexture == true) ? .tile : .stretch)
.frame(width: frame.width, height: frame.height)

No entanto, a renderização do .tile não é boa. A textura é cortada no eixo X. Na imagem enviada, você pode ver que o bisel não está presente à direita, está truncado.

Textura original onde há uma moldura à esquerda e à direita:

Gostaria de ter o "repeat" somente em Y, por exemplo. Parece que não há opção para isso por padrão.

Existe alguma dica, opção ou talvez outra ideia, como usar background() para forçar a textura a ficar em mosaico apenas em um eixo?

Começo com o seguinte código:

import SwiftUI

struct ContentView: View {
    var body: some View {
        HStack(spacing: 20) {
            ExtractedView(text: "Energy")
            ExtractedView(text: "Breath Control")
                
        }
        .padding(.horizontal, 20)
    }
}

#Preview {
    ContentView()
}

struct ExtractedView: View {
    let text: String
    
    var body: some View {
        Button {
            
        } label: {
            HStack(spacing: 8) {
                Image(systemName: "globe")
                    .imageScale(.large)
                    .foregroundStyle(.tint)
                Text(text)
                    .lineLimit(1)
                    .font(.system(size: 18, weight: .bold))
            }
            .padding(.horizontal, 8)
            .padding(.vertical, 8)
            .background {
                Color.yellow
            }
        }
    }
}

O resultado aproximado que quero alcançar:

Em outras palavras, preciso adicionar espaçamento igual dentro de cada elemento após o texto, mas não sei como fazer isso. Tentei um código diferente, mas o tamanho do botão se torna igual ou o iOS adiciona uma nova linha ao segundo rótulo ou tenta encurtar o segundo rótulo mesmo quando há espaço suficiente.