webcat 怎么新建工程和运行预览
第一次打开 webcat,从空白首页到看见自己写的页面跑起来,主线就四步:建工程、写代码、点运行、看预览。这篇把这条线一步步走完;各功能的完整清单见 webcat手机代码编辑器功能盘点。
第一步:新建工程
- 打开应用,首页是工程列表(右下角有一个 + 号);
- 点加号,选「新建工程」——有的版本会让你先挑模板,想从零写就选空白,想先看个能跑的例子就挑一个模板;
- 给工程起个名字,确认后它出现在首页列表里;
- 点进这个工程,就进了编辑器界面。
工程列表就是你的工作台:所有项目平铺在这里,点谁进谁。重命名、删除这类操作在工程条目上长按(或进条目里的菜单,各版本入口略有差异)。
第二步:写代码
工程里默认会有一个入口文件(通常是 index.html),直接点开改。写的过程中能感受到两件省心的事:
- 语法高亮:标签、属性、字符串分色显示,结构一眼看清;
- 自动补全:写
<h就弹出标签候选,选中自动补上后半截。
需要新文件就在工程文件列表里新建——HTML、CSS、JS 各放各的文件,互相引用;要拿现成源码开工,用「导入文件」选 ZIP 压缩包,系统文件管理器里选中即可。
第三步:点运行
编辑界面里找运行入口,点一下,应用用内置内核把当前页面跑起来。这就是手机上「所见即所得」的部分:改一行、再跑一次,看到的就是最新效果。
预览界面里还有多设备视图模拟,同一个页面切不同屏幕尺寸看——手机上写响应式页面,就用它核对窄屏下的样子。
第四步(可选):跑 PHP
想跑 PHP 的多一步准备:进设置,找到「PHP 运行环境」开关并打开(默认是关的)。回到工程新建一个 .php 文件,写一句:
<?php echo "hello"; ?>
点运行,页面里出现 hello 就是环境通了。多份第三方教程对这一步的描述一致:开关打开 → 新建 .php → 运行验证。
常见的第一次卡壳
- 预览页面空白:先查入口文件名是不是 index.html、路径大小写有没有写错;PHP 项目多半是设置里那个开关没开;
- 导入 ZIP 没反应:5.2.1 起导入改走系统文件管理器,在弹出的选择器里选中文件才算导入完成;
- 断网打不开共享空间:编辑与预览不联网,共享空间、云同步才需要网络——断网时这两个打不开属正常。
预览跑通之后,要是想把做好的页面变成能独立安装的应用,接着看 webcat把网页打包成安卓应用的过程;功能的横向盘点则在 webcat手机代码编辑器功能盘点,界面实拍可以到 WebCat 介绍站对照着看。