watchkit - 在watchOS中使用.listRowBackground时如何将cornerRadius添加到SwiftUI List Cell?
问题描述
我正在尝试在每个单元格上使用图像来获得List
手表上的正常值。listRowBackground
但是当我将图像设置为listRowBackground
标准的角半径List
消失时(见下文)。
我试图background
在 Cell-View
本身中设置修改,但这会导致同样的问题。查看 Visual View Debugger,背景图像似乎远远超出了单元格本身。
struct ListView: View {
@ObservedObject var model: ListModel
var body: some View {
List {
ForEach(self.model.items) { item in
NavigationLink(destination: PlayerView(item: item)) {
ListCell(item: item).frame(height: 100)
}
.listRowBackground(Image(uiImage: item.image)
.resizable()
.scaledToFill()
.opacity(0.7)
)
}
}
.listStyle(CarouselListStyle())
.navigationBarTitle(Text("Today"))
}
}
@available(watchOSApplicationExtension 6.0, *)
struct ListCell: View {
var item: ListItem
var body: some View {
VStack(alignment: .leading) {
Text("\(self.item.length) MIN . \(self.item.category)")
.font(.system(.caption, design: .default))
.foregroundColor(.green)
.padding(.horizontal)
.padding(.top, 2)
Text(self.item.title)
.font(.headline)
.lineLimit(2)
.padding(.horizontal)
}
}
}
图片:带背景图片:
图片:无背景图片:
解决方案
这适用于我Xcode 11.5,只需添加.clipped()
and .cornerRadius(10)
修饰符。
List {
Text("Sample cell text")
.listRowBackground(
Color(.blue)
.clipped()
.cornerRadius(10))
}
推荐阅读
- javascript - 循环添加/追加 3+ 数组说明
- c++ - 运行可执行文件的 Visual Studio 2015 比命令行慢得多
- excel - Excel VBA 不匹配
- flutter - Flutter:iOS 的 MissingPluginException(在通道 plugins.flutter.io/firebase_auth 上找不到方法 currentUser 的实现)
- django - 在 Django 模型中处理不同的子级别
- excel - 添加超链接到 XLS 单元格(通过变量)
- python - 裁剪来自网络摄像头的实时视频输入以进行面部识别
- sql - 如何在另一个表上加入日期和开始日期和结束日期的表?
- html - 是否可以将原始视频帧传递给浏览器?
- python - 如何在 Python 中将文件从本地移动到 HDFS?