Python用HBuilder创建交流社区APP

 更新时间:2021年11月18日 09:54:24   作者:王晓姣  
这篇文章主要讲解Python使用HBuilder创建交流社区APP,使用HBuilder做一个简单的社区浏览界面,下面文章附有详细的代码,需要的朋友可以参考一下

本文转自微信公众号:"算法与编程之美"

1、问题描述

使用HBuilder做一个简单的社区浏览界面。

2、解决方案

这是对HBuilder学习后想做的一些关于这个软件的一些心得,有了这个接触,想分享一些初学者可以用到的一些使用方法,让更多初学者可以早一些熟悉HBuilder,可以熟练的运用它做出自己想要的一个界面。首先对于HBuilder的安装,安装好后新建一个移动APP的包,在里面再创建一个HTML的文件,选择函muiHTML,然后因为是社区,就要有头部和尾部,在这里,是有headbody构成,头部在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交流社区内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

  • Python脚本实现小猿口算

    Python脚本实现小猿口算

    最近小猿口算已经被不少大学生攻占,一个好好的给小学生的口算题已经变成了大学生的计算机大战,下面我们就来看看如何使用Python脚本就行吧小猿口算
    2024-10-10
  • 我们为什么要减少Python中循环的使用

    我们为什么要减少Python中循环的使用

    这篇文章主要介绍了我们为什么要减少Python中循环的使用,我将阐述 Python 提供的一些简单但是非常有用的结构,一些小技巧以及一些我在数据科学工作中遇到的案例。我将讨论 Python 中的 for 循环,以及如何尽量避免使用它们,需要的朋友可以参考下
    2019-07-07
  • 如何从Python的cmd中获得.py文件参数

    如何从Python的cmd中获得.py文件参数

    这篇文章主要介绍了如何从Python的cmd中获得.py文件参数操作,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2021-05-05
  • python 打印dict的key与value方式

    python 打印dict的key与value方式

    这篇文章主要介绍了python 打印dict的key与value方式,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2022-11-11
  • Python实现csv文件(点表和线表)转换为shapefile文件的方法

    Python实现csv文件(点表和线表)转换为shapefile文件的方法

    这篇文章主要介绍了Python实现csv文件(点表和线表)转换为shapefile文件的方法,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2021-10-10
  • python re的findall和finditer的区别详解

    python re的findall和finditer的区别详解

    这篇文章主要介绍了python re的findall和finditer的区别详解,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2020-11-11
  • Python使用PyAV提取视频关键帧的实践

    Python使用PyAV提取视频关键帧的实践

    本文主要介绍了Python使用PyAV提取视频关键帧的实践,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2022-08-08
  • Python处理EXCEL表格导入操作分步讲解

    Python处理EXCEL表格导入操作分步讲解

    python操作excel主要用到xlrd和pandas两个库,xlrd读取表格数据,支持xlsx和xls格式的excel表格,文章围绕主题展开详细的内容介绍,具有一定的参考价值,需要的朋友可以参考一下
    2022-08-08
  • Python3调用微信企业号API发送文本消息代码示例

    Python3调用微信企业号API发送文本消息代码示例

    这篇文章主要介绍了Python3调用微信企业号API发送文本消息代码示例,具有一定参考价值,需要的朋友可以了解下。
    2017-11-11
  • Pycharm激活方法及详细教程(详细且实用)

    Pycharm激活方法及详细教程(详细且实用)

    这篇文章主要介绍了Pycharm激活方法及详细教程,本文通过图文并茂的形式给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友参考下吧
    2020-05-05

最新评论