Android程序猿从零开发小程序项目(一)

简介: Android程序猿从零开发小程序项目(一)

前言

我作为一个普通的Android程序员,由于需求原因被公司安排做小程序开发了,前前后后研究小程序也有两个月左右了,也完成了公司的一个小工具,算是入门了。前面我也在公众号发布过小程序的学习文章。

接下来我将计划写一个个人小程序,当做学习练手项目,基础确实很重要,特别是对我这种前端基础薄弱的人来说,学习小程序确实不太容易,所以建议大家学习小程序前,最好先学习一下前端相关的基础,这样将非常容易上手小程序开发。

一、小程序开发准备

做小程序开发需要一个APPID,所以要先到微信公众平台https://mp.weixin.qq.com/ 注册开发者账号,绑定自己的微信作为管理员,然后在开发者后台可以查看自己的APPID,一个开发者后台只可以发布一个小程序,后续可以覆盖发布;

二、开发者工具

微信小程序有自己的专门开发工具,支持小程序和公众号开发。在小程序开发文档中找到小程序开发工具的下载页面,或者直接输入https://mp.weixin.qq.com/debug/wxadoc/dev/devtools/download.html 根据自己的操作系统下载对应的安装包进行安装。

三、开始我的个人项目

有了前面两步的准备之后,就可以开发小程序项目了

1.打开小程序开发工具,使用之前注册小程序所使用的微信扫码登录。选择小程序项目

image.png

2.新建名为xxx的项目,输入APPID 然后勾选 "创建 QuickStart 项目",点击确定,那么第一个小程序项目就创成功建了。

3.项目代码组成可分为:配置代码JSON文件、模板代码 WXML 文件、样式代码 WXSS文件以及逻辑代码 JavaScript文件组成。

JSON文件:在小程序代码中扮演静态配置的作用,在小程序运行之前就决定了小程序一些表现,需要注意的是小程序是无法在运行过程中去动态更新JSON 配置文件从而发生对应的变化的。

WXML全称是 WeiXin Markup Language,是小程序框架设计的一套标签语言,结合小程序的基础组件、事件系统,可以构建出页面的结构。

WXSS(WeiXin Style Sheets)是一套用于小程序的样式语言,用于描述WXML的组件样式,也就是视觉上的效果。WXSS与Web开发中的CSS类似。为了更适合小程序开发,WXSS对CSS做了一些补充以及修改。

给我的理解就是:WXML就类似前端的HTML,WXSS就类似前端的CSS,所以前面我说了最好有前端相关的基础,这样将非常容易上手小程序开发。

接下来我要开始我的项目了——生活小助手项目,整体框架如下图:

效果图如下:

image.png

分为三大模块:

    天气预报、

    精选文章、

    个人中心,

这里我只搭建了整体的框架,由底部菜单切换,后面有时间再继续分模块开发,小程序创建底部菜单非常简单,在app.json文件进行配置即可。

app.json文件里面的json字段 pages,相当于Android开发的androidmainfest.xml里面注册activity页面一样,凡是新建的page页面都要在这里注册。

app.json文件里面的json字段 window,相当于Android开发的styles.xml文件,实际上就是样式设置,比如窗口颜色,状态栏背景色,全局标题等设置。

app.json文件里面的json字段 tabBar,这里就是设置底部菜单的,用起来比Android开发的更简单方便,今天算是入门篇了,就总结到这里了,其中还有很多基础的就不再一一赘述了,

接下来我将会利用业余时间来完成这个属于自己的小程序项目,欢迎大家关注本公众号,一起学习,谢谢!

项目地址:

https://github.com/zsml2016/LivingTools

相关文章
|
16天前
|
人工智能 小程序
【一步步开发AI运动小程序】十五、AI运动识别中,如何判断人体站位的远近?
【云智AI运动识别小程序插件】提供人体、运动及姿态检测的AI能力,无需后台支持,具有快速、体验好、易集成等特点。本文介绍如何利用插件判断人体与摄像头的远近,确保人体图像在帧内的比例适中,以优化识别效果。通过`whole`检测规则,分别实现人体过近和过远的判断,并给出相应示例代码。
|
10天前
|
人工智能 小程序 API
【一步步开发AI运动小程序】十七、如何识别用户上传视频中的人体、运动、动作、姿态?
【云智AI运动识别小程序插件】提供人体、运动、姿态检测的AI能力,支持本地原生识别,无需后台服务,具有速度快、体验好、易集成等优点。本文介绍如何使用该插件实现用户上传视频的运动识别,包括视频解码抽帧和人体识别的实现方法。
|
15天前
|
人工智能 小程序 UED
【一步步开发AI运动小程序】十六、AI运动识别中,如何判断人体站位?
【云智AI运动识别小程序插件】提供人体、运动及姿态检测的AI能力,本地引擎无需后台支持,具备快速、体验好、易集成等优势。本文介绍如何利用插件的`camera-view`功能,通过检测人体站位视角(前、后、左、右),确保运动时的最佳识别率和用户体验。代码示例展示了如何实现视角检查,确保用户正或背对摄像头,为后续运动检测打下基础。
|
15天前
|
移动开发 小程序 PHP
校园圈子论坛系统采取的PHP语音和uni账号开发的小程序APP公众号H5是否只需要4800元?是的,就是只需要4800元
关于校园圈子论坛系统采用PHP语言和uni-app开发的小程序、APP、公众号和H5是否仅需4800元这个问题,实际上很难给出一个确定的答案。这个价格可能受到多种因素的影响
49 8
|
11天前
|
人工智能 小程序 数据处理
uni-app开发AI康复锻炼小程序,帮助肢体受伤患者康复!
近期,多家康复机构咨询AI运动识别插件是否适用于肢力运动受限患者的康复锻炼。本文介绍该插件在康复锻炼中的应用场景,包括康复运动指导、运动记录、恢复程度记录及过程监测。插件集成了人体检测、姿态识别等功能,支持微信小程序平台,使用便捷,安全可靠,帮助康复治疗更加高效精准。
|
17天前
|
人工智能 小程序 JavaScript
【一步步开发AI运动小程序】十四、主包超出2M大小限制,如何将插件分包发布?
本文介绍了如何从零开始开发一个AI运动小程序,重点讲解了通过分包技术解决程序包超过2M限制的问题。详细步骤包括在uni-app中创建分包、配置`manifest.json`和`pages.json`文件,并提供了分包前后代码大小对比,帮助开发者高效实现AI运动功能。
|
21天前
|
开发框架 Android开发 iOS开发
安卓与iOS开发中的跨平台策略:一次编码,多平台部署
在移动应用开发的广阔天地中,安卓和iOS两大阵营各占一方。随着技术的发展,跨平台开发框架应运而生,它们承诺着“一次编码,到处运行”的便捷。本文将深入探讨跨平台开发的现状、挑战以及未来趋势,同时通过代码示例揭示跨平台工具的实际运用。
|
1月前
|
开发框架 前端开发 Android开发
安卓与iOS开发中的跨平台策略
在移动应用开发的战场上,安卓和iOS两大阵营各据一方。随着技术的演进,跨平台开发框架成为开发者的新宠,旨在实现一次编码、多平台部署的梦想。本文将探讨跨平台开发的优势与挑战,并分享实用的开发技巧,帮助开发者在安卓和iOS的世界中游刃有余。
|
21天前
|
搜索推荐 前端开发 API
探索安卓开发中的自定义视图:打造个性化用户界面
在安卓应用开发的广阔天地中,自定义视图是一块神奇的画布,让开发者能够突破标准控件的限制,绘制出独一无二的用户界面。本文将带你走进自定义视图的世界,从基础概念到实战技巧,逐步揭示如何在安卓平台上创建和运用自定义视图来提升用户体验。无论你是初学者还是有一定经验的开发者,这篇文章都将为你打开新的视野,让你的应用在众多同质化产品中脱颖而出。
46 19

热门文章

最新文章