如何从匹配的几何效果中删除/控制淡入淡出效果?

2024-04-10

我有一个测试代码来显示这个问题,当我使用matchedGeometryEffect时,matchedGeometryEffect向渲染结果添加了不希望的淡入淡出效果,所以我喜欢删除这种淡入淡出效果甚至控制它。当我将视图颜色从一种颜色更改为另一种颜色时,这可能是一件好事,但就我而言,这并不好,因为颜色始终是黑色。

struct ContentView: View {
    
    @Namespace var animationNamespaceon
    @State private var start: Bool = Bool()
    
    var body: some View {
        
        VStack {
            
            Spacer()
            
            circle
            
            Spacer()
            
            Button("update") { start.toggle() }
            
        }
        .animation(Animation.linear(duration: 3), value: start)

    }
    
   @ViewBuilder var circle: some View {
        if start {
            
            Circle()
                .foregroundColor(Color.black)
                .matchedGeometryEffect(id: "Circle", in: animationNamespaceon)
                .frame(width: 300, height: 300)


        }
        else {
            Circle()
                .foregroundColor(Color.black)
                .matchedGeometryEffect(id: "Circle", in: animationNamespaceon)
                .frame(width: 50, height: 50)
                
        }
    }
}

这是默认的效果.transition(.opacity)当视图从视图层次结构中删除(插入)时应用。

我假设你需要线性尺度过渡,比如

    if start {
        Circle()
            .foregroundColor(Color.black)
            .matchedGeometryEffect(id: "Circle", in: animationNamespaceon)
            .transition(.scale(scale: 1))
            .frame(width: 300, height: 300)
    }
    else {
        Circle()
            .foregroundColor(Color.black)
            .matchedGeometryEffect(id: "Circle", in: animationNamespaceon)
            .transition(.scale(scale: 1))
            .frame(width: 50, height: 50)
    }

使用 Xcode 13 / iOS 15 进行测试

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

如何从匹配的几何效果中删除/控制淡入淡出效果? 的相关文章

随机推荐

  • Meteor-AutoForm:如何根据另一个控件更新选择选项

    我一直在寻找一些问题的答案 这些问题应该非常简单 但我一生都无法弄清楚 基本上我有一个带有两个选择控件的meteor autoform
  • 在 Windows 7 上找不到模块“连接”

    请看下面 C Program Files nodejs gt npm g install connect npm http GET https registry npmjs org connect npm http GET https re
  • React Native + React Native Paper 应用程序中未显示图标

    这是一个新鲜的React Native应用程序使用React Native Paper 我按照以下说明进行操作https callstack github io react native paper getting started html
  • 无法实现 grunt-connect-proxy

    为了 http 127 0 0 1 9000 我得到的路线 不能获取 对于 v1 路线我得到 未找到 在此服务器上找不到请求的 URL v1 这是我的 Gruntfile js Generated on 2013 10 08 using g
  • 计算小于当前值的值的数量

    我想计算列中的行数input如果值小于当前行 请参阅下面想要的结果 对我来说 问题是条件基于当前行值 因此它与条件是固定数字的一般情况有很大不同 data lt data frame input c 1 1 1 1 2 2 3 5 5 5
  • 绑定这个更好还是使用变量更好? [关闭]

    就目前情况而言 这个问题不太适合我们的问答形式 我们希望答案得到事实 参考资料或专业知识的支持 但这个问题可能会引发辩论 争论 民意调查或扩展讨论 如果您觉得这个问题可以改进并可能重新开放 访问帮助中心 help reopen questi
  • C# 无法从传输连接读取数据:现有连接被远程主机强制关闭。读取网络流

    我看过 无法从传输连接读取数据连接已关闭 https stackoverflow com questions 26995191 unable to read data from the transport connection the co
  • JavaFX 场景的显示随机延迟

    我创建了一个 JavaFX 应用程序 在 Ubuntu Java SE 运行时环境 版本 1 8 0 131 b11 上运行 并制作了一个简单的测试应用程序 public class DelayedSceneApplication exte
  • Angular 2 模拟响应不起作用

    我有以下 Angular 2 测试 tslint disable no unused variable import provide from angular core import MockBackend from angular htt
  • Pyinstaller 无法执行脚本 pyi_rth_pkgres

    I converted the py script to exe using pyinstaller but when I try to run the exe I got this How can I fix it 您必须告诉 pyins
  • 从文件express js 提供 json

    新手要表达的是 我有一个包含 db json 文件的文件夹 并且每 11 秒就会被新的 db json 替换 让express js 提供服务以便在 api 调用上显示新内容的最佳方法是什么 这是我到目前为止所拥有的 const expre
  • 具有多重身份的B2C用户

    在 Azure B2C 中 有多个身份提供商 在本示例中 我将使用本地帐户和 Google 帐户 新用户使用电子邮件地址注册本地帐户 电子邮件受保护 cdn cgi l email protection 他们使用该网站 下次返回时 他们决定
  • Lucene 中跨多个字段的重复值的影响

    在 lucene 索引中的多个字段中重新索引相同的值会产生什么影响 这个想法是 某人的名字是他们的名字和一般详细信息的一部分 所以我想将该值索引到多个字段中 Ted Bloggs 我可能会索引如下 Field Value firstName
  • 删除 SQLPLUS 中不需要的/额外的数据

    我正在通过批处理文件运行一个文件 批处理文件 sqlplus admin admin SERVER abc sql gt output txt SQL 文件 abc sql set PAGESIZE 1000 set LINESIZE 55
  • Symfony POST 变量始终为空

    这是我的 Symfony 控制器 class MyPageController extends Controller public function indexAction Request request postData request
  • 如何使用“setInterval()”每秒更新时间而不使时间每秒闪烁?

    我正在使用一个下拉列表 该列表使用时刻时区显示不同的时区 例如 当您单击标有 est 的下拉列表时 它将显示东部时间的时间 当您单击 cst 时 将显示 cst 时间 依此类推 无论如何 我遇到的问题是 我使用setInterval upd
  • Magento:设置集合限制

    我试图找出的问题是如何对集合设置限制 我在 Google 上找到的答案仅适用于具有 setPage pageNum pageSize 的目录 这对任何其他集合都不起作用 请参阅下面的答案 做这件事有很多种方法 collection Mage
  • 记录执行的java代码的行数

    我正在编写 PHP Web 应用程序的一部分 将在高中错误查找竞赛中使用 用户必须在给定的 Java 程序中查找错误 作为其中的一部分 当 Java 程序执行时 我们希望突出显示已执行代码的 Java 程序源代码行 为此 我们需要的是已执行
  • Google Cloud 上的一个项目下是否可以拥有多个聊天机器人

    最近 我用 DialogFlow 构建聊天机器人的项目空间用完了 我不认为我在 Google Cloud 上的项目中使用了最佳标准 任何提示都很棒 而且由于我尝试创建一个新的聊天机器人 它会告诉我项目空间不足 是否可以将这些聊天机器人放在同
  • 如何从匹配的几何效果中删除/控制淡入淡出效果?

    我有一个测试代码来显示这个问题 当我使用matchedGeometryEffect时 matchedGeometryEffect向渲染结果添加了不希望的淡入淡出效果 所以我喜欢删除这种淡入淡出效果甚至控制它 当我将视图颜色从一种颜色更改为另