SwiftUI 5.0(iOS 17)TipKit 让用户更懂你的 App

这篇具有很好参考价值的文章主要介绍了SwiftUI 5.0(iOS 17)TipKit 让用户更懂你的 App。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

SwiftUI 5.0(iOS 17)TipKit 让用户更懂你的 App,Apple开发入门,iOS 17,SwiftUI 5.0,TipKit,Xcode 15,Tip,提示,原力计划

概览

作为我们秃头开发者来说,写出一款创意炸裂的 App 还不足以吸引用户眼球,更重要的是如何让用户用最短的时间掌握我们 App 的使用技巧。

SwiftUI 5.0(iOS 17)TipKit 让用户更懂你的 App,Apple开发入门,iOS 17,SwiftUI 5.0,TipKit,Xcode 15,Tip,提示,原力计划

从 iOS 17 开始, 推出了全新的 TipKit 框架专注于此事。有了它,我们再也不用自己写 App 用户帮助以及使用指南的逻辑和界面了。

使用 TipKit 非常简单,接下来就让我们一起走进 TipKit 的世界吧!

本文代码全部在 Xcode 15 beta8 上编译,在 iOS 17 beta8 上运行。


什么是 TipKit?

SwiftUI 5.0(iOS 17)TipKit 让用户更懂你的 App,Apple开发入门,iOS 17,SwiftUI 5.0,TipKit,Xcode 15,Tip,提示,原力计划

TipKit 是  在 WWDC 23 上推出的一款新框架,用于在界面显示提示(Tips)来帮助用户快速发掘我们 App 的使用特性。

SwiftUI 5.0(iOS 17)TipKit 让用户更懂你的 App,Apple开发入门,iOS 17,SwiftUI 5.0,TipKit,Xcode 15,Tip,提示,原力计划
SwiftUI 5.0(iOS 17)TipKit 让用户更懂你的 App,Apple开发入门,iOS 17,SwiftUI 5.0,TipKit,Xcode 15,Tip,提示,原力计划

目前该框架仍属于 beta 阶段,意味着它还有很多不确定性。

如果我没有记错, 直到 Xcode beta4 才将 TipKit 提供给开发者,而且现在 官网 TipKit 的示例代码在 Xcode beta8 中已提示语法错误了(我们后面会说明):

SwiftUI 5.0(iOS 17)TipKit 让用户更懂你的 App,Apple开发入门,iOS 17,SwiftUI 5.0,TipKit,Xcode 15,Tip,提示,原力计划


对于  这种习惯性“谜之”行为的更多细节,感兴趣的小伙伴们可以到如下链接中观赏:

  • 有用的知识又增加了:为何无法编译某些  WWDC 官方视频中的代码?

创建一个 Tip

按照 SwiftUI 的“习性”,一个 Tip 同时意味着外观和逻辑双重含义。

创建一个提示很简单,只需遵循 Tip 协议即可:

struct FavoriteTip: Tip {
    var title: Text {
        Text("收藏最爱的图片")
            .bold()
    }
    
    var message: Text? {
        Text("将心仪的图片保存到相册中")
            .font(.headline)
            .foregroundStyle(.gray.gradient)
    }
}

Tip 协议还有很多其它可选属性,比如我们还可以为 Tip 界面进一步增加图片修饰:

struct FavoriteTip: Tip {
    var image: Image? {
        Image(systemName: "heart")
    }
}

TipKit 显示的两种方式

在 Tip 创建之后如何显示它们呢?有两种方式:嵌入和弹出。

我们可以直接将 Tip 嵌在视图中:

struct ContentView: View {
    let favTip = FavoriteTip()
    
    var body: some View {
        NavigationStack {
            VStack {
                
                TipView(favTip)
            }
            .padding()
            .navigationTitle("TitKit演示")
        }
    }
}

显示效果如下:

SwiftUI 5.0(iOS 17)TipKit 让用户更懂你的 App,Apple开发入门,iOS 17,SwiftUI 5.0,TipKit,Xcode 15,Tip,提示,原力计划

或者我们还可以将 Tip 直接依附于某一个视图,比如图片或按钮:

struct ContentView: View {
    let favTip = FavoriteTip()
    
    var body: some View {
        NavigationStack {
            VStack {...}
            .padding()
            .navigationTitle("TitKit演示")
            .toolbar {
                ToolbarItem {
                    Image(systemName: "heart")
                        .font(.title.weight(.black))
                        .foregroundStyle(.pink.gradient)
                        .popoverTip(favTip, arrowEdge: .top)
                }
            }
        }
    }
}

SwiftUI 5.0(iOS 17)TipKit 让用户更懂你的 App,Apple开发入门,iOS 17,SwiftUI 5.0,TipKit,Xcode 15,Tip,提示,原力计划

我们可以根据不同需求来组合使用这两种显示方式。

TipKit 全局配置

其实,TipKit 框架会在 App (本地目录)中存放一些相关的配置信息。理论上说,它们可能会通过 iCloud 同步到其它设备上去,这意味着在不同设备上相同 App 中的 TipKit 共享同一组配置。

我们可以进一步定制 TipKit 的配置细节,比如 Tip 显示频率、配置数据库保存的本地位置等等:

import SwiftUI
import TipKit

@main
struct TipKitTestApp: App {
    var body: some Scene {
        WindowGroup {
            ContentView()
                .task {                    
                    try? Tips.configure([
                        .displayFrequency(.immediate),
                        .datastoreLocation(.applicationDefault)
                    ])
                    
                    // Xcode 15 beta4 中过时的语法,目前已不能使用:
                    /*
                    try? await Tips.configure {
                        DisplayFrequency(.immediate)
                        DatastoreLocation(.applicationDefault)
                    }*/
                }
        }
    }
}

如上代码所示,我们需要所有 Tip 立即显示,并且让系统决定配置数据存储的位置(我们也可以自己设置存储路径)。

在代码中,我们注释了之前官方示例中出错的代码片段,这些代码在 Xcode 15 beta8 中已不能使用。

TipKit 显示规则

除了全局 Tip 显示限制以外,我还可以设置单个 Tip 之间的显示规则。

比如,假设有两个提示,我们希望 FavoriteTip 在 StartTip 提示关闭后再显示,我们可以在 FavoriteTip 中用特定的规则(Rule)来表示这一约束:

struct FavoriteTip: Tip {
    // 其它代码从略
    
    var rules: [Rule] {
        #Rule(Self.$startTipHasDisplayed) { $0 == true}
    }
    
    @Parameter
    static var startTipHasDisplayed: Bool = false
    
}

现在,我们需要在 StartTip 提示关闭时将 FavoriteTip.startTipHasDisplayed 置为 true 才能触发 FavoriteTip 的显示:

struct ContentView: View {
    
    let startTip = StartTip()
    let favTip = FavoriteTip()
    
    var body: some View {
        NavigationStack {
            
            VStack {
                
                Image("1")
                    .resizable()
                    .aspectRatio(contentMode: .fill)
                    .onTapGesture {
                        // 关闭 startTip 提示
                        startTip.invalidate(reason: .actionPerformed)
                        // 触发 FavoriteTip 提升的显示
                        FavoriteTip.startTipHasDisplayed = true
                    }
                
                TipView(startTip)
            }
            .padding()
            .navigationTitle("TitKit演示")
            .toolbar {
                ToolbarItem {
                    Image(systemName: "heart")
                        .font(.title.weight(.black))
                        .foregroundStyle(.pink.gradient)
                        .popoverTip(favTip, arrowEdge: .top)
                }
            }
        }
    }
}

现在,只有等 StartTip 关闭后,FavoriteTip 提示才能显示出来:
SwiftUI 5.0(iOS 17)TipKit 让用户更懂你的 App,Apple开发入门,iOS 17,SwiftUI 5.0,TipKit,Xcode 15,Tip,提示,原力计划

为 TipKit 增加更多互动性

有时,我们希望提示为用户提供更丰富的交互功能,比如在 Tip 中提供按钮跳转到更详细的使用教程界面。

TipKit 为此也提供了很好的支持,我们可以为 Tip 添加 Action 来驱动交互行为:

struct FavoriteTip: Tip {
    // 其它代码从略
    
    var actions: [Action] {
        [
            Tip.Action(id: "learn-more", title: "了解更多"),
            Tip.Action(id: "forget", title: "下次再说")
        ]
    }
}

在 Tip Action 被触发时,我们可以执行自定义行为:

struct ContentView: View {
    
    let startTip = StartTip()
    let favTip = FavoriteTip()
    
    var body: some View {
        NavigationStack {
            
            VStack {
                
                Image("1")
                    .resizable()
                    .aspectRatio(contentMode: .fill)
                    .onTapGesture {
                        startTip.invalidate(reason: .actionPerformed)
                        
                        FavoriteTip.startTipHasDisplayed = true
                    }
                
                TipView(startTip)
            }
            .padding()
            .navigationTitle("TitKit演示")
            .toolbar {
                ToolbarItem {
                    Image(systemName: "heart")
                        .font(.title.weight(.black))
                        .foregroundStyle(.pink.gradient)
                        .popoverTip(favTip, arrowEdge: .top){ action in
                            switch action.index {
                            case 0:
                                favTip.invalidate(reason: .tipClosed)

                                // 跳转到详细使用教程
                            case 1:
                                favTip.invalidate(reason: .tipClosed)
                                
                                // 直接退出提示
                            default:
                                break
                            }
                        }
                }
            }
        }
    }
}

现在,用户可以选择“了解更多”来进一步学习 App 的使用“秘技”了:

SwiftUI 5.0(iOS 17)TipKit 让用户更懂你的 App,Apple开发入门,iOS 17,SwiftUI 5.0,TipKit,Xcode 15,Tip,提示,原力计划

如何测试 TipKit?

TipKit 全局配置存储在本地带有持久化特性,为了便于开发者即时测试, 提供了一些方法来快速显示或隐藏全部或指定 Tip:

SwiftUI 5.0(iOS 17)TipKit 让用户更懂你的 App,Apple开发入门,iOS 17,SwiftUI 5.0,TipKit,Xcode 15,Tip,提示,原力计划

一般的,要想在 Xcode 预览中正确测试 TipKit 的行为,我们需要在每次视图刷新时重置 TipKit 数据库,否则 Tip 不会正常显示:

#Preview {
    ContentView()
        .task {
            // 在每次视图刷新时将 TipKit 数据库重置为初始状态
            try? Tips.resetDatastore()
            
            try? Tips.configure([
                .displayFrequency(.immediate),
                .datastoreLocation(.applicationDefault)
            ])
        }
}

总结

在本篇博文中,我们介绍了 SwiftUI 5.0(iOS 17)中新引进的开发框架 TipKit,使用它我们可以非常方便和快速的向用户介绍我们 App 中的各种特性和使用指南,小伙伴们还不快操练起来!

感谢观赏,再会!😎文章来源地址https://www.toymoban.com/news/detail-706235.html

到了这里,关于SwiftUI 5.0(iOS 17)TipKit 让用户更懂你的 App的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • 酷开系统深度赋能,只为更懂你!

    时代的潮流不断翻涌向前,变化太快,将数字化生活推向我们,促使着我们不断接受新鲜事物。而在数字时代的今天,智能电视已然成为人们生活中的一部分,在众多智能电视系统中最引人注目的莫过于酷开系统,它以强大的功能和完善的服务体系备受消费者青睐。然而,酷

    2024年02月15日
    浏览(49)
  • 高级Prompt指南:打造高效聊天体验,让ChatGPT更懂你

    随着深度学习技术的不断发展,人工智能在各个领域都表现出越来越强大的能力。其中,自然语言处理(NLP)领域发展迅猛,将人工智能技术应用于对话系统、语音识别和机器翻译等方面。ChatGPT是一个基于GPT-3.5语言模型的智能对话系统,可以在多种应用场景下提供优质的对

    2023年04月24日
    浏览(51)
  • 探索人工智能 | 智能推荐系统 未来没有人比计算机更懂你

    智能推荐系统(Recommendation Systems)利用机器学习和数据挖掘技术,根据用户的兴趣和行为,提供个性化推荐的产品、内容或服务。 智能推荐系统是一种利用机器学习和数据分析技术的应用程序,旨在根据用户的兴趣、偏好和行为模式,向其推荐个性化的产品、服务或内容。

    2024年02月13日
    浏览(51)
  • 同步推送?苹果计划本月推出 iOS17和iPadOS17,你的手机支持吗?

    据报道,苹果公司计划在本月推出 iOS 17 和 iPadOS 17 正式版更新。与去年不同的是,这次更新将同时发布,而不是分别发布。根据彭博社的一位消息人士马克・古尔曼的说法,苹果公司认为 iOS 17 和 iPadOS 17 的第八个测试版已经非常接近最终版本,除非有意外情况发生,否则将

    2024年02月09日
    浏览(39)
  • 关于iOS:如何使用SwiftUI调整图片大小?

    我在Assets.xcassets中拥有很大的形象。 如何使用SwiftUI调整图像大小以缩小图像? 我试图设置框架,但不起作用: 1 2 Image(room.thumbnailImage)     .frame(width: 32.0, height: 32.0) 在Image上应用任何大小修改之前,应使用.resizable()。 1 2 Image(room.thumbnailImage).resizable() .frame(width: 32.0, height: 3

    2024年02月05日
    浏览(42)
  • 在 iOS 16 中用 SwiftUI Charts 创建一个折线图

    苹果在 WWDC 2022 上推出了 SwiftUI 图表,这使得在 SwiftUI 视图中创建图表变得异常简单。图表是以丰富的格式呈现可视化数据的一种很好的方式,而且易于理解。本文展示了如何用比以前从头开始创建同样的折线图少得多的代码轻松创建折线图。此外,自定义图表的外观和感觉

    2024年02月01日
    浏览(47)
  • SwiftUI适配iOS16导航控制器引起的闪退

    当时iPhone14系列手机升级到iOS16.5.1系统以后,当用户登录后再次退出登录闪退货登录后退出登录闪退。 由于SwiftUI提倡用struct代替类,导致悲剧产生,闪退时无法打印是那个结构体(class类实现时会打印类名),因为是struct也没有deinit跟踪内存是否泄漏。开启僵尸进程打印只有

    2024年02月11日
    浏览(56)
  • 如何将自定义字体添加到 iOS 应用程序(SwiftUI + 得意黑)

    Xcode Version 14.3 (14E222b) SwiftUI 得意黑 Smiley Sans https://github.com/atelier-anchor/smiley-sans/releases https://sarunw.com/posts/how-to-add-custom-fonts-to-ios-app/ 熊猫小账本 一个简洁的记账 App,用于记录日常消费开支收入,使用 iCloud 保存同步数据。 支持备注,自定义时间偶尔忘记记账也没关系。 搜索

    2024年02月13日
    浏览(61)
  • 大师学SwiftUI第6章 - 声明式用户界面 Part 4

    步进器视图 ​ ​Stepper​ ​视图创建一个带递增和递减按钮的控件。该结构体提供了多个初始化方法,包含不同的配置参数组合。以下是最常用的一部分。 Stepper (String, value : Binding, in : Range, step : Float, onEditingChanged : Closure):此初始化方法创建一个​ ​Stepper​ ​​视图。第

    2024年01月25日
    浏览(41)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包