7天写“分答”微信小程序第一天:组织与首页

首发地址:http://weappdev.com/t/topic/135

github仓库地址:https://github.com/icindy/fenda

目的是什么

  • 自我学习,可以通过做一款微信小程序学习微信小程序相关的开发
  • 和别人交流,光说不练假把式,欢迎批评指正
  • 记录过程,方便其他人学习和建议

为什么是分答?

  • 分答足够的简单-目前功能也多,不过主要功能没有那么复杂,不反感
  • 分答已经有自己的webapp,获取资源及设计方便,直接上手
  • 分答的功能基本上能够覆盖微信小程序的功能文档,练手和学习很合适
  • 知道的人多,嘿嘿

第一天任务

  • 采集必要信息
  • 搭建整体框架
  • 实现首页UI

先抛开发中遇到的问题,求助

如果您有好的方法建议,请告诉我,谢谢

  • tabbar如果没有图标的情况下如何自定义

我查看了文档,发现貌似图标和文字都是必填的,稍后再看

  • 图片如何做到自适应

mode模式中尝试了,但是自适应长度后image的高度依然会占据布局。

采集必要信息

主要是分答的功能分析和UI资源获取

  • 功能分析

浏览器打开 http://fd.zaih.com/ 或 微信打开分答

1.限免-问题榜和悬赏
2.收听-关注等功能
3.找人-搜索
4.我的-个人信息

分答页面
  • UI整体分析

当然,我很懒惰,直接拿官方的css来看和使用

Screen Shot 2016-10-17 at 11.49.17.png
  • 搭建整体框架及文件目录-请看图片标注
7天写“分答”微信小程序第一天:组织与首页_第1张图片
微信小程序分答框架标注
  • 实现首页UI

** 列表-使用模版模式引入 **

使用模版后,整个页面中的代码清晰很多,建议使用

1.建立模版-question.wxml


2.引入模版

在index.wxml中引入



调用