微信小程序实现电影App导航和轮播
作者：Би Чинранд хайртай 发布时间：2024-04-18 09:49:32
标签：微信小程序,导航,轮播
本文实例为大家分享了微信小程序实现电影App导航和轮播的具体代码，供大家参考，具体内容如下
最终的目的：
底部：我们要搞好这样的底部要在app.json填写tabBar
在pages下面填写tabBar
"tabBar": {
"color": "#dddddd",//默然的颜色
"selectedColor": "#3cc51f",//被点击后更改的颜色
"borderStyle": "black",
"backgroundColor": "#2B2B2B",
"list": [{
"pagePath": "pages/movie/movie",
"iconPath": "/pages/assets/img/dy-1.png",//默认情况下的图标
"selectedIconPath": "/pages/assets/img/dy.png",//它被点击后的图标
"text": "影院热映"
}, {
"pagePath": "pages/movie/movie",
"iconPath": "/pages/assets/img/tj-1.png",
"selectedIconPath": "/pages/assets/img/tj.png",
"text": "电影推荐"
},{
"pagePath": "pages/movie/movie",
"iconPath": "/pages/assets/img/search-1.png",
"selectedIconPath": "/pages/assets/img/search.png",
"text": "查询电影"
}
]
},
轮播图：创建一个movie.wxml前端。
前端代码
<view class="content">
<swiper indicator-dots="{{indicatorDots}}"
autoplay="{{autoplay}}" interval="{{interval}}" duration="{{duration}}">
<block wx:for="{{imgUrls}}">
<swiper-item>
<image src="{{item}}" class="slide-image" style="width:100％"/>
</swiper-item>
</block>
</swiper>
</view>
创建一个movie.js。
data: {
//text:"这是一个页面"
imgUrls:[
'/pages/assets/img/001.jpg',
'/pages/assets/img/002.jpg',
'/pages/assets/img/003.jpg'
],
indicatorDots:true,//是否显示面板指示点
autoplay:true,//是否自动切换
interval:3000,//自动切换时间间隔
duration:1000,//滑动动画时长
},
来源：https://blog.csdn.net/jiangqingzhihe/article/details/110350364
0
投稿猜你喜欢
foreignkey是一种关联字段，将两张表进行关联的方式，我们在dodels.py里写入要生成的两张表：class Usergroup(m- 本文实例讲述了Python使用re模块正则提取字符串中括号内的内容操作。分享给大家供大家参考，具体如下：直接上代码吧：# -*- codin
- Google中秋的logo出来了，酷似一美男站在月亮上，结果被网友弄出一撒尿版来。中国网民好智慧啊～原logo： 撒尿版logo：
- 导语幼儿园升小学，小学升中学，中学升高中..........每个人都要经历的九年义务教育：伴随的都是作业、随堂考、以及每个科目的大大小小的考
- 目录1、方式一：自动创建2、方式二：纯手动创建3、方式三：半自动创建1、方式一：自动创建# django orm 自动帮我们创建第三张表，我
- 一，命名空间函数 tf.variable_scope tf.name_scope 先以下面的代码说明两者的区别# 命名空间管理函数'
- python除了关键字（keywords）和内置的类型和函数（builtins）,更多的功能是通过libraries（即modules）来提
- word中对于英文单词的统计也很好，大家不妨试试。如果没有安装word，而且你也是程序员的话，那么可以使用我的这段代码。通过测试，word的
- 一、异常错误 a、语法错误错误一：if错误二：def text: &n
- 在进行数据科学任务时，一般会用到交互式开发环境，即Jupyter Notebook，Jupyter lab是Jupyter Notebook
- 前言：什么是anaconda？？Anaconda指的是一个开源的Python发行版本，其包含了conda、Python等180多个科学包及其
- $也能匹配\n见Perl语言入门，page 132, 注释61 /^.*$/能匹配"\n"么？能！因为$不仅能匹配行尾，
- 一、遇到的问题在向数据库中存入汉字时遇到这样的问题：Cause: java.sql.SQLException: Incorrect stri
- 异常异常处理…允许错误处理在程序结构的中心或者高层级的地方被清晰有条理的组织起来。Exceptions… allow error handl
- 用DIV+CSS可以作出很多不同形状的角形；以下我只写了几个；CSS没有优化；是为了让大家看得更清一些；以下是一些小三角的形状：这是第一个小
- 本文实例讲述了python处理xml文件的方法。分享给大家供大家参考，具体如下：前一段时间因为工作的需要，学习了一点用Python处理xml
- 初学Python，这个问题搞了我好久，现在来分享下我的解决思路，希望可以帮到大家。先说下python引入模块的顺序：首先现在当前文件夹下查找
- 便携文档格式 (PDF) 是由 Adobe 开发的格式，主要用于呈现可打印的文档，其中包含有 pixel-perfect 格式，嵌入字体以及
- 最近在研究WEB布局，遇到<H1>标签了，<H1>标签很重要。在一般教程中都这么说，<H1>标签在同一页
- 这是base2的作者Dean Edwards 2007年3月份的一篇文章。最近正在折腾JavaScript库，感觉Dean给出的这些规则很中
