Python用HBuilder创建交流社区APP
本文转自微信公众号:"算法与编程之美"
1、问题描述
使用HBuilder
做一个简单的社区浏览界面。
2、解决方案
这是对HBuilder
学习后想做的一些关于这个软件的一些心得,有了这个接触,想分享一些初学者可以用到的一些使用方法,让更多初学者可以早一些熟悉HBuilder
,可以熟练的运用它做出自己想要的一个界面。首先对于HBuilder
的安装,安装好后新建一个移动APP的包,在里面再创建一个HTML的文件,选择函mui
的HTML
,然后因为是社区,就要有头部和尾部,在这里,是有head
,body
构成,头部在head
的区域内附上代码,在body
中附上底部代码,就有一个最基本的页面。然后是加入社区分享部分,我们可以加入页眉和页脚,页眉里面可以“img src
”插入图片使用“class
”和“style
”调整格式;使用“button
”在页脚插入我想要的跳转按钮,同时也可以使用“class
”和“style
”调整格式。
相应代码:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" /> <title></title> <script src="js/mui.min.js"></script> <link href="css/mui.min.css" rel="external nofollow" rel="stylesheet" /> <script type="text/javascript" charset="utf-8"> mui.init(); mui.plusReady(function() { var subPages = ['home.html', 'shopping.html', 'community.html', 'personal.html']; var subPageStyle = { top: "20px", bottom: "50px" } var mainViwe = plus.webview.currentWebview(); for(var i = 0; i < subPages.length(); i++) { var url = subPages[i]; var subViwe = plus.webview.create(url, url, subPageStyle); subViwe.hide(); mainViwe.append(subViwe); } plus.webview.show(subPages[0]); }) </script> </head> <br /> <br /> <body> <header class="mui-bar mui-bar-nav"> <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a> <h1>社区</h1> </header> <div> <!--页眉,放置标题--> <div></div> <div class="mui-card-header mui-card-media"> <img src="06.jpg" /> <div> 小M <p>发表于 2016-06-30 15:30</p> </div> </div> <div class="mui-card-header mui-card-media" style="height:40vw;background-image:url(01.png)"></div> <div> </div> <div> <!--页脚,放置交互按钮--> <button type="button" class="mui-btn mui-btn-outlined" style="color: #007AFF;">点赞</button> <button type="button" class="mui-btn mui-btn-outlined" style="color: #007AFF;">评论</button> <button type="button" class="mui-btn mui-btn-outlined" style="color: #007AFF;">浏览更多</button> </div> </div> <br /> <br /> </body> <nav class="mui-bar mui-bar-tab"> <a class="mui-tab-item mui-active"> <span class="mui-icon mui-icon-home"></span> <span>首页</span> </a> <a> <span class="mui-icon mui-icon-pengyouquan"></span> <span>社区</span> </a> <a> <span class="mui-icon mui-icon-list"></span> <span>购物</span> </a> <a> <span class="mui-icon mui-icon-contact"></span> <span>我的</span> </a> </nav> </html>
3、结语
这次是学习并使用HBuilder
后的一个心得总结,还是有很多不懂不熟练的地方,会继续学习,将他做好。
到此这篇关于Python用HBuilder创建交流社区APP的文章就介绍到这了,更多相关Python用HBuilder建立APP交流社区内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!
相关文章
Win10下配置tensorflow-gpu的详细教程(无VS2015/2017)
这篇文章主要介绍了Win10下配置tensorflow-gpu(无VS2015/2017),本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下2020-07-07Pandas —— resample()重采样和asfreq()频度转换方式
今天小编就为大家分享一篇Pandas —— resample()重采样和asfreq()频度转换方式,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧2020-02-02
最新评论