如何在 SwiftUI 中熟练使用 sensoryFeedback 修饰符

news2024/11/24 17:58:12

在这里插入图片描述

文章目录

    • 前言
    • 背景介绍
    • 平台支持
      • 仅支持watchOS
      • 支持watchOS和iOS
    • 基本用法
    • 预定义样式
    • 根据触发器值选择样式
    • 使用场景
      • 当值更改时触发
      • 使用条件闭包触发
      • 使用反馈闭包触发
    • 可以运行 Demo
    • 总结

前言

SwiftUI 引入了新的 sensoryFeedback 视图修饰符,使我们能够在所有 Apple 平台上播放触觉反馈。下面我们将学习如何使用 sensoryFeedback 修饰符在应用程序中的不同操作中提供触觉反馈。

背景介绍

在 iOS 17 之前,如果你想要从 SwiftUI 视图中向用户提供触觉反馈,你会使用其中一个 UIKit(或 AppKit)的反馈生成器。例如,使用选择反馈生成器:

struct ListView: View {
  @Binding var store: Store
  let generator = UISelectionFeedbackGenerator()
  
  var body: some View {
    List(store.items, selection: $store.selection) { ... }
    .onChange(of: store.selection) { oldValue, newValue in
      if newValue != nil {
        generator.selectionChanged()
      }
    }
  }
}

在 iOS 17 中,Apple 直接向 SwiftUI 中添加了一系列感觉反馈的视图修饰符,以播放触觉和/或音频反馈。

平台支持

并非所有平台都支持所有反馈选项。以下是我所知道的每个平台上可用的内容列表。请注意,iPad不支持触觉反馈。

仅支持watchOS

  • start:活动开始
  • stop:活动停止

支持watchOS和iOS

  • decrease:重要值减少到显着阈值以下
  • increase:重要值增加到显着阈值以上
  • selection:UI元素的值正在更改
  • success:任务成功完成
  • warning:任务产生警告
  • error:任务产生错误
  • impact:UI元素碰撞时的物理冲击

请注意,impact反馈有两个变体,让您指定元素碰撞的重量(轻,中,重)或灵活性(刚性,柔软,实心)。在这两种情况下,您还可以更改强度(默认为1.0):

// 默认impact反馈
.impact()

// 具有柔韧性并增加强度的impact
.impact(flexibility: .rigid, intensity: 2.0)

// 具有重量并增加强度的impact
.impact(weight: .heavy, intensity: 2.0)

基本用法

要在 SwiftUI 视图中播放触觉反馈,我们只需要使用 sensoryFeedback 视图修饰符,带有两个参数。第一个定义了反馈样式,第二个是触发器值。

struct ContentView: View {
    @State private var store = Store()
    
    var body: some View {
        NavigationStack {
            List(store.results, id: \.self) { result in
                Text(result)
            }
            .searchable(text: $store.query)
            .sensoryFeedback(.success, trigger: store.results)
        }
    }
}

在上面的示例中,我们使用 sensoryFeedback 视图修饰符,带有成功样式。我们还将存储的 results 属性定义为触发器。这意味着 SwiftUI 将在存储的结果更改时播放成功样式的触觉反馈。

预定义样式

SwiftUI 提供了许多预定义的反馈样式,如 successwarningerrorselectionincreasedecreasestartstopalignmentlevelChangeimpact 等。

struct ContentView: View {
    @State private var trigger = false
    
    var body: some View {
        NavigationStack {
            Button("Action") {
                // 进行某些操作
                trigger.toggle()
            }
            .sensoryFeedback(
                .impact(weight: .heavy, intensity: 0.9),
                trigger: trigger
            )
        }
    }
}

如上所示,impact 样式允许我们调整反馈的权重和强度。请记住,最好使用预定义的样式,并在超级自定义的情况下自定义触觉反馈。

根据触发器值选择样式

sensoryFeedback 视图修饰符的另一种变体允许我们根据触发器值选择特定的反馈样式。在这里,我们在存储包含结果时播放成功反馈,并在结果为空时播放错误反馈。

struct ContentView: View {
    @State private var store = Store()
    
    var body: some View {
        NavigationStack {
            List(store.results, id: \.self) { result in
                Text(result)
            }
            .searchable(text: $store.query)
            .sensoryFeedback(trigger: store.results) { oldValue, newValue in
                return newValue.isEmpty ? .error : .success
            }
        }
    }
}

SwiftUI 还提供了在触发器值上定义条件的选项,决定是否播放预定义的反馈样式。

使用场景

这些感觉反馈修饰符都是基于触发器的。触发器需要是可等同的类型。有三种感觉反馈视图修饰符的变体:

当值更改时触发

struct ListView: View {
  @Binding var store: Store
    
  var body: some View {
    List(store.items, selection: $store.selection) { ... }
    .sensoryFeedback(.selection, trigger: store.selection)
  }
}

视图修饰符的第一个参数是 SensoryFeedback 类型。并非所有反馈类型都适用于所有平台。当触发器值更改时,反馈会播放。

使用条件闭包触发

如果要更灵活地控制何时触发反馈,请使用带有条件闭包版本的视图修饰符。例如,仅在选择更改为非空值时播放选择反馈:

.sensoryFeedback(.selection, trigger: store.selection) {
  oldValue, newValue in
    newValue != nil
}

条件闭包接收监视的触发器值的旧值和新值。在闭包中,返回一个布尔值,指示是否应播放反馈。

使用反馈闭包触发

要控制播放何种反馈,请使用视图修饰符的反馈闭包版本。例如,基于错误代码提供警告或错误反馈:

// @State private var errorCode: Int = 0

.sensoryFeedback(trigger: errorCode) { oldValue, newValue in
    switch newValue {
    case 1: .warning
    case 2: .error
    default: nil
    }
}

在这种情况下,在闭包中返回所需的反馈,如果不想要任何反馈,则返回nil。

可以运行 Demo

提供一个可以运行的 Demo,完整代码如下:

import SwiftUI

struct ContentView: View {
    @State private var store = Store()
    
    var body: some View {
        NavigationView {
            List(store.results, id: \.self) { result in
                Text(result)
            }
            .searchable(text: $store.query)
            .sensoryFeedback(.success, trigger: store.results)
            .navigationTitle("Sensory Feedback Demo")
        }
    }
}

struct Store {
    @State var query: String = ""
    @State var results: [String] = ["Result 1", "Result 2", "Result 3"]
}

Demo 包括一个带有触觉反馈的 SwiftUI 列表。你可以根据需要进行进一步的调整和扩展。

总结

SwiftUI引入了新的sensoryFeedback视图修饰符,为所有Apple平台提供触觉反馈。通过简单的附加,我们可以定义反馈样式和触发器值,实现了在应用程序中不同操作产生的触觉效果。支持多种预定义样式,如success、warning、error,以及个性化的impact样式。对于触发器值的处理也非常灵活,可以根据其条件选择不同的反馈样式。

总体而言,这个新的视图修饰符为提高应用的可访问性和用户体验提供了简便的方式。在使用时需谨慎,避免过多干扰用户。希望通过学习这个新特性,开发者能更好地运用触觉反馈功能,提升应用的交互性。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1898374.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

设计模式探索:单例模式

1. 什么是单例模式? 定义: 单例模式是一种创建型设计模式,它确保一个类只有一个实例,并提供一种全局访问点以访问该实例。常见的场景包括身份证号码、政府等需要唯一实例的情况。 单例模式通常用于那些需要在应用程序中仅存在一个实例的情况,例如配置管理器、线程池、数据…

单位立方体各个面上的法向量,向量场以及每个面上的通量

单位立方体各个面上的法向量,向量场 F ( x , y , z ) \mathbf{F} (x, y, z) F(x,y,z) 以及每个面上的通量 flyfish 假设我们有一个单位立方体,向量场 F ( x , y , z ) \mathbf{F} (x, y, z) F(x,y,z) 在该立方体上。 法向量 :单位立方…

谷粒商城笔记-04-项目微服务架构图简介

文章目录 一,网络二,网关1,网关选型2,认证鉴权3,动态路由4,限流5,负载均衡6,熔断降级 三,微服务四,存储层五,服务治理六,日志系统七&a…

STM32和DHT11使用显示温湿度度(代码理解)+单总线协议

基于STM32CT,利用DHT11采集温湿度数据,在OLED上显示。一定要阅读DHT11数据手册。 1、 DHT11温湿度传感器 引脚说明 1、VDD 供电3.3~5.5V DC 2、DATA 串行数据,单总线 3、NC 空脚 4、GND 接地,电源负极 硬件电路 微…

Git错误分析

错误案例1: 原因:TortoiseGit多次安装导致,会记录首次安装路径,若安装路径改变,需要配置最后安装的路径。

gitLab使用流程

标题1.配置账户 git config --global user.name git config --global user.email mygitlabmali.cn 标题2.生成秘匙 ssh-keygen -t rsa -C “mygitlabmail.cn” 。 //输入命令后一直回车 ,输入命令后一直回车(密码可以不填),至…

重载赋值运算符

c编译器可能会给类添加四个函数 1默认构造函数 2默认析构函数 3默认拷贝构造函数&#xff0c;对成员变量进行浅拷贝。 4默认赋值函数&#xff0c;队成员变量进行浅拷贝。 #include<iostream> using namespace std; class CGirl { public:int m_bh;string m_name;voi…

推荐3款Windows系统的神级软件,免费、轻量、绝对好用!

DiskView DiskView是一款用于管理和查看磁盘空间的工具&#xff0c;它集成了于微软的Windows操作系统资源管理器中&#xff0c;以显示直观的磁盘空间使用情况。该软件通过生成图形化地图&#xff0c;帮助用户组织和管理大量文件和文件夹&#xff0c;从而高效地管理磁盘空间。用…

SKM Power*Tools 10.0

SKM Power*Tools 10.0是功能强大的电气电力系统分析设计解决方案&#xff01;综合软件提供强大的功能和领先的技术&#xff0c;在检查、计算、负载分配、流量、瞬态稳定性等多个方面提供领先的支持&#xff0c;可对不同的安全设备、系统进行评估分析和比较&#xff0c;使用 Pow…

GoodTask for Mac:优雅高效的任务管理助手

在快节奏的工作生活中&#xff0c;你是否需要一个优雅且高效的任务管理工具来助你一臂之力&#xff1f;GoodTask for Mac正是你的理想选择&#xff01; GoodTask以其简洁直观的界面设计&#xff0c;让你一眼就能看清所有的待办事项。你可以轻松创建任务、设置提醒&#xff0c;…

证券交易系统中服务器监控系统功能设计

1.背景介绍 此服务器监控系统的目的在于提高行情服务器的监管效率&#xff0c;因目前的的行情服务器&#xff0c;包括DM、DT、DS配置数量较多&#xff0c;巡回维护耗时较多&#xff0c;当行情服务器出现异常故障&#xff0c;或者因为网络问题造成数据断线等情况时&#xff0c;监…

安乃达:看不懂的募资

不好玩啊&#xff0c;高标接连被S&#xff0c;市场激进资金找到了新股作为抱团方向。 首日大涨超100%&#xff0c;两日涨幅133%&#xff0c;今天果不其然被电风扇刮走了&#xff0c;今天我们聊聊新加入A股大本营的公司——安乃达。 首先&#xff0c;安乃达是国内直驱轮毂电机头…

秒验—手机号码置换接口

功能说明 提交客户端获取到的token、opToken等数据&#xff0c;验证后返回手机号码 服务端务必不要缓存DNS&#xff0c;否则可能影响服务高可用性 调用地址 POST https://identify-verify.dutils.com/auth/auth/sdkClientFreeLogin 请求头 Content-Type &#xff1a;appli…

字节码编程javassist之结合hotswap在运行期动态修改方法返回值

写在前面 本文看下如何通过javassist结合hotswap在运行期动态修改方法的返回值。 1&#xff1a;代码 要修改的代码 public class ApiTest {public String m1(String info) {return "info is: " info;} }javasssit代码 package com.dahuyou.javassist.huohuo;im…

十大排序:插入/希尔/选择/堆/冒泡/快速/归并/计数/基数/桶排序 汇总(C语言)

目录 前言非线性时间比较类插入排序(1) 直接插入排序(2) 希尔排序 选择排序(3) 选择排序优化版(4) 堆排序 交换排序(5) 冒泡排序(6) 快速排序hoare版本挖坑版前后指针版非递归版 归并排序(7) 归并排序递归版非递归版 线性时间比较类(8) 计数排序基数排序与桶排序 总结 前言 在计…

【C++】unordered系列容器的封装

你很自由 充满了无限可能 这是很棒的事 我衷心祈祷你可以相信自己 无悔地燃烧自己的人生 -- 东野圭吾 《解忧杂货店》 unordered系列的封装 1 unordered_map 和 unordered_set2 改造哈希桶2.1 模版参数2.2 加入迭代器 3 上层封装3.1 unordered_set3.2 unordered_map 4 面…

基于ssm口红商城管理的设计与实现

一、&#x1f468;‍&#x1f393;网站题目 口红商城项目可以提供更加便捷和高效的购物方式。消费者可以在家中使用电脑或手机随时随地购物&#xff0c;避免了传统购物方式中需要花费时间和精力去实体店铺购物的麻烦。此外&#xff0c;口红商城项目还提供了更多的选择和更低的…

Windows 与 Windows Server 2022环境下如何开启远程桌面

文章目录 前言Windows 环境下如何开启远程桌面控制功能Windows Server 环境下如何开启远程桌面 前言 我这边是客户需要搭建一套备份系统&#xff0c;整体的系统流程是这样的&#xff1a;客户的笔记本或者其他PC工具可以自由访问到我司搭建的服务器平台并进行文件传输&#xff…

【字符串】【滑动窗口+位运算+双指针】1、无重复字符的最长子串+2、尽可能使字符串相等+3、最长优雅子数组+4、移动零+5、反转字符串

2道简单3道中等 1、无重复字符的最长子串&#xff08;难度&#xff1a;中等&#xff09; 该题对应力扣网址 超时代码 老实说&#xff0c;在我写博客的时候&#xff0c;也不知道为啥超时了&#xff0c;因为我看和我AC的代码时间也差不了多少吧&#xff08;如果有大佬知道&…

基于jeecgboot-vue3的Flowable流程-集成仿钉钉流程(二)增加基本的发起人审批与多用户多实例

因为这个项目license问题无法开源&#xff0c;更多技术支持与服务请加入我的知识星球。 1、AssigneeNode 增加approvalText public abstract class AssigneeNode extends Node {// 审批对象private AssigneeTypeEnum assigneeType;// 表单内人员private String formUser;// 表…