移动端开发框架mui代码在安卓模拟器上运行(HbuilderX连接到模拟器)

开发工具
HBuilder X 3.8.12.20230817

移动端开发框架mui代码在安卓模拟器上运行(HbuilderX连接到模拟器)_第1张图片

注意:开发工具尽量用最新的或较新的。太旧的版本在开发调试过程中可能会出现莫名其妙的问题。


1、电脑下载安装安卓模拟器

我这里使用的是 夜神模拟器 ,也可以选择其他安卓模拟器
夜神模拟器官网:夜神安卓模拟器-安卓模拟器电脑版下载_安卓手游模拟器_手机模拟器_官网安卓模拟器哪个好用?电脑玩手游首选夜神安卓模拟器。夜神模拟器采用领先内核(基于Android7.1),同时是全球首家支持Android9内核的模拟器,在性能、稳定性及兼容性等方面有着同类产品无可比拟的优势。高清流畅,多开挂机更省资源,键鼠和手柄操作给你完美的操控体验,畅享电脑玩手游的至高快乐。icon-default.png?t=N7T8https://www.yeshen.com/
移动端开发框架mui代码在安卓模拟器上运行(HbuilderX连接到模拟器)_第2张图片

点击下载并安装,安卓完成后桌面会生成 ‘夜神模拟器’ 快捷方式
移动端开发框架mui代码在安卓模拟器上运行(HbuilderX连接到模拟器)_第3张图片

移动端开发框架mui代码在安卓模拟器上运行(HbuilderX连接到模拟器)_第4张图片

移动端开发框架mui代码在安卓模拟器上运行(HbuilderX连接到模拟器)_第5张图片

移动端开发框架mui代码在安卓模拟器上运行(HbuilderX连接到模拟器)_第6张图片

2、运行模拟器、查找及确认模拟器运行端口
 

运行模拟器:

双击桌面快捷方式 ‘夜神模拟器’ 运行模拟器,并进入模拟器桌面
移动端开发框架mui代码在安卓模拟器上运行(HbuilderX连接到模拟器)_第7张图片

移动端开发框架mui代码在安卓模拟器上运行(HbuilderX连接到模拟器)_第8张图片

移动端开发框架mui代码在安卓模拟器上运行(HbuilderX连接到模拟器)_第9张图片

查找及确认模拟器运行端口:
(这里说一下夜神模拟器默认端口是62001,但是有些版本可能不是这个端口)

鼠标右键电脑桌面的模拟器快捷方式,查看模拟器安装目录
移动端开发框架mui代码在安卓模拟器上运行(HbuilderX连接到模拟器)_第10张图片

点击 ‘打开文件所在的位置’,并找到  debugReport.bat 文件

移动端开发框架mui代码在安卓模拟器上运行(HbuilderX连接到模拟器)_第11张图片

双击运行  debugReport.bat 文件
运行后出现以下内容,则表示模拟器已启动并使用了 62001端口
nox adb port:62001
already connected to 127.0.0.1:62001

移动端开发框架mui代码在安卓模拟器上运行(HbuilderX连接到模拟器)_第12张图片

也可以运行 debug.bat 文件,可以查看模拟器端口
移动端开发框架mui代码在安卓模拟器上运行(HbuilderX连接到模拟器)_第13张图片

3、开发工具HBuilderX配置模拟器

打开开发工具HBuilderX
移动端开发框架mui代码在安卓模拟器上运行(HbuilderX连接到模拟器)_第14张图片

单击左侧项目进行选中,在上面菜单栏依次打开   运行 》运行到手机或模拟器 》Android模拟器端口设置

移动端开发框架mui代码在安卓模拟器上运行(HbuilderX连接到模拟器)_第15张图片

在打开的设置页面,只需要配置adb路径 及 Android模拟器端口

adb路径即夜神模拟器的运行adb文件所在目录,即 D:\Program Files\Nox\bin\adb.exe
移动端开发框架mui代码在安卓模拟器上运行(HbuilderX连接到模拟器)_第16张图片
Android模拟器即第三步查询到的夜神模拟器的运行端口,即端口号 62001

移动端开发框架mui代码在安卓模拟器上运行(HbuilderX连接到模拟器)_第17张图片

4、开发工具HBuilderX在模拟器中APP

第三步完成后,在菜单栏依次打开 运行 》 运行到手机或模拟器 》运行到Android App基座
移动端开发框架mui代码在安卓模拟器上运行(HbuilderX连接到模拟器)_第18张图片

在设备列表中,可以看到 127.0.0.1:62001 即模拟器设备

移动端开发框架mui代码在安卓模拟器上运行(HbuilderX连接到模拟器)_第19张图片

点击 运行 按钮,观察开发工具及模拟器(将在夜神模拟器中安装APP及运行)
开发工具控制台会提示正在连接手机,并安装手机运行环境,此时手机端会由APP安装的操作:

移动端开发框架mui代码在安卓模拟器上运行(HbuilderX连接到模拟器)_第20张图片

模拟器:完成APP的安装,模拟器桌面可以看到APP图标,并成功运行。电脑右下角会提示模拟器已安装APP

移动端开发框架mui代码在安卓模拟器上运行(HbuilderX连接到模拟器)_第21张图片

移动端开发框架mui代码在安卓模拟器上运行(HbuilderX连接到模拟器)_第22张图片

移动端开发框架mui代码在安卓模拟器上运行(HbuilderX连接到模拟器)_第23张图片

5、相关问题

APP图标及应用名称:
因为是调试模式,所以HbuilderX工具安装到模拟器的图标和应用是默认的,这个没关系的。真正打包APP后,会跟你代码设置的APP图标及应用名一样。

开发工具检测不到模拟器(设备列表无法显示):
原因1: 第一次配置模拟器端口时,由于开发工具未检测到模拟器运行,重启HBuilderX工具后可以正常显示

原因2:模拟器未运行(见本文操作步骤2和3),或端口配置错误。建议(或重启)操作:先运行模拟器、再运行开发工具HBuilderX
 


HBuilderX在手机中运行APP
移动端开发框架mui代码在手机(真机)上运行(HbuilderX连接到手机)

你可能感兴趣的:(移动端开发,android,前端)