如何在与内容重叠的 SwiftUI 按钮上方添加渐变？ iOS 13

Question

我必须在按钮上添加渐变，以显示按钮上方文本的透明度。按钮的高度应为60。渐变的高度应为30，但渐变应与视图中的其他内容重叠。不幸的是我必须支持 iOS 13.

我目前在按钮上显示渐变，但按钮的总高度是 60 + 30:


VStack(spacing: 0) {
           Rectangle()
               .foregroundColor(.clear)
               .background(
                   LinearGradient(
                       gradient: Gradient(colors: [.white.opacity(0.1), .white.opacity(1)]),
                       startPoint: .top,
                       endPoint: .bottom))
               .frame(height: 30)

           Button(action: {
               state.isExpanded.toggle()
           }, label: {
               Text(state.isExpanded ? "Collapse" : "Expand")
                   .frame(maxWidth: .infinity,
                          minHeight: 60,
                          maxHeight: 60,
                          alignment: .center)
                   .foregroundColor(Color(.red))
                   .background(Color(.white))
           })
               .buttonStyle(.plain)
       }

Answer 1

如果它对某人有帮助，我设法用叠加层做到了。

   Button(action: {
             state.isExpanded.toggle()
          }, label: {
             Text(state.isExpanded ? "Collapse" : "Expand")
                   .frame(maxWidth: .infinity,
                          minHeight: 60,
                          maxHeight: 60,
                          alignment: .center)
                   .foregroundColor(Color(.red))
                   .background(Color(.white))
           }).overlay(Rectangle()
                .foregroundColor(.clear)
                .background(LinearGradient(
                gradient: Gradient(colors: [.white.opacity(0), .white.opacity(1)]),
                                   startPoint: .top,
                                   endPoint: .bottom))
                          .frame(height: 30)
                          .alignmentGuide(.top) { [=10=][.top] + 30 },
                alignment: .top)

如何在与内容重叠的 SwiftUI 按钮上方添加渐变？ iOS 13

How to add a gradient above button in SwiftUI that is overlapping the content? iOS 13

gradient

button

ios

swiftui