微信小程序开发全案精讲主讲人：小刚老师第5章电影类：仿淘票票微信小程序5.1需求描述及交互分析5.2设计思路和相关知识点5.3电影
界面顶部页签切换效果设计5.4正在热映界面布局设计微信小程序开发全案精讲第5章电影类：仿淘票票微信小程序5.5即将上映界面
布局设计5.6电影详情页设计5.7我的界面列表导航设计5.8登录设计微信小程序开发全案精讲第5章电影类：仿淘票票微信小程
序5.1需求描述及交互分析需求描述（1）电影顶部页签设计，分为正在热映、即将上映，单击页签会显示相应的内容；微信小程序开发全案
精讲第5章电影类：仿淘票票微信小程序5.1需求描述及交互分析需求描述（2）电影列表界面设计，显示电影海报、电影名称、电影类
型、导演、主演、上映年份等等信息；微信小程序开发全案精讲第5章电影类：仿淘票票微信小程序5.1需求描述及交互分析需求描述（
3）单击电影列表信息，可以进入到电影详情页界面，查看电影的详细信息；微信小程序开发全案精讲第5章电影类：仿淘票票微信小程序5.
1需求描述及交互分析需求描述（4）我的界面设计，展示用户信息以及采用列表式导航设计我的界面导航信息；微信小程序开发全案精讲第5
章电影类：仿淘票票微信小程序5.1需求描述及交互分析需求描述（5）登录界面设计，输入用户名和密码进行登录，如果用户名和密码
都正确，则允许登录到微信小程序里；微信小程序开发全案精讲第5章电影类：仿淘票票微信小程序5.1需求描述及交互分析需求描述（
5）分享功能设计，可以把电影列表界面分享给好友或者微信群；微信小程序开发全案精讲第5章电影类：仿淘票票微信小程序5.1需求描
述及交互分析交互分析（1）底部标签导航有电影、我的，单击不同底部标签导航显示对应的界面内容；（2）在电影界面里，顶部有两个页签：
正在热映、即将上映，单击页签会显示相应的电影列表内容；（3）在电影界面里，单击电影列表信息，可以跳转到电影详情界面，查看电影详细
信息；（4）在电影界面里，单击分享按钮，可以把电影列表界面分享给微信好友或者微信群里；（5）在我的界面里，展示用户信息以及采用列
表式导航展示用户相关信息；（6）在我的界面里，如果用户未登录，单击用户图标，跳转到登录界面进行登录；微信小程序开发全案精讲第5章
电影类：仿淘票票微信小程序5.2设计思路及相关知识点设计思路（1）设计底部标签导航，准备好底部标签导航的图标和建立相应的两
个页面；（2）设计首页的幻灯片轮播效果，需要准备好要轮播的图片，同时借助于swiper滑块视图容器组件完成幻灯片轮播效果；（3）设
计顶部页签切换效果，需要借助于swiper滑块视图容器组件，动态切换不同页签对应的内容；（4）展示电影列表信息，需要使用wx.re
quest(OBJECT)发起网络请求获取电影列表信息，动态展示到电影界面里；（5）界面分享功能，需要使用onShareAppMe
ssage函数进行界面的分享；（6）将用户信息保存到本地，需要借助于wx.setStorage这个API将用户数据信息异步保存到本
地；（7）获取本地用户信息，需要使用wx.getStorage这个API从本地异步获取用户信息；（8）电影、影院、我的界面布局设
计，需要使用view、image等组件，电影详情界面的立即购票按钮固定在底部设计需要使用position:fixed属性；微信小程
序开发全案精讲第5章电影类：仿淘票票微信小程序5.2设计思路及相关知识点相关知识点（1）swiper滑块视图容器组件，可以
实现海报轮播效果动态展示以及页签内容切换效果；（2）wx.request(OBJECT)是用来发起的是HTTPS请求；（3）微
信小程序支持页面分享功能，可以把指定页面分享给好友或者群，需要使用onShareAppMessage函数，设置该页面的分享信息；
（4）wx.setStorage(OBJECT)将数据存储在本地缓存中指定的key中，会覆盖掉原来该key对应的内容，这是
一个异步接口；（5）wx.getStorage(OBJECT)从本地缓存中异步获取指定key对应的内容，这是一个异步的接口；（
6）input输入框组件，用来输入单行文本内容；微信小程序开发全案精讲第5章电影类：仿淘票票微信小程序5.3电影界面顶部页签
切换效果设计电影界面顶部页签切换效果设计微信小程序开发全案精讲第5章电影类：仿淘票票微信小程序5.4正在热映界面布局设计
正在热映界面布局设计微信小程序开发全案精讲第5章电影类：仿淘票票微信小程序5.5即将上映界面布局设计即将上映界面布局设计微
信小程序开发全案精讲第5章电影类：仿淘票票微信小程序5.6电影详情页设计电影详情页设计微信小程序开发全案精讲第5章电影
类：仿淘票票微信小程序5.7我的界面列表导航设计我的界面列表导航设计微信小程序开发全案精讲第5章电影类：仿淘票票微信小程序5
.8登录设计登录设计微信小程序开发全案精讲第5章电影类：仿淘票票微信小程序总结电影界面顶部页签切换效果设计正在热映界面布局设计即将上映界面布局设计电影详情页设计我的界面列表导航设计登录设计微信小程序开发全案精讲谢谢观看 |
|
