如何在 SwiftUI 中使用 AccessibilityCustomContentKey 修饰符

这篇具有很好参考价值的文章主要介绍了如何在 SwiftUI 中使用 AccessibilityCustomContentKey 修饰符。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

如何在 SwiftUI 中使用 AccessibilityCustomContentKey 修饰符,# Swift 集,swiftui,java,服务器

前言

SwiftUI 3 发布了许多新的辅助功能 API,我们可以利用这些 API 以轻松的方式显著提高用户体验。本篇文章来聊聊另一个新的 API,我们可以使用 SwiftUI 中的新 accessibilityCustomContent 视图修饰符提供自定义的辅助功能内容。

创建 User 结构体

让我们从一个简单的示例开始,定义 User 结构体以及呈现 User 结构体实例的视图。

import SwiftUI

struct User: Decodable {
    let name: String
    let email: String
    let address: String
    let age: Int
}

struct UserView: View {
    let user: User

    var body: some View {
        VStack(alignment: .leading) {
            Text(user.name)
                .font(.headline)
            Text(user.address)
                .font(.subheadline)
                .foregroundColor(.secondary)
            Text(user.email)
                .foregroundColor(.secondary)
            Text("Age: \(user.age)")
                .foregroundColor(.secondary)
        }
    }
}

添加辅助修饰符

SwiftUI 在开箱即用时为我们提供了出色的辅助功能支持。不需要执行任何操作即可使你的 UserView 可访问。UserView 内的每个文本片段都对辅助技术(如VoiceOver和Switch Control)可访问。这听起来很好,但它可能会通过大量数据压倒VoiceOver用户。让我们通过向 UserView 添加一些辅助功能修饰符来稍微改进辅助功能支持。

struct UserView: View {
    let user: User

    var body: some View {
        VStack(alignment: .leading) {
            Text(user.name)
                .font(.headline)
            Text(user.address)
                .font(.subheadline)
                .foregroundColor(.secondary)
            Text(user.email)
                .foregroundColor(.secondary)
            Text("Age: \(user.age)")
                .foregroundColor(.secondary)
        }
        .accessibilityElement(children: .ignore)
        .accessibilityLabel(user.name)
    }
}

如上例所示,我们使用辅助功能修饰符来忽略子元素的辅助功能内容,使堆栈本身成为辅助功能元素。我们还向堆栈添加了辅助功能标签,但仍然错过了其他部分。我们希望使所有数据都可访问。通常,我们使用不同的字体和颜色在视觉上为文本设置优先级,但是如何在辅助技术中实现相同的影响呢?

使用新的修饰符

SwiftUI 通过全新的 accessibilityCustomContent视图修饰符提供了一种使用不同重要性生成自定义辅助功能内容的方法。让我们看看如何使用它。

struct UserView: View {
    let user: User

    var body: some View {
        VStack(alignment: .leading) {
            Text(user.name)
                .font(.headline)
            Text(user.address)
                .font(.subheadline)
                .foregroundColor(.secondary)
            Text(user.email)
                .foregroundColor(.secondary)
            Text("Age: \(user.age)")
                .foregroundColor(.secondary)
        }
        .accessibilityElement(children: .ignore)
        .accessibilityLabel(user.name)
        .accessibilityCustomContent("Age", "\(user.age)")
        .accessibilityCustomContent("Email", user.email, importance: .high)
        .accessibilityCustomContent("Address", user.address, importance: .default)
    }
}

在这里,我们添加了一堆 accessibilityCustomContent 视图修饰符,以不同的优先级定义自定义辅助功能内容。accessibilityCustomContent 视图修饰符有三个参数:

  1. 用于你的自定义内容的本地化标签,VoiceOver 用于宣布。
  2. 用于呈现自定义内容的本地化标签或字符串值。
  3. 你的自定义内容的重要性级别。它可以是默认或高。VoiceOver 会立即读取具有高重要性的内容,而具有默认重要性的内容仅在用户使用垂直滑动访问更多数据时以冗长模式朗读。

accessibilityCustomContent 视图修饰符允许我们为辅助技术优先考虑数据。例如,VoiceOver会立即读取具有高重要性的数据,并允许用户使用垂直滑动根据需要访问具有默认重要性的数据。

使用修饰符来替换和覆盖数据

你可以使用尽可能多的 accessibilityCustomContent视图修饰符来呈现大量的数据子集。还可以通过使用相同的标签引入具有相同标签的 accessibilityCustomContent 视图修饰符来替换和覆盖数据或重要性。

在整个大型代码库中保持自定义辅助功能内容标签的一种绝佳方式是使用 AccessibilityCustomContentKey 类型。你可以将其实例用作 accessibilityCustomContent 视图修饰符的第一个参数。

extension AccessibilityCustomContentKey {
    static let age = AccessibilityCustomContentKey("Age")
    static let email = AccessibilityCustomContentKey("Email")
    static let address = AccessibilityCustomContentKey("Address")
}

struct UserView: View {
    let user: User

    var body: some View {
        VStack(alignment: .leading) {
            Text(user.name)
                .font(.headline)
            Text(user.address)
                .font(.subheadline)
                .foregroundColor(.secondary)
            Text(user.email)
                .foregroundColor(.secondary)
            Text("Age: \(user.age)")
                .foregroundColor(.secondary)
        }
        .accessibilityElement(children: .ignore)
        .accessibilityLabel(user.name)
        .accessibilityCustomContent(.age, "\(user.age)")
        .accessibilityCustomContent(.email, user.email, importance: .high)
        .accessibilityCustomContent(.address, user.address, importance: .default)
    }
}

在上面的示例中,我们为自定义的辅助功能内容键定义了一些快捷方式,并与 accessibilityCustomContent 视图修饰符结合使用。

可运行代码

在这个示例中,我们创建了一个 ContentView,在其中创建了一个 User 实例,并将其传递给 UserView。这个示例使用了文章中第三个代码段,其中包括了一些辅助功能的设置。

import SwiftUI

struct User: Decodable {
    let name: String
    let email: String
    let address: String
    let age: Int
}

struct UserView: View {
    let user: User

    var body: some View {
        VStack(alignment: .leading) {
            Text(user.name)
                .font(.headline)
            Text(user.address)
                .font(.subheadline)
                .foregroundColor(.secondary)
            Text(user.email)
                .foregroundColor(.secondary)
            Text("Age: \(user.age)")
                .foregroundColor(.secondary)
        }
        .accessibilityElement(children: .ignore)
        .accessibilityLabel(user.name)
        .accessibilityCustomContent("Age", "\(user.age)")
        .accessibilityCustomContent("Email", user.email, importance: .high)
        .accessibilityCustomContent("Address", user.address, importance: .default)
    }
}

struct ContentView: View {
    var body: some View {
        let exampleUser = User(name: "Swift Com", email: "swift.com@example.com", address: "123 Main St", age: 25)

        UserView(user: exampleUser)
            .padding()
    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}

运行截图:

如何在 SwiftUI 中使用 AccessibilityCustomContentKey 修饰符,# Swift 集,swiftui,java,服务器

总结

今天,我们学习了如何使用accessibilityCustomContent视图修饰符,通过为辅助技术优先处理我们的数据,以及根据需要允许用户访问更多详细信息,从而使我们的应用程序更具可访问性。文章来源地址https://www.toymoban.com/news/detail-791628.html

到了这里,关于如何在 SwiftUI 中使用 AccessibilityCustomContentKey 修饰符的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

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

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

相关文章

  • SwiftUI Swift CoreData 计算某实体某属性总和

    有一个名为 Item 的实体,它有一个名为 amount 的 Double 属性,向你的 View 添加一个计算属性: 熊猫小账本 一个简洁的记账 App,用于记录日常消费开支收入,使用 iCloud 保存同步数据。 支持备注,自定义时间偶尔忘记记账也没关系。 搜索历史记账,支持分类、金额、备注。 启

    2024年02月07日
    浏览(29)
  • 关于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日
    浏览(31)
  • 如何在 SwiftUI 中使用 Touch ID 和 Face ID?

    需要向 Info.plist 文件中添加一个配置,向用户说明为什么要访问 添加 Privacy - Face ID Usage Description 并为其赋予值 $(PRODUCT_NAME) need Touch Id or Face ID permission for app lock 熊猫小账本 一个简洁的记账 App,用于记录日常消费开支收入,使用 iCloud 保存同步数据。 支持备注,自定义时间偶

    2024年02月16日
    浏览(29)
  • SwiftUI——如何使用新的NavigationStack和NavigationSplitView(如何页面跳转2.0以及如何制作侧栏)

    从 iOS 16 开始,苹果开始弃用原先的 NavigationView ,以后会逐渐完全淘汰掉。现在开始使用 NavigationStack 和 NavigationSplitView 。 NavigationStack 的效果和原本的 NavigationView 一样,而 NavigationSplitView 则和现在 iPadOS 上的 NavigationView 效果一样。 最近在 iPadOS 上面使用 NavigationView ,内容会

    2024年02月04日
    浏览(26)
  • 如何在 SwiftUI 中配置 SwiftData

    在 WWDC 2023 上,Apple 宣布了一个备受期待的新持久性刷新,以一种新的框架形式出现:SwiftData。SwiftData 从 iOS 17 开始提供,允许使用 Swift 类型对应用程序的持久性数据进行建模,并以类型安全和声明性的方式执行 CRUD 操作。 在本文中,将展示如何配置 SwiftData 用于一个 Swift

    2024年02月13日
    浏览(41)
  • 如何在 SwiftUI 中实现音频图表

    在可访问性方面,图表是复杂的事物之一。iOS 15 引入了一项名为“音频图表”的新功能。 下面我们将学习如何通过使用 accessibilityChartDescriptor 视图修饰符为任何 SwiftUI 视图构建音频表示,呈现类似自定义条形图视图或图像的图表。 让我们从在 SwiftUI 中构建一个简单的条形图

    2024年01月22日
    浏览(28)
  • 如何将自定义字体添加到 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日
    浏览(47)
  • SwiftUI 如何保证 Text 中字符数量相等的字符串显示宽度一定相同?

    在 SwiftUI 中我们往往需要将内容相似的字符串展列出来给用户比较,这些字符串内容各有不同但字符数量始终是相等的,我们希望它们的显示宽度始终保持一致: 如上图所示:即使是等宽字符组成的字符串在字符数量相等时它们的显示宽度仍然可能不一致。但演示中最底部的

    2024年01月17日
    浏览(29)
  • SwiftUI 中List动态列表容器视图的使用方法

    List  是 SwiftUI 中用于显示动态列表的容器视图。它接受一个或多个子视图,并根据提供的数据动态生成对应的列表项。 下面是  List  的常见用法和一些常用的参数: 基本用法: 在这个例子中, List  包含了三个  Text  视图作为列表项。 使用  ForEach  进行动态列表生成:  

    2024年02月07日
    浏览(44)
  • SwiftUI中EnvironmentObject使用中,直接修改数据源的原值的方法

    在Swift中有几种引用,一个通过@Binding  var Param来引用原变量的值,在子函数或子View中修改 Param,但我们也经常使用@EnvironmentObject来引用全局数据。 例如: 在这个例子中,我们通过定义 @EnvironmentObject var greenhouseData : GreenhouseData 来引用全局的数据GreenhouseData,当然在上一层V

    2024年02月06日
    浏览(29)

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

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

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

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

二维码1

领取红包

二维码2

领红包