直接先做个例子吧
首先想要一个最简单的东西
0@2x.png
好吧 那就最简单的 先搞成这样
表示先安装软件 http://www.dcloud.io/
好了 然后 创建2个APP项目 如图
1@2x.png
2@2x.png
然后运行2个项目
3@2x.png
然后 我要的是 例子的样子 我根据自己学过的OC 觉得先要有个Tab 所以在模板里找到 然后找到代码位置 后面直接拖到自己的项目里面 如下图
4@2x.png
问题来了 OC里面有个入口application那这个里面呢？ 如下图可以设置入口
5@2x.png
记得ctrl+s保存 运行起来
7@2x.png
可以了但是觉得必须有个入口做配置然后跳转到UI界面所以1.先入口还原
6@2x.png
2.再把 index里面的代码改成
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
<title>Hello world</title>
<script type="text/javascript">
// 扩展API是否准备好，如果没有则监听“plusready"事件
if(window.plus){
plusReady();
}else{
document.addEventListener( "plusready", plusReady, false );
}
// 扩展API准备完成后要执行的操作
function plusReady(){
// var ws = plus.webview.currentWebview(); //pw回车可输出plus.webview
// ... code
var url = "UI(模块)/tab.html"
var taskList = plus.webview.create(url).show();
}
</script>
</head>
<body>
</body>
</html>
别问我这代码什么意思我就copy网上的具体
https://segmentfault.com/a/1190000005340854
再运行
可以，那我要改图片 怎么改？
8@2x.png
那里句代码改成
<span class="mui-icon custom_home" style="height:5vw;background-image: url(../图片资源/custom_home.png);"></span>
点击事件？大小？间距？这些就要看后面的 html5语法啦
http://www.runoob.com/html/html-tutorial.html
tab好了下面开始其他样式啦
网友评论