快递小程序开发
项目作业 2883
等1人参与
来源: 第20周 / 慕课小程序实战开发

小伙伴们,学习了小程序的开发知识与技巧,赶快动手实践一下吧!

演示视频
作业描述

一、语言和环境
1、实现语言
HTML、CSS、ES6
2、开发环境
微信开发者工具
二、网页整体要求:
1、要求页面整洁、美观,与提供的页面效果图结构保持一致。
2、要求代码书写、命名符合规范,在代码中添加必要的注释。
3、网页文件夹管理,每个页面存放在独立文件夹中。
三、具体要求:
1、本作业主要包含以下几个页面:首页、寄快递页面、查快递页面、我的页面和实名认证页面。
2、效果图可以参考“作业素材”中提供的设计稿。
3、具体要实现的每项要求,以及评分可以参考下面的“评分标准”。

评分标准是什么?

一、【规范】(6分)
1、每个页面的wxml、wxss、js和json文件放在同一个文件夹中
2、文件以及文件夹都要使用英文命名
3、代码书写规范,且有适量的注释

二、【首页】(20分)
1、banner图片
2、常用快递员信息栏
3、 我的订单
4、底部的tabbar,包含四个菜单项,分别是“首页”、“寄快递”、“查快递”和“我的”

三、【寄快递页面】(25分)
1、顶部navigaionBar标题为“寄快递”
2、快递员的信息
3、发件人信息
4、收件人信息
5、下一步按钮
6、“守时守约”等服务说明内容
7、底部的tabbar,包含四个菜单项,分别是“首页”、“寄快递”、“查快递”和“我的”

四、【查快递页面】(15分)
1、搜索框
2、图片
3、错误提示文字
4、底部的tabbar,包含四个菜单项,分别是“首页”、“寄快递”、“查快递”和“我的”

五、【我的页面】(22分)
1、个人信息
2、绑定手机
3、我的实名:点击“我的实名”,跳转到实名认证页面
4、我的抵用券
5、常用地址
6、消息中心
7、客服服务
8、底部的tabbar,包含四个菜单项,分别是“首页”、“寄快递”、“查快递”和“我的”

六、【实名认证页面】(7分)
1、姓名
2、证件号码
3、证件照片
4、手机号码
5、提交按钮

作业素材
下载素材

作业素材仅供学习与参考,请按要求完成作业

项目作业上传说明
第1步:上传你的作业压缩包
第2步:等待讲师一对一批复
第3步:查看讲师点评
上传作业

登录后查看更多作业,立即

批复案例

作业的问题和建议如下:
( 注:图片看不清楚的,可以另存到本地看大图)

【寄快递页面】
1、发件人信息和收件人信息前面缺少小点,正确效果如下:
图片描述
该小点可以使用view标签来实现,如下:
图片描述
图片描述
图片描述
2、守时守约等服务说明,彼此之间缺少竖线。正确效果如下:
图片描述
竖线可以通过view标签来实现。
建议在前两个f-item后面,添加一个view标签表示横线,如下:
图片描述
图片描述
【查快递页面】
1、搜索框缺少圆角效果:
图片描述
建议添加border-radius属性,如下:
图片描述
1、该页没有内容的部分,背景色应该是灰色,如下:
图片描述
建议给page设置灰色背景,如下:
图片描述
图片描述
2、整体结构可优化:
图片描述
. myitem的下边框颜色太深了,不好看,建议改浅些,例如:#f2f2f2。
【实名认证页面】
1、每一项底部,缺少边框:
图片描述
建议添加border属性,如下:
图片描述

评论
展开评论
微信客服

购课补贴
联系客服咨询优惠详情

帮助反馈 APP下载

慕课网APP
您的移动学习伙伴

公众号

扫描二维码
关注慕课网微信公众号

在线咨询

领取优惠

免费试听

领取大纲

扫描二维码,添加
你的专属老师