React-native Android 添加音效

文章背景

客户提出需求 : 2.PDA提示操作:正常和异常的提示需要更明显的区别(确认错误是否有语或其他提示)

**使用的技术:**使用React-Native 做的Android开发。

实现方法

在React Native中,如果你想要在Android应用中添加声音提示,你可以使用Sound组件。以下是一个简单的例子,演示如何在React Native应用中播放声音提示:

  1. 首先下载音效文件
    音频下载我是在 制片帮素材 免费下载的(需要登录)

并且该文件需要被添加到了项目的\android\app\src\main\res\raw

  1. 接下来,你需要安装react-native-sound库:
csharp 复制代码
npm install react-native-sound --save
  1. 最后,你可以在你的React Native组件中使用Sound来播放声音:
csharp 复制代码
import React, { Component } from 'react';
import { Button } from 'react-native';
import Sound from 'react-native-sound';//1.导入包
 
class SoundExample extends Component {
									//2.创建方法
  playSound = () => {
    // 需要提前将音频文件添加到项目中
    const sound = new Sound('error_sound.mp3', Sound.MAIN_BUNDLE, (error) => {
      if (error) {
        console.log('加载音频文件出错:', error);
      } else {
        sound.play((success) => {
          if (success) {
            console.log('成功播放音频');
          } else {
            console.log('播放音频失败');
          }
        });
      }
    });
  }
 
  render() {
    return (
      <Button title="播放声音" onPress={this.playSound} />//3.使用
    );
  }
}
 
export default SoundExample;

此时点击按钮就可以听到声音了

相关推荐
2501_9209317020 分钟前
React Native鸿蒙跨平台采用ScrollView的horizontal属性实现横向滚动实现特色游戏轮播和分类导航
javascript·react native·react.js·游戏·ecmascript·harmonyos
摘星编程2 小时前
React Native鸿蒙版:Drawer抽屉导航实现
react native·react.js·harmonyos
2501_920931704 小时前
React Native鸿蒙跨平台实现推箱子游戏,完成玩家移动与箱子推动,当所有箱子都被推到目标位置时,玩家获胜
javascript·react native·react.js·游戏·ecmascript·harmonyos
JMchen1234 小时前
现代Android图像处理管道:从CameraX到OpenGL的60fps实时滤镜架构
android·图像处理·架构·kotlin·android studio·opengl·camerax
快点好好学习吧5 小时前
phpize 依赖 php-config 获取 PHP 信息的庖丁解牛
android·开发语言·php
是誰萆微了承諾5 小时前
php 对接deepseek
android·开发语言·php
摘星编程6 小时前
React Native + OpenHarmony:UniversalLink通用链接
javascript·react native·react.js
qq_177767376 小时前
React Native鸿蒙跨平台数据使用监控应用技术,通过setInterval每5秒更新一次数据使用情况和套餐使用情况,模拟了真实应用中的数据监控场景
开发语言·前端·javascript·react native·react.js·ecmascript·harmonyos
烬头88216 小时前
React Native鸿蒙跨平台应用实现了onCategoryPress等核心函数,用于处理用户交互和状态更新,通过计算已支出和剩余预算
前端·javascript·react native·react.js·ecmascript·交互·harmonyos
Dxy12393102166 小时前
MySQL如何加唯一索引
android·数据库·mysql