模拟器收藏我的收藏
收藏
我的收藏小程序项目通过编译之后,自动在模拟器中运行,模拟小程序在字节系 App 客户端的表现,无需真机即可快速预览。基础互动方式是通过鼠标点击、拖拽来模拟手指触摸、拖动操作。
首次进入,模拟器默认位于主界面左侧:
模拟器顶部功能
- •机型:开发者可以选择不同的设备来调试小程序,以观察小程序在不同尺寸机型上的适配问题。
- •缩放比例:开发者可以控制模拟屏幕的显示比例。
- •屏幕高度:开发者可以切换分屏模式调试小程序直播场景。
- •网络连接:开发者可以切换网络来模拟不同网络场景。
- •抖音登录:开发者通过抖音扫码登录,在小程序拿到真实抖音用户信息。
- •模拟工具:模拟手机的部分操作,用以触发特定事件。常见的事件比如切后台、截屏、内存警告等。
- •独立窗口:开发者可以通过点击【独立窗口】按钮,将模拟器区域从开发者工具主窗口弹出,以独立窗口的形式展现。
- •布局切换:该功能可以将模拟器的位置与编辑器、调试器进行左右切换。
设备皮肤
在模拟器中,IDE 提供了常见设备皮肤(iOS/Android)供开发者直观调试小程序在不同机型上的效果,开发者可以通过模拟器顶部菜单栏上的设备列表进行切换。
自定义设备
除了固定的设备外,开发者可以选择不同的设备,也可以选择自定义设备,拖动模拟器来调试小程序在不同尺寸机型上的适配问题。
抖音测试账号登录
从 IDE 3.3.7 版本起,模拟器支持使用抖音扫码绑定测试账号。扫码绑定后,模拟器中依赖用户身份的开放能力,如
tt.login
,tt.getUserProfile
,code2Session
等,将使用该抖音用户的信息,与抖音 App 表现相同。开放能力 | 模拟器未登录 | 模拟器登录抖音账号 |
以开发者账号模拟登录,返回开发者账号的模拟 code | 以抖音账号登录,返回抖音账号的 code | |
返回开发者账号的信息 | 返回抖音账号的真实信息 | |
返回模拟的 openid | 返回抖音账号的真实 openid |
操作方法:
点击头像区域触发登录二维码,使用抖音 App 扫码登录。
登录后,头像区域展示抖音头像。
登录后再次点击头像区域,可以退出登录。
此外,在模拟器未登录的情况下,若用户使用抖音扫码登录 IDE,模拟器将自动绑定该抖音用户。此时用户如需更改模拟器绑定的抖音用户,可以手动退出登录后,重新使用其他抖音账号扫码绑定。
工具栏
点击模拟器上方小工具图标,显示/隐藏更多模拟功能。
- •主页:切后台事件。
- •返回:返回上一页事件。
- •webview:当前页面有 web-view 组件时,点击按钮后打开当前 web-view 组件所加载页面的控制台。
- •截图:模拟手机截屏事件。
- •内存警告:模拟内存警告事件。
- •定位:模拟手机定位数据,支持地图选择地址经纬度和输入经纬度。
- •罗盘:模拟手机罗盘数据。
- •录屏:模拟手机录屏事件。
- •静音:模拟手机静音能力。
主页
返回
快速返回到上一页。
Webview
说明:此功能仅在 web-view 页面可用,其他页面下置灰无法点击。
截图
内存警告
定位
模拟器工具栏「定位」功能使用了高德地图 SDK。
罗盘
录屏
静音
模拟手机静音,用于开发音视频静音测试,支持缓存效果。
独立窗口
有不少开发者基于小程序三方框架接入,需要结合自己偏好的编辑器开发,只用开发者工具看效果和调试,因此模拟器支持作为独立窗口弹出。在模拟器右上角单击按钮,可以使用独立窗口显示模拟器或调试器。
布局切换
首次打开工程,模拟器默认位于主界面左侧,当点击“布局切换”按钮,模拟器将切换布局,展示在右侧。
模拟器布局与工程绑定并缓存到本地中。当下次进入时,模拟器会展示在上次设置的布局位置。
模拟器底部功能
模拟器底部存在四个功能,分别是「页面参数」、「启动路径」、「场景值」、「骨架屏」。
- •页面参数:显示当前页面路径。点击打开,可直接打开当前页面 js 文件;点击复制可快速复制路径至剪贴板;点击右键则展示目录下文件后缀,点击即可打开对应文件。
- •启动路径:显示当前页面收到的参数。点击复制可快速复制参数至剪贴板。
- •场景值:显示当前编译模式设置的场景值。点击复制可快速复制参数至剪贴板。
- •骨架屏:显示当前页面配置的骨架屏路径。详情可以参考骨架屏。