如何在 SwiftUI 中创建透明矩形

2024-03-06

我想让图像通过一个小矩形 100% 透明,对所有其他矩形 50% 透明。就好像打一个小孔来透视小矩形一样。这是我的代码...

struct ImageScope: View {

    var body: some View {
        ZStack {
            Image("test_pic")

            Rectangle()
                .foregroundColor(Color.black.opacity(0.5))

            Rectangle()
                .frame(width: 200, height: 150)
                .foregroundColor(Color.orange.opacity(0.0))
                .overlay(RoundedRectangle(cornerRadius: 3).stroke(Color.white, lineWidth: 3))
        }
    }
}

为了更容易理解...


这是工作方法。它使用自定义形状和奇偶填充样式。

使用 Xcode 11.4 / iOS 13.4 进行测试

下面的演示具有更高的透明度对比度,以获得更好的可见性。

struct Window: Shape {
    let size: CGSize
    func path(in rect: CGRect) -> Path {
        var path = Rectangle().path(in: rect)

        let origin = CGPoint(x: rect.midX - size.width / 2, y: rect.midY - size.height / 2)
        path.addRect(CGRect(origin: origin, size: size))
        return path
    }
}

struct ImageScope: View {

    var body: some View {
        ZStack {
            Image("test_pic")

            Rectangle()
                .foregroundColor(Color.black.opacity(0.5))
                .mask(Window(size: CGSize(width: 200, height: 150)).fill(style: FillStyle(eoFill: true)))

            RoundedRectangle(cornerRadius: 3).stroke(Color.white, lineWidth: 3)
                .frame(width: 200, height: 150)
        }
    }
}
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何在 SwiftUI 中创建透明矩形 的相关文章

  • 调用 SwiftUI 中位置 #11、#12 处的额外参数 [重复]

    这个问题在这里已经有答案了 我在 SwiftUI 中的切换开关上不断收到 调用中位置 11 12 处有额外参数 错误 我见过其他人有 调用中的额外参数 错误 但答案似乎没有帮助 另外 我的错误是 位置 11 12 我还没有看到其他人发生这种
  • 具有多个 ViewBuilder 的 SwiftUI 视图

    我有一个视图 表示单元格中的一行 如下所示 这很有效 但三个水平元素 图像 标题 副标题 图像 被硬编码为其各自的类型 我想要一个通用的ThreeItemView这可能需要 3Views任何类型并如图所示排列它们 这将允许我将相同的容器布局
  • 可搜索修饰符不在导航栏标题下方显示搜索栏

    我正在使用 iOS 15 并尝试新版本searchableSwiftUI 中列表的修饰符 看起来就像你附加时searchable text searchText 对于 NavigationView 搜索栏默认呈现在屏幕上导航栏标题下方 当我
  • 如何将 WKUIDelegate 实现到 SwiftUI WKWebView 中?

    我正在 Xcode v11 上创建一个 Web 应用程序 但在实现 WKUIDelegate 来显示 Javascript 警报并在 Web 应用程序上正确确认时遇到问题 我在 ContentView swift 上得到了一个非常简单的 w
  • SwiftUI 上带有 TextField 的可删除表

    环境 Xcode 11 2 1 11B500 Problem 为了在 SwiftUI 中实现带有 TextField 的可编辑表格 我使用了ForEach 0
  • 捕获 SwiftUI 中的错误

    我在某些视图中有一个按钮 它调用 ViewModel 中可能引发错误的函数 Button action do try self taskViewModel createInstance name self name catch Databa
  • SwiftUI ScrollView 无法禁用垂直弹跳?

    初始化程序中有一个带有 ScrollView alwaysBounceVertical false 的属性 但我似乎找不到它了 有谁知道如何禁用 SwiftUI ScrollView 上的垂直弹跳 过度滚动 是的 它已从 ScrollVie
  • Xcode 11 beta swift ui 预览未显示

    只是使用 Swift UI 基本应用程序 即使我处于画布模式 预览画布也不会显示 应用程序运行 我有这个小片段 我错过了什么 if DEBUG struct ContentView Previews PreviewProvider stat
  • Core Data + CloudKit 无法在其他设备上自动刷新?

    我的 SwiftUI 应用程序与 Core Data CloudKit 一起使用 我可以从 Mac 或 iPhone 将新条目保存到数据库中 该应用程序对所有设备使用完全相同的项目 代码库 唯一的问题是我需要关闭应用程序并重新打开它才能查看
  • ScrollView 内的 SwiftUI 列表

    我想将列表放在 ScrollView 中 以便可以一起滚动列表行和标题 但我发现 ScrollView 中的 List 不起作用 它什么也没显示 我应该同时使用它们 我应该使用 ScrollView 这样当我滚动行时 我可以使标题 图像或文
  • SwiftUI 中的计算 (NSObject) 属性不会更新视图

    所以 我想要一个Text它根据我的 CoreData 模型的内容更改其内容 为此 我在 Xcode beta 4 中使用了计算属性 但它似乎不再起作用了 这是一个错误还是还有其他我没有看到的问题 我真正遇到的问题是我的视图 和计算的属性 似
  • SwiftUI 表未正确取消初始化关联实例

    我在 SwiftUI 中遇到了与工作表演示相关的令人费解的行为 当关闭工作表时 我注意到关联的实例 工作表视图持有的视图模型 似乎没有正确取消初始化 根据我的测试 唯一的情况是deinit使用时按预期被调用 StateObject 相比之下
  • SwiftUI 有模糊背景的方法吗?

    我希望模糊视图的背景 但不想必须突破 UIKit 才能完成它 例如 UIVisualEffectView 我正在翻阅文档却一无所获 似乎没有办法实时剪辑背景并对它应用效果 我错了还是以错误的方式看待它 1 Native SwiftUI方式
  • SwiftUI - 显示符合协议和 ForEach 的元素的视图

    我想写一个 SwiftUI 视图我的结构列表对符合给定协议的元素数组进行操作我的协议 该示例有效 但当然我需要对数组的元素进行 ForEach 如注释行中所尝试的那样 使用 ForEach 我得到 协议类型 MyProtokoll 的值不能
  • SwiftUI 多行文本背景颜色

    我在 SwiftUI 中有一个包含多行的文本视图 我知道我可以更改文本的背景颜色 Text
  • tvOS + SwiftUI 在部分之间聚焦

    我已经设置了一个非常简单的 SwiftUI tvOS 应用程序 我在使用 Focus 引擎时遇到了困难 当应用程序启动时 它的重点是 启动 这是可以理解的 向下滑动 转到 StackView 在项目上向左 向右滑动效果很好 但无论我在哪里尝
  • SwiftUI 动画滑入和滑出

    我有一个视图将显示在另一个视图上 视图动画完美地从右侧滑入 但是当我单击 关闭 按钮时 视图消失 而没有在消失之前滑回右侧的所需动画 我尝试过使用 opacity self isShowing 1 0 但随后视图淡入和淡出 我需要它滑入和滑
  • 如何在 SwiftUI 中将阴影应用于内部视图?

    我在周围添加了阴影VStack其中包含我的两个文本字段和一个提交按钮 然而 阴影也被应用到了文本框内的两个文本字段 VStack 我在这里缺少什么导致这种情况发生吗 我尝试添加shadow radius 0 在文本字段上 但它不会改变任何内
  • 当我输入字符时,SwiftUI 中的 TextField 失去焦点

    当我在文本字段中输入字符时遇到问题 在练习集视图 我必须重新单击文本框才能输入另一个字符 如果我从文本字段中删除绑定 我可以流畅地输入文本 我认为这与我的演讲者班级和更新集函数重新创建一个集合实例 因为我必须替换数组中两层深处的一些值 Co
  • SwiftUI:发送电子邮件

    在正常情况下UIViewController在 Swift 中 我使用此代码发送邮件 let mailComposeViewController configuredMailComposeViewController mailCompose

随机推荐