
在swift ui中如何实现ios26中玻璃效果的菜单栏
作者: boyyang
分类: Swift
发布: 2025-06-13 12:32:29
更新: 2025-06-13 12:33:10
浏览: 12
背景
ios26的第一个测试版刚刚推出不久,系统UI可以是说大改。在这个版本中最引人注目的除了相册的3D图片,那就是Liquid Glass 新特性了,测试版推出后我也是立马将手机和mac book升级到了最新版本。说实话新UI还挺好看的,虽然网上争论非常激烈。就我目前使用体验来看感觉还行,除了mac os 把我启动台给干没了,这一点使用起来我感觉不是很方便,之前整理的分类都没了,找软件瞬间感觉不是很方便了。希望下个版本把启动台还回来吧。
好了聊会正题吧,更新新系统后我也是立马将我的ios项目立马进行了重构,将Liquid Glass效果运用到了我的项目,由于新特性刚刚出来,我在网上搜了很多关于这方面的东西,好像目前为止还没有找到如何实现该效果代码片段。找了一大圈最后还是观看苹果官方的文档和视频才找到了相关代码。
如何使用swift ui 实现Liquid Glass 效果的菜单栏
以下是官方的示例代码,其实挺简单的,感觉根本不用加其它额外代码,但是由于我之前的项目是自定义的菜单栏,所以为了实现菜单栏和搜索在网上找了很久都没有找到,最后通过官方的视频和文档,才知道具体实现方法。
下面是苹果官方的代码:
import SwiftUI
struct HealthTabView: View {
@State private var text: String = ""
var body: some View {
TabView {
Tab("Summary", systemImage: "heart") {
NavigationStack {
Text("Summary")
}
}
Tab("Sharing", systemImage: "person.2") {
NavigationStack {
Text("Sharing")
}
}
Tab(role: .search) {
NavigationStack {
Search(keywords: .constant(""))
}
}
}
.searchable(text: $text)
}
}
#Preview {
HealthTabView()
}
下面是效果图:
总结
感觉还挺好看的,要比之前的那种样式好看多了,而且在页面滚动的时候,菜单栏还可以设置是否收起来,页面的空间更大了。