You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多
文档控制台
免费开始使用

如何在iOS 26中移除导航推送过渡动画中的圆角效果

如何在iOS 26中移除导航推送过渡动画中的圆角效果

我太懂这种糟心的感觉了——系统突然加的圆角完全打乱了精心设计的界面风格!之前我在适配类似版本的时候也踩过这个坑,下面给你几个亲测有效的解决方案,不管你用的是SwiftUI的NavigationStack还是UIKit的UINavigationController,都能搞定这个问题。

方案一:用官方API直接修改过渡配置(最推荐)

你之前用SwiftUIIntrospect没成功,大概率是用法不对。其实iOS 26提供了公开的API来配置导航过渡的圆角,我们只需要拿到底层的UINavigationController,给它设置一个自定义的过渡配置就行。

代码示例(SwiftUI + SwiftUIIntrospect)

import SwiftUI
import SwiftUIIntrospect

struct ContentView: View {
    @State private var isPresented = false
    
    var body: some View {
        VStack {
            Text("Placeholder")
                .padding()
            NavigationStack {
                VStack {
                    Button {
                        isPresented.toggle()
                    } label: {
                        SourceView() // 保留你原来的SourceView
                    }
                    .navigationDestination(isPresented: $isPresented) {
                        DetailView()
                    }
                }
                // 关键:通过Introspect拿到底层导航控制器
                .introspect(.navigationStack, on: .iOS(.v26)) { navController in
                    if #available(iOS 26, *) {
                        // 创建过渡配置,把圆角设为0
                        let transitionConfig = UINavigationTransitionConfiguration()
                        transitionConfig.cornerRadius = 0
                        // 应用配置
                        navController.transitionConfiguration = transitionConfig
                        
                        // 额外保险:把导航栏所有外观的圆角也设为0,防止其他场景出问题
                        let barAppearance = UINavigationBarAppearance()
                        barAppearance.cornerRadius = 0
                        navController.navigationBar.standardAppearance = barAppearance
                        navController.navigationBar.scrollEdgeAppearance = barAppearance
                    }
                }
            }
        }
    }
}

为什么这个能行?

这个方法直接用系统提供的UINavigationTransitionConfiguration来控制过渡动画的圆角参数,是官方推荐的方式,不会有兼容性问题,也不会影响导航栏的其他功能。

方案二:自定义导航过渡动画(完全掌控效果)

如果你不想依赖系统的默认过渡逻辑,也可以直接给NavigationStack设置一个自定义的过渡动画,彻底绕过系统带圆角的那个过渡。

代码示例

NavigationStack {
    VStack {
        Button {
            isPresented.toggle()
        } label: {
            SourceView()
        }
        .navigationDestination(isPresented: $isPresented) {
            DetailView()
        }
    }
    // 用滑动过渡替代系统默认的带圆角过渡
    .navigationTransition(.push(.slide))
    
    // 如果你想要更贴近系统原推送效果但无圆角的动画,也可以自定义不对称过渡:
    // .navigationTransition(.push(.asymmetric(
    //     insertion: .move(edge: .trailing),
    //     removal: .move(edge: .leading)
    // )))
}

优点

完全由你掌控过渡效果,不仅能去掉圆角,还能根据APP风格调整动画,比如改成淡入淡出、缩放等等。

方案三:纯UIKit项目的解决方案

如果你的项目是纯UIKit开发,或者在混合开发中直接操作UINavigationController,用下面的代码就行:

if #available(iOS 26, *) {
    // 配置导航栏外观,去掉所有圆角
    let barAppearance = UINavigationBarAppearance()
    barAppearance.cornerRadius = 0
    navigationController?.navigationBar.standardAppearance = barAppearance
    navigationController?.navigationBar.scrollEdgeAppearance = barAppearance
    navigationController?.navigationBar.compactAppearance = barAppearance
    
    // 关键:设置过渡配置,移除推送动画的圆角
    let transitionConfig = UINavigationTransitionConfiguration()
    transitionConfig.cornerRadius = 0
    navigationController?.transitionConfiguration = transitionConfig
}

常见踩坑点排查

  • Introspect用法错误:一定要指定正确的类型(.navigationStack)和iOS版本(.iOS(.v26)),不然会拿不到底层的导航控制器。
  • 混淆了视图圆角和过渡圆角:有时候你看到的圆角可能是DetailView自己加的,先检查详情页的代码有没有.cornerRadius修饰器,排除这个情况再处理过渡的问题。
  • 忘记适配所有导航栏外观:除了过渡配置,把导航栏的standardAppearancescrollEdgeAppearance等都设为0圆角,避免导航栏本身出现圆角。

如果还有问题,你可以贴出DetailView的代码,我再帮你排查细节!

火山引擎 最新活动