Hi, i´m trying to get a menu with three rows. The top one should be a HStack with three RoundedRectangle (Red, Yellow and Green). The second row and the third one (both separated with a Divider from the top one) are for edit and delete. But I get five rows, three empty rows plus the edit row and the delete row. The three first rows are empty but they execute the moveTask function correctly. I don't know how to solve this. Can anybody help please?
struct TaskView: View {
@EnvironmentObject var viewModel: BoardViewModel
@EnvironmentObject var languageManager: LanguageManager
@State private var isEditing = false
let task: Task
var body: some View {
HStack(alignment: .center, spacing: 8) {
Text(task.title)
.font(.system(size: 16, weight: .medium))
.foregroundColor(.primary)
.lineLimit(4)
.multilineTextAlignment(.leading)
.fixedSize(horizontal: false, vertical: true)
Spacer(minLength: 0)
Menu {
ColorButtonsView(task: task, viewModel: viewModel)
Divider()
Button(action: {
self.isEditing = true
}) {
Label(languageManager.localizedString("edit"), systemImage: "pencil")
}
Button(action: {
viewModel.deleteTask(task)
}) {
Label(languageManager.localizedString("delete"), systemImage: "trash")
}
} label: {
Image(systemName: "ellipsis")
.font(.system(size: 20))
.foregroundColor(.gray)
.frame(width: 30, height: 30)
}
}
.padding(.vertical, 8)
.padding(.horizontal, 12)
.background(Color.white)
.cornerRadius(10)
.shadow(color: Color.black.opacity(0.1), radius: 3, x: 0, y: 1)
.sheet(isPresented: $isEditing) {
EditTaskView(task: task, viewModel: viewModel)
}
}
}
struct ColorButtonsView: View {
let task: Task
let viewModel: BoardViewModel
var body: some View {
HStack(spacing: 10) {
ForEach(Column.allCases, id: \.self) { column in
Button(action: {
viewModel.moveTask(task, to: column)
}) {
RoundedRectangle(cornerRadius: 5)
.fill(colorForColumn(column))
.frame(width: 30, height: 30)
}
}
}
}
private func colorForColumn(_ column: Column) -> Color {
switch column {
case .toDo:
return .red
case .inProgress:
return .yellow
case .done:
return .green
}
}
}