Python用HBuilder創(chuàng)建交流社區(qū)APP
本文轉(zhuǎn)自微信公眾號:"算法與編程之美"
1、問題描述
使用HBuilder做一個簡單的社區(qū)瀏覽界面。
2、解決方案
這是對HBuilder學習后想做的一些關(guān)于這個軟件的一些心得,有了這個接觸,想分享一些初學者可以用到的一些使用方法,讓更多初學者可以早一些熟悉HBuilder,可以熟練的運用它做出自己想要的一個界面。首先對于HBuilder的安裝,安裝好后新建一個移動APP的包,在里面再創(chuàng)建一個HTML的文件,選擇函mui的HTML,然后因為是社區(qū),就要有頭部和尾部,在這里,是有head,body構(gòu)成,頭部在head的區(qū)域內(nèi)附上代碼,在body中附上底部代碼,就有一個最基本的頁面。然后是加入社區(qū)分享部分,我們可以加入頁眉和頁腳,頁眉里面可以“img src”插入圖片使用“class”和“style”調(diào)整格式;使用“button”在頁腳插入我想要的跳轉(zhuǎn)按鈕,同時也可以使用“class”和“style”調(diào)整格式。
相應代碼:
<!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>社區(qū)</h1>
</header>
<div>
<!--頁眉,放置標題-->
<div></div>
<div class="mui-card-header mui-card-media">
<img src="06.jpg" />
<div>
小M
<p>發(fā)表于 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>社區(qū)</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、結(jié)語
這次是學習并使用HBuilder后的一個心得總結(jié),還是有很多不懂不熟練的地方,會繼續(xù)學習,將他做好。
到此這篇關(guān)于Python用HBuilder創(chuàng)建交流社區(qū)APP的文章就介紹到這了,更多相關(guān)Python用HBuilder建立APP交流社區(qū)內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
python代碼實現(xiàn)小程序登錄流程時序總結(jié)
這篇文章主要為大家介紹了python代碼實現(xiàn)小程序的登錄案例,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進步早日升職加薪2022-04-04
簡單且有用的Python數(shù)據(jù)分析和機器學習代碼
Python編程是一種通用的編程語言,開源、靈活、功能強大且易于使用,python最重要的特性之一是其用于數(shù)據(jù)處理和分析任務的豐富實用程序和庫集,這篇文章主要給大家介紹了一些簡單且有用的Python數(shù)據(jù)分析和機器學習代碼,需要的朋友可以參考下2021-07-07
Win10下配置tensorflow-gpu的詳細教程(無VS2015/2017)
這篇文章主要介紹了Win10下配置tensorflow-gpu(無VS2015/2017),本文給大家介紹的非常詳細,對大家的學習或工作具有一定的參考借鑒價值,需要的朋友可以參考下2020-07-07
Pandas —— resample()重采樣和asfreq()頻度轉(zhuǎn)換方式
今天小編就為大家分享一篇Pandas —— resample()重采樣和asfreq()頻度轉(zhuǎn)換方式,具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧2020-02-02

