关于【积分获取】的说明关于【附件下载】的说明
楼主: admin

【微信小程序开发教程】电影影评小程序

[复制链接]

0

主题

6

帖子

16

积分

新手上路

Rank: 1

积分
16
发表于 2018-8-1 16:51:24 | 显示全部楼层
回复

使用道具 举报

0

主题

2

帖子

7

积分

新手上路

Rank: 1

积分
7
发表于 2018-8-13 09:32:58 | 显示全部楼层
试试撒奥所撒奥所撒
回复

使用道具 举报

0

主题

1

帖子

6

积分

新手上路

Rank: 1

积分
6
发表于 2018-8-14 16:30:24 | 显示全部楼层
感谢楼主
回复

使用道具 举报

0

主题

1

帖子

6

积分

新手上路

Rank: 1

积分
6
发表于 2018-8-20 15:44:17 | 显示全部楼层
好好好     源码下载
回复

使用道具 举报

0

主题

3

帖子

8

积分

新手上路

Rank: 1

积分
8
发表于 2018-8-23 18:23:08 | 显示全部楼层
收藏收藏
回复

使用道具 举报

0

主题

12

帖子

23

积分

新手上路

Rank: 1

积分
23
发表于 2018-8-28 11:13:18 | 显示全部楼层
来看看!!!!
回复

使用道具 举报

0

主题

1

帖子

6

积分

新手上路

Rank: 1

积分
6
发表于 2018-8-30 16:03:55 | 显示全部楼层
学习学习
回复

使用道具 举报

0

主题

3

帖子

8

积分

新手上路

Rank: 1

积分
8
发表于 2018-8-31 12:36:04 | 显示全部楼层
微信小程序电影影评小程序开发步骤: 这是博主的项目包含的文件截图:  首先如图建立文件夹和page页面 然后app.json页面更新代码如下: {  "pages": [    "pages/hotPage/hotPage",    "pages/comingSoon/comingSoon",    "pages/search/search",    "pages/more/more"  ],  "window": {    "backgroundTextStyle": "light",    "navigationBarBackgroundColor": "#fff",    "navigationBarTitleText": "WeChat",    "navigationBarTextStyle": "black"  },  "tabBar": {    "list": [{      "pagePath": "pages/hotPage/hotPage",      "text": "本地热映"    },{      "pagePath": "pages/comingSoon/comingSoon",      "text": "即将上映"    },{      "pagePath": "pages/search/search",      "text": "影片搜索"    }]  }}   然后是app.wxss页面(为后面的页面样式写的): /**app.wxss**/.container {  height: 100%;  display: flex;  flex-direction: column;  align-items: center;  justify-content: space-between;  padding: 200rpx 0;  box-sizing: border-box;} /* hotPage.wxss */.movies{  display:flex;}.myimage{  flex: 1;}.moveInfo{  flex: 2;}.yanyuanlist{  display:flex;}.left{  flex:1;}.right{  flex:2;}     页面显示如图:    然后是hotPage.wxml页面: 名称:{{item.title}}导演:{{item.directors["0"].name}}演员:{{item.name}}分类:{{item.genres}}上映时间:{{item.year}}   然后是hotPage.js页面: var that;var page = 0;// more.jsPage({  /**   * 页面的初始数据   */  data: {    movies: []  },  /**   * 生命周期函数--监听页面加载   */  onLoad: function (options) {    that = this;    that.linkNet(0);  },  jumpTomore: function (e) {    console.log(e.currentTarget.id);    wx.navigateTo({      url: '/pages/more/more?id=' + e.currentTarget.id,    })  },  linkNet: function (page) {    wx.request({      header: {        "Content-Type": "json"      },      url: 'https://api.douban.com/v2/movie/in_theaters',      data: {        start: 10 * page,        count: 10,        city: '成都'      },      success: function (e) {        console.log(e);        if (e.data.subjects.length == 0) {          wx.showToast({            title: '没有更多数据',          })        } else {          that.setData({            movies: that.data.movies.concat(e.data.subjects)          })        }      }    })  },  onReachBottom: function () {    that.linkNet(++page);  }})   运行程序结果如图:   然后是hotPage.wxss: image{  width:350rpx;  height:280rpx;}   接着是第二个页面的布局和第一个页面一样,所以直接把第一个页面hotPage.wxml代码copy过来就好了; 同样comingSoon.js代码和hotPage.js代码也差不多,唯一需要改动的地方只有一个:      url和data改一下就好了  .wxss代码一致; 运行结果如下:   接着是第三个页面的代码:  search.wxml页面代码: 搜索名称:{{item.title}}导演:{{item.directors["0"].name}}演员:{{item.name}}分类:{{item.genres}}上映时间:{{item.year}}   search.js页面代码:  var input;var that;// search.jsPage({  /**   * 页面的初始数据   */  data: {    movies: []  },  /**   * 生命周期函数--监听页面加载   */  onLoad: function (options) {    that = this;  },  myInput: function (e) {    input = e.detail.value;  },  mySearch: function () {    wx.request({      header: {        "Content-Type": "json"      },      url: 'https://api.douban.com/v2/movie/search?q=' + input,      success: function (e) {        that.setData({          movies: e.data.subjects        })      }    })  }})   search.wxss代码同hotPage.wxss代码一致;  运行代码结果如下:   最后是详情页面,点击影片后会跳转到详情页面获得影片的详细信息:  more.wxml页面代码: 名字:{{title}}导演:{{director}}主演:{{item.name}}年份:{{year}}评分:{{rate}}介绍:{{summary}}   more.js代码: var that;// more.jsPage({  /**   * 页面的初始数据   */  data: {    title: 0,    imageUrl: 0,    director: 0,    casts: [],    year: 0,    rate: 0,    summary: 0  },  /**   * 生命周期函数--监听页面加载   */  onLoad: function (options) {    that = this;    wx.request({      header: {        "Content-Type": "json"      },      url: 'https://api.douban.com/v2/movie/subject/' + options.id,      success: function (e) {        console.log(e)        that.setData({          title: e.data.original_title,          imageUrl: e.data.images.large,          director: e.data.directors["0"].name,          casts: e.data.casts,          year: e.data.year,          rate: e.data.rating.average,          summary: e.data.summary        })      }    })  }})   运行代码结果如下:   好了、全部代码如上都给出了..加油
回复

使用道具 举报

0

主题

9

帖子

30

积分

新手上路

Rank: 1

积分
30
发表于 2018-9-2 16:08:17 | 显示全部楼层
谢谢,很感谢
回复

使用道具 举报

0

主题

9

帖子

30

积分

新手上路

Rank: 1

积分
30
发表于 2018-9-2 16:13:06 | 显示全部楼层
henhaoa 很好啊
回复

使用道具 举报

本版积分规则

关闭

站长推荐上一条 /1 下一条

QQ|Archiver|手机版|小黑屋|小程序大全|小程序开发者论坛-汇集最优质源码、开发者教程、小程序资源

GMT+8, 2018-11-19 11:57 , Processed in 0.175698 second(s), 10 queries , File On.

Powered by Discuz! X3.3

© 2001-2017 Comsenz Inc.

快速回复 返回顶部 返回列表