首页 » 软件优化 » 从哈啰顺风车看我做的顺风车小程序案例(顺风程序看我乘客页面)

从哈啰顺风车看我做的顺风车小程序案例(顺风程序看我乘客页面)

少女玫瑰心 2024-10-24 05:58:32 0

扫一扫用手机浏览

文章目录 [+]

顺风车小程序思维导图

根据这个思维导图做出来的顺风车小程序框架如图所示

顺风车小程序框架

从哈啰顺风车看我做的顺风车小程序案例(顺风程序看我乘客页面) 软件优化
(图片来自网络侵删)

再根据这个框架开发出来的具体功能模块。

顺风车小程序具体功能模块:

在通过微信客户端的“扫一扫”功能扫描小程序的二维码后,会进入到“县级公益顺风车”小程序的主界面。
第一次登录小程序,会弹出提示是否允许使用微信昵称和头像信息等的提示,请选择“允许”。
主界面会出现县级公益顺风车的logo,宣传语和两个按钮。
如图所示

顺风车小程序登录

顺风车小程序登录

如果用户有车,作为司机提供顺风车服务,请点击“开车”按钮。
然后会进入创建行程页面,司机填写完善行程信息和个人信息(只需要填写一次),点击“创建行程”按钮,会创建一个新的行程,并将行程信息发布出去。
司机会进入等待页面,可通过“刷新”按钮或者下拉刷新,看到乘客信息。
如果乘客坐满,司机可以点击“出发”按钮,开始行程。
如果暂无乘客或者司机临时有事可以点击“取消行程”按钮,结束本次行程。
如图所示

顺风车小程序车主UI

顺风车小程序车主详情UI

如果用户无车,作为乘客想要搭乘顺风车,请点击“乘车”按钮。
然后会进入乘客选择页面。
在该页面中乘客可选择适合自己的顺风车。
点击完成后会进入乘客等待页面,在该页面可以看到司机的信息和同行乘客的信息。
通过“刷新”按钮或者下拉刷新,能够及时看到最新的乘车信息。
如果乘客临时有事无法搭乘,可点击“离开”按钮退出此次行程。
如图所示

顺风车小程序乘客UI

顺风车小程序同车乘客UI

顺风车小程序核心代码举例:

顺风车微信小程序的开发主要采用Javascript和CSS,开发规范基本和js,css的开发规范保持一致。
除此之外,针对本项目的开发,具体还有以下规范注意事项:

1)全局变量要在app.js的globalData中声明并初始化;

2)每一个页面的本地变量,要在该页面对应的data中声明并初始化;3)每一个页面的页面布局,要放在该页面对应的.wxss文件中。
对于公共

的页面布局属性,可放在app.wxss文件中;

4)无论是变量还是方法都要添加注释说明,注释要至少包括用途、创建时间、创建者等内容;

5)跨页面传递参数可使用全局变量、本地缓存或者navigateTo的方法。
本地缓存是永久存储的,最大容量为10M,如图所示,

顺风车小程序核心代码

不建议将关键信息全部存在本地缓存中,以防用户换设备的情况。

其他注意事项会随着项目的持续开展增添进来,可随时关注。

从哈啰顺风车看顺风车小程序:

我还没有完全熟悉哈啰顺风车的操作,这里也不是写哈啰顺风车客户体验报告,我自己折腾的顺风车小程序更多的是学习小程序的作品,跟哈啰顺风车这种商业级别的顺风车APP当然没法比,这个也只有大公司才有资源来弄的,包括政策方面,技术上我倒不会认为有多大难度,反而是资源整合的能力,不过我还是希望哈啰顺风车之类的大平台能尽快把我们县城这个级别也能解决我们春节回家的问题,到今天我还没有抢到回家的火车票呀,下午5点半又要抢2月14回广州的火车票了,希望今天好运气。

标签:

相关文章