RISC-V生态开发套件解析(八):Waft模拟器和dep_tools网页版使用教程

简介: 随着RISC-V生态的蓬勃发展,相关开源开发套件也开始逐渐丰富。为了帮助开发者快速了解、玩转新推出的RISC-V开发套件,OCC推出RISC-V生态开发套件解析系列内容,详细讲解生态开发套件的功能特点与上手教程。

编辑语:

随着RISC-V生态的蓬勃发展,相关开源开发套件也开始逐渐丰富。为了帮助开发者快速了解、玩转新推出的RISC-V开发套件,OCC推出RISC-V生态开发套件解析系列内容,详细讲解生态开发套件的功能特点与上手教程。


通过上期内容的学习,相信广大开发者对于如何实现waft应用开发有了更清晰的认识。为了提升waft应用的开发效率,本期我们将带大家一起学习如何使用模拟器和dep_tools网页版。


01 模拟器使用


waft应用现在可以脱离设备,运行在pc端上的模拟器。这标志着waft应用开发又提效了,开发者可以在pc模拟器上调试好应用开发,页面调试,然后在真机上运行。下面介绍模拟器的使用。


1.准备工作


确保安装了npm cli工具,安装方法参考waft基础教学一,下载waft-ui组件demo仓库。


2.使用模拟器


我们进入下载的waft-ui组件仓库。


cd ~/waft-ui


拉起cli,运行npm start


npm start


这时会进入命令行交互界面


waft>


编译我们的waft-ui,


.build --aot=true --aotTarget=riscv64


或者直接


.build


前者会编译aot版本的waft应用,后者只编译wasm字节码


最后用模拟器加载字节码


.simulator --width=800 --height=480 --wasm=build/app.wasm


3.效果展示

image.gifimage.gif图片.png图片.png


02 dep_tools网页版使用


1.准备工作


确保安装了npm cli工具,安装方法参考waft基础教学一;


2.拉起dep_tools网页界面


进入我们的waft工程(自己建的或者通过下载的waft-ui工程均可)。


执行如下命令:


npm start


此时终端会出现以下信息:


image.gif图片.png


浏览器会自动打开页面(建议将chrome设置为默认浏览器)。


image.gif图片.png


页面默认是真机设备界面,此时,pc端是一个server。除了连接真机设备调试,还可以选择模拟器设备。


image.gif1.png


点击“启动&重启”,即可看到模拟器加载的wasm页面。


image.gif图片.png

3.查看dom树


我们还可以在页面上查看dom树的结构,


image.gif图片.png


在Console项还可以查看log


4.调试


我们还可以修改前端页面,快速在模拟器中查看效果。点击右上角的调试:

image.gif


点击调试,会生成wasm文件,并让模拟器自动加载build/目录下的app.wasm文件。


5.连接真机


网页版除了与模拟器能配合工作外,当然支持真机调试。选项切回真机设备,此时会看到server的ip地址,

2.png


通过adb shell命令登入设备。确保当前没有运行的waft_app,执行以下命令,杀死进程。


killall -9 waft_app


然后执行如下命令:


waft_app /waftapps/app_wifi.wasm 30.250.152.206 8030


连接成功后如下:

图片.png


其他操作跟模拟器一样。在推送新包时,记得勾选下面选项

图片.png


03 下期预告


本期是Waft基础教程的完结篇,有关Waft的学习与初步应用就先介绍到这里。下期内容我们将开启对这款RISC-V生态软件的组件学习,欢迎大家持续关注RISC-V生态开发套件系列内容。

相关文章
|
16天前
|
JavaScript 前端开发 API
探索移动应用的世界:从开发到操作系统的深入解析
【8月更文挑战第31天】本文将带你走进移动应用的世界,从开发到操作系统,深入探讨移动应用的开发过程、移动操作系统的工作原理以及它们之间的交互。我们将通过代码示例,让你更好地理解移动应用的开发和运行机制。无论你是初学者还是有经验的开发者,这篇文章都将为你提供有价值的信息和知识。
|
16天前
|
图形学 iOS开发 Android开发
从Unity开发到移动平台制胜攻略:全面解析iOS与Android应用发布流程,助你轻松掌握跨平台发布技巧,打造爆款手游不是梦——性能优化、广告集成与内购设置全包含
【8月更文挑战第31天】本书详细介绍了如何在Unity中设置项目以适应移动设备,涵盖性能优化、集成广告及内购功能等关键步骤。通过具体示例和代码片段,指导读者完成iOS和Android应用的打包与发布,确保应用顺利上线并获得成功。无论是性能调整还是平台特定的操作,本书均提供了全面的解决方案。
68 0
|
17天前
|
区块链 C# 存储
链动未来:WPF与区块链的创新融合——从智能合约到去中心化应用,全方位解析开发安全可靠DApp的最佳路径
【8月更文挑战第31天】本文以问答形式详细介绍了区块链技术的特点及其在Windows Presentation Foundation(WPF)中的集成方法。通过示例代码展示了如何选择合适的区块链平台、创建智能合约,并在WPF应用中与其交互,实现安全可靠的消息存储和检索功能。希望这能为WPF开发者提供区块链技术应用的参考与灵感。
30 0
|
17天前
|
开发者 C# Windows
WPF与游戏开发:当桌面应用遇见游戏梦想——利用Windows Presentation Foundation打造属于你的2D游戏世界,从环境搭建到代码实践全面解析新兴开发路径
【8月更文挑战第31天】随着游戏开发技术的进步,WPF作为.NET Framework的一部分,凭借其图形渲染能力和灵活的UI设计,成为桌面游戏开发的新选择。本文通过技术综述和示例代码,介绍如何利用WPF进行游戏开发。首先确保安装最新版Visual Studio并创建WPF项目。接着,通过XAML设计游戏界面,并在C#中实现游戏逻辑,如玩家控制和障碍物碰撞检测。示例展示了创建基本2D游戏的过程,包括角色移动和碰撞处理。通过本文,WPF开发者可更好地理解并应用游戏开发技术,创造吸引人的桌面游戏。
45 0
|
17天前
|
开发者 云计算 数据库
从桌面跃升至云端的华丽转身:深入解析如何运用WinForms与Azure的强大组合,解锁传统应用向现代化分布式系统演变的秘密,实现性能与安全性的双重飞跃——你不可不知的开发新模式
【8月更文挑战第31天】在数字化转型浪潮中,传统桌面应用面临新挑战。本文探讨如何融合Windows Forms(WinForms)与Microsoft Azure,助力应用向云端转型。通过Azure的虚拟机、容器及无服务器计算,可轻松解决性能瓶颈,满足全球用户需求。文中还提供了连接Azure数据库的示例代码,并介绍了集成Azure Storage和Functions的方法。尽管存在安全性、网络延迟及成本等问题,但合理设计架构可有效应对,帮助开发者构建高效可靠的现代应用。
14 0
|
18天前
|
监控 网络协议 Java
Tomcat源码解析】整体架构组成及核心组件
Tomcat,原名Catalina,是一款优雅轻盈的Web服务器,自4.x版本起扩展了JSP、EL等功能,超越了单纯的Servlet容器范畴。Servlet是Sun公司为Java编程Web应用制定的规范,Tomcat作为Servlet容器,负责构建Request与Response对象,并执行业务逻辑。
Tomcat源码解析】整体架构组成及核心组件
|
1月前
|
存储 NoSQL Redis
redis 6源码解析之 object
redis 6源码解析之 object
53 6
|
3天前
|
存储 缓存 Java
什么是线程池?从底层源码入手,深度解析线程池的工作原理
本文从底层源码入手,深度解析ThreadPoolExecutor底层源码,包括其核心字段、内部类和重要方法,另外对Executors工具类下的四种自带线程池源码进行解释。 阅读本文后,可以对线程池的工作原理、七大参数、生命周期、拒绝策略等内容拥有更深入的认识。
什么是线程池?从底层源码入手,深度解析线程池的工作原理
|
3天前
|
设计模式 Java 关系型数据库
【Java笔记+踩坑汇总】Java基础+JavaWeb+SSM+SpringBoot+SpringCloud+瑞吉外卖/谷粒商城/学成在线+设计模式+面试题汇总+性能调优/架构设计+源码解析
本文是“Java学习路线”专栏的导航文章,目标是为Java初学者和初中高级工程师提供一套完整的Java学习路线。
|
7天前
|
开发工具
Flutter-AnimatedWidget组件源码解析
Flutter-AnimatedWidget组件源码解析

热门文章

最新文章

推荐镜像

更多