微信小程序----一个简单的电影小程序

index.php/tags-41973.html" >���终界面：

 

电影小程序

首先一共有这些包

 

app.jion中代码：

{  "pages": [    "pages/index/index",    "pages/logs/logs",    "pages/geren/geren",    "pages/xqy/xqy"  ],  "window": {    "backgroundTextStyle": "light",    "navigationBarBackgroundColor": "#fff",    "navigationBarTitleText": "Weixin",    "navigationBarTextStyle": "black"  },  "tabBar": {    "color": "#999999",    "selectedColor": "#f00000",    "backgroundColor": "#efefef",    "borderStyle": "black",    "position": "bottom",    "list": [      {        "pagePath": "pages/index/index",        "text": "首页",        "iconPath": "pages/images/shouye.png",        "selectedIconPath": "pages/images/shouye_selected.png"      },      {        "pagePath": "pages/geren/geren",        "text": "个人",        "iconPath": "pages/images/wode.png",        "selectedIconPath": "pages/images/wode_selected.png"      }    ]  },  "style": "v2",  "sitemapLocation": "sitemap.json"}

第二步：我们来写第一个界面index

index.json

{  "usingComponents": {},  "navigationBarTitleText": "小栋电影"}

它实现的是

 

 index.wxml

这段代码展示了一个电影推荐的小程序页面。页面上有一个顶部的搜索框，可以搜索电影；接下来是一个轮播图展示电影宣传图；然后是三个横向滚动展示电影的区域，每个区域都有电影海报和电影评分等信息；最后是三个横向滚动展示电视剧的区域，同样包括电视剧海报和电视剧评分等信息。