iOS 17交互式小部件-如何在SwiftUI小部件中使用自定义标签视图更改按钮的背景颜色?

ijxebb2r  于 12个月前  发布在  Swift
关注(0)|答案(2)|浏览(114)

目前,我有以下SwiftUI小部件。

struct TodoWidgetEntryView : View {
    var entry: Provider.Entry
    let todoItems: [TodoItem] = DataManager().todoItems
    
    var body: some View {
        VStack(alignment: .leading, spacing: 1) {
            ForEach(0..<todoItems.count, id: \.self) { index in
                Button(intent: TodoIntent(item: todoItems[index].taskName)) {
                    Label(todoItems[index].taskName, systemImage: "circle\(todoItems[index].isCompleted ? ".fill" : "")")
                        .frame(maxWidth: .infinity, alignment: .leading).lineLimit(1)
                }
                .foregroundColor(.black) // label color
            }
            Spacer(minLength: 0)
        }.background(SwiftUI.Color.fromInt(0xfff7ce46)) // yellow color
    }
}

字符串
它看起来如下


的数据
我所期待的是使用半透明的白色背景的互动按钮。
我希望它看起来像这个应用程序主屏幕,在UIKit的UICollectionViewCell中实现。



圆角的半透明背景是使用以下代码实现的

contextView.layer.cornerRadius = 22
contextView.layer.masksToBounds = true
contextView.backgroundColor = UIColor(red: 1.0, green: 1.0, blue: 1.0, alpha: 0.5)


我将SwiftUI代码更改为

struct TodoWidgetEntryView : View {
    var entry: Provider.Entry
    let todoItems: [TodoItem] = DataManager().todoItems
    
    var body: some View {
        VStack(alignment: .leading, spacing: 1) {
            ForEach(0..<todoItems.count, id: \.self) { index in
                Button(intent: TodoIntent(item: todoItems[index].taskName)) {
                    Label(todoItems[index].taskName, systemImage: "circle\(todoItems[index].isCompleted ? ".fill" : "")")
                        .frame(maxWidth: .infinity, alignment: .leading).lineLimit(1)
                }
                .foregroundColor(.black)    // label color
                .background(SwiftUI.Color.fromInt(0x7fffffff))   // semi-transparent white color
            }
            Spacer(minLength: 0)
        }.background(SwiftUI.Color.fromInt(0xfff7ce46)) // yellow color
    }
}


但我没有得到想要的结果。



我可以知道,如何改变背景颜色的按钮与自定义标签视图,在SwiftUI部件?

r6l8ljro

r6l8ljro1#

这是因为默认的按钮样式。你应该在按钮上使用.buttonStyle(.plain)

Button(intent: TodoIntent(item: todoItems[index].taskName)) {
    Label(todoItems[index].taskName, systemImage: "circle\(todoItems[index].isCompleted ? ".fill" : "")")
        .frame(maxWidth: .infinity, alignment: .leading).lineLimit(1)
}
.foregroundColor(.black) // label color
.buttonStyle(.plain) // 👈 Here

字符串

不相关但值得一提

你也可以像这样重构按钮:

let item = todoItems[index]
Button(
    item.taskName,
    systemImage: "circle\(item.isCompleted ? ".fill" : "")",
    intent: TodoIntent(item: item.taskName)
)

zu0ti5jz

zu0ti5jz2#

看起来你正在使用Color的扩展,它是静态函数fromInt
我的猜测是,这并不像你期望的那样工作。
尝试将这些函数调用替换为传统的颜色定义:

  • 请尝试使用.background(.white.opacity(0.5)).background(Color(white: 1, opacity: 0.5))代替.background(SwiftUI.Color.fromInt(0x7fffffff))
  • 请尝试使用.background(.yellow)代替.background(SwiftUI.Color.fromInt(0xfff7ce46))

相关问题