人工智能实战小程序之语音_前端开发

1. 人工智能实战小程序之准备工作

2. 人工智能实战小程序之语音_前端开发

今天这部分主要讲小程序前端功能的开发
由于我偏后端,css是我的弱项,可能很多人和我一样开发小程序不知道如何下手,希望本篇文章对你有帮助
我的学习路线是:
大略看一遍小程序的api文档
然后在github上找一些小程序(我倾向于找有readme附图的那种)
然后download下来去跑起来 然后在看代码。(最快速的学习是能够学习别人优秀的代码这个我很赞同)
我收藏了一个代码写的不错的开源电影推荐的小程序
https://github.com/yuzd/wechat-weapp-movie(感谢作者)
作者的代码目录结构我很喜欢(本次demo的开发我借鉴了)
本次demo的前端流程很简单:
录音=>上传=>展示返回结果
下手之前:
希望能找到一个开源的带录音功能的demo能帮助我快速上手,
终于找到一个比较适合的开源demo:https://github.com/WalkingFrog/SiYu-WX
虽然该项目的作者说项目年久失修,学习价值有限。。
但是ui ico部分,对我来说太有帮助啦(感谢作者)
自己写css是避免不了的那么
我希望能找一个类似于bootstrap库的css库能帮助我快速排版布局
我在github搜索到了一个ZanUI小程序专用的css库,https://www.youzanyun.com/zanui/weapp#/zanui/base/icon
(果真很赞)
具体代码我已经放到了github上面了
https://github.com/yuzd/microsoft_ai
下面就说说我在开发过程中遇到的一些问题和解决方法
1.小程序的component功能我的理解像是asp.net mvc中的PartialView。使用的时候不要忘记将wxss文件也要引用到主wxss里面。
例如你自己写了一个loading的组件。
如果你在index.wxml里面用到了message.wxml 不要忘记要将message.wxs import到index.wss,否则样式就加载不进来(不要认为会默认约定加载)
2.bindtouchstart bindlongtap 的使用区别
刚开始的时候我用的是bindlongtap 但是测试发现多次我长按了事件没有被调用
然后我换成了bindtouchstart 但是又太灵敏了,然后采用的是settimeout 200毫秒,并在 bindtouchend方法进行
clearTimeout的方式解决的。
3.动画效果,比如出现录音的动画,用小程序自带的动画功能对我来说有点难,我就用了多组图片切换的方式解决
哈哈,这样真的可行。
4.录音和播放都采用了小程序最新的api
录音对象:wx.getRecorderManager()
音频播放对象:wx.createInnerAudioContext()
这2个对象都提供时间注册 例如 onStart onStop onError等等。我原来以为是注册多次会覆盖,其实这个类似于c#的多播委托 其实是+=的概念

 

下篇文章会讲后端的代码实现逻辑以及音频转换会遇到的坑,希望大家多多支持

转载于:https://www.cnblogs.com/yudongdong/p/8900270.html

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

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

相关文章

当TFS/VSTS遇上Power BI

引言众所周知,要对TFS进行深入的图表分析,往往需要依赖于SQL Server Analysis Service和SQL Server Reporting Service。虽然随着TFS对敏捷项目的支持,内置了诸如累积流图、燃尽图等快捷图表;并且在最新的版本中还可以在仪表盘和查…

HashMap深度解析:一文让你彻底了解HashMap

写在前面HashMap是Map族中最为常用的一种,也是 Java Collection Framework 的重要成员。本文首先给出了 HashMap 的实质并概述了其与 Map、HashSet 的关系,紧接着给出了 HashMap 在 JDK 中的定义,并结合源码分析了其四种构造方式。最后&#…

python_线程、进程和协程

线程 Threading用于提供线程相关的操作,线程是应用程序中工作的最小单元。 1 #!/usr/bin/env python2 #codingutf-83 __author__ yinjia4 5 6 import threading,time7 8 def show(arg):9 time.sleep(2) 10 print(线程: str(arg)) 11 12 for i in range(…

第四章:手机平板要兼顾-探究碎片

碎片是什么? 碎片(Fragment)是一种可以嵌入在活动(Activity)中的 UI 片段,它能让程序更加合理和充分的利用大屏幕的空间,因而在平板上应用的非常广泛。 碎片的使用方式 静态嵌入动态加载碎片和活…

Android Studio 3.4增可视化资源管理工具 可管理和预览项目资源

经过6个月的开发时间,网络大厂17日发布了最新版的App开发IDE Android Studio 3.4,现在就能够下载使用,除了有超过300个错误修护和稳定度增强之外,在开发、建置和测试App阶段,都推出了一些小的新功能和工具,…

[IoC容器Unity]第三回:依赖注入

上节介绍了,Unity的Lifetime Managers生命周期,Unity具体实现依赖注入包含构造函数注入、属性注入、方法注入,所谓注入相当赋值,下面一个一个来介绍。 2.构造函数注入 Unity利用Resolve方法解析一个对象,都是调用注册类…

Apache CarbonData 1.5.0编译及安装

2019独角兽企业重金招聘Python工程师标准>>> 一、编译环境描述 OpenStack创建五个虚拟机,其中1个主节点(hostname为bigdatamaster),4个从节点(hostname分别为,bigdataslave1、bigdataslave2、bi…

Filter介绍

Filter 可认为是 Servlet的一种 “ 加强版 ”,它主要用于对用户请求进行预处理, 也可以对HttpServletResponse 进行后处理,是个典型的处理链。Filter 也可对用户请求生成响应,这一 点与Servlet 相同, 但实际上很少会使…

python --- 二分查找算法

二分查找法:在我的理解中这个查找方法为什么会叫二分呢,我认为是将要查询的一个列表分成了两份,然后在利用某个值来进行比较,在一个不断循环的过程中来找出我们要找的某一个值。 废话不多说,先上代码: 1 de…

Java暑假作业

一.《大护法》观影有感 ... 从预告开始就期待着这部影片,在看过一遍后又忍不住二刷,影片观看至第二遍后,对于全片的脉络也更清晰了一点,虽然打着暴力美学的旗子,但《大护法》偏偏更文艺一些。文艺片是没有对错的&a…

使用EasyNetQ组件操作RabbitMQ消息队列服务

RabbitMQ是一个由erlang开发的AMQP(Advanved Message Queue)的开源实现,是实现消息队列应用的一个中间件,消息队列中间件是分布式系统中重要的组件,主要解决应用耦合,异步消息,流量削锋等问题。实现高性能,…

TensorFlow 1.12.2 发布,修复 GIF 构造安全漏洞

开发四年只会写业务代码,分布式高并发都不会还做程序员? TensorFlow 1.12.2 发布了,此处本修复了一个潜在的安全漏洞: 精心设计的 GIF 图像可以在解码过程中产生空指针解引用更新说明: https://github.com/tensorflo…

对象变为指定格式的数组

拿到的对象的格式(一个对象里面都好多属性) 想要转换成的数据格式(一个数组里面有好多个对象,每个对象有一个id和name的属性) 如何处理的 selectionChange(val) { // 列表选择var dynamicTags1 [];var arr[]for(var i…

mysql学习(2)索引的本质

2019独角兽企业重金招聘Python工程师标准>>> 问题:SQL查询慢怎么办? 优化手段,加索引。 索引是帮助MYSQL高效的获取数据的排好序的数据结构。 问题:索引结构为什么使用Btree而不使用二叉树,红黑树或者HASH结…

CSS3:CSS3 文本效果

ylbtech-CSS3:CSS3 文本效果1.返回顶部 1、CSS3 文本效果 CSS3 文本效果 CSS3中包含几个新的文本特征。 在本章中您将了解以下文本属性: text-shadowbox-shadowtext-overflowword-wrapword-break浏览器支持 属性 text-shadow4.010.03.54.09.5box-sha…

洛谷 P2296 寻找道路

题目描述 在有向图G 中,每条边的长度均为1 ,现给定起点和终点,请你在图中找一条从起点到终点的路径,该路径满足以下条件: 1 .路径上的所有点的出边所指向的点都直接或间接与终点连通。 2 .在满足…

Feature Preprocessing on Kaggle

刚入手data science, 想着自己玩一玩kaggle,玩了新手Titanic和House Price的 项目, 觉得基本的baseline还是可以写出来,但是具体到一些细节,以至于到能拿到的出手的成绩还是需要理论分析的。 本文旨在介绍kaggle比赛到各种原理与技巧&#xf…

如果您遇到文件或数据库问题,如何重置Joomla

2019独角兽企业重金招聘Python工程师标准>>> 如果您遇到Joomla站点的问题,那么重新安装其核心文件和数据库可能是最佳解决方案。 了解问题 这种方法无法解决您的所有问题。但它主要适用于由Joomla核心引起的问题。 运行Joomla核心更新后,这些…

Genymotion模拟器拖入文件报An error occured while deploying the file的错误

今天需要用到资源文件,需要将资源文件拖拽到sd卡中,但老是出现这个问题: 资源文件拖不进去genymotion。查看了sd的DownLoad目录,确实没有成功拖拽进去。 遇到这种问题的,我按下面的思路排查问题: Genymotio…

激光炸弹(BZOJ1218)

激光炸弹&#xff08;BZOJ1218&#xff09; 一种新型的激光炸弹&#xff0c;可以摧毁一个边长为R的正方形内的所有的目标。现在地图上有n(N<10000)个目标&#xff0c;用整数Xi,Yi(其值在[0,5000])表示目标在地图上的位置&#xff0c;每个目标都有一个价值。激光炸弹的投放是…