前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >四、一般页面制作《仿淘票票系统前后端完全制作(除支付外)》

四、一般页面制作《仿淘票票系统前后端完全制作(除支付外)》

作者头像
1_bit
发布2022-05-28 09:49:35
6620
发布2022-05-28 09:49:35
举报
文章被收录于专栏:我的知识小屋

一、播放影片影院页制作

上一节已经做完了首页所有栏目内容,那么点击购票后应该出现对应有购票的影院,选择影院后进入购买票务页。

首先新建一个页面命名为播放该影片的影院:

在这里插入图片描述
在这里插入图片描述

接着复制首页中的标题栏到播放影片的影院页中,此时需要删除右侧行内容:

在这里插入图片描述
在这里插入图片描述

接着更改 logo 部分的背景色为透明:

在这里插入图片描述
在这里插入图片描述

接着在 logo 中添加一个文本,为朝向左的箭头:

在这里插入图片描述
在这里插入图片描述

这个箭头用于返回上一层,此时由于该logo 部分有具体大小值,需要更改高度为包裹:

在这里插入图片描述
在这里插入图片描述

重命名这个行为返回:

在这里插入图片描述
在这里插入图片描述

接着给这个文本创建一个事件,调用前台返回上一层:

在这里插入图片描述
在这里插入图片描述

此时进入页面后,点击返回文本可以回退到刚刚所访问的上一页内容。

接着直接复制影院页的内容到当前页即可:

在这里插入图片描述
在这里插入图片描述

此时还需要删除其中的广告图片。

二、影院拥有的影片显示

影院拥有的影片显示页制作也很简单,直接复制 播放影片的影院页 重命名为 影院拥有的影片显示页:

在这里插入图片描述
在这里插入图片描述

接着删除影院原本拥有的内容:

在这里插入图片描述
在这里插入图片描述

复制首页首页栏中的热映内容到 影院拥有的影片显示页 中:

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

三、管理员页

接着制作管理员页内。

首先创建一个页面,命名为 管理员首页:

在这里插入图片描述
在这里插入图片描述

接着复制 影院拥有的影片显示页 中的标题提到管理员页:

在这里插入图片描述
在这里插入图片描述

接着删除下拉选项,将下拉选项删除,添加文本,内容为当前页面标题,命名为 管理员首页:

在这里插入图片描述
在这里插入图片描述

随后再到首页我的登录后要显示的内容与反馈复制过来:

在这里插入图片描述
在这里插入图片描述

删除复制过来的管理员入口,在此处没有必要了,因为已经进入到管理员页了:

在这里插入图片描述
在这里插入图片描述

接下来更改对应的背景色:

在这里插入图片描述
在这里插入图片描述

再重复的去复制内容就可以,然后更改其文本:

在这里插入图片描述
在这里插入图片描述

三、影院增加页

接着创建一个页,命名为影院增加页:

在这里插入图片描述
在这里插入图片描述

赋值管理员首页的标题到影院增加页:

在这里插入图片描述
在这里插入图片描述

接着更改对应的文本内容为 影院增加页,这个页面主要用于增加影院信息:

在这里插入图片描述
在这里插入图片描述

接着复制管理员页中的帮助与反馈行,赋值到影院增加页:

在这里插入图片描述
在这里插入图片描述

接着重命名这个复制过来的帮助与反馈(记得删除内部内容)为增加信息:

在这里插入图片描述
在这里插入图片描述

随后创建一个行命名为内容,内部为一个输入框:

在这里插入图片描述
在这里插入图片描述

内容行依旧需要设置内边距,并且高度为包裹;随后创建多个行内容:

在这里插入图片描述
在这里插入图片描述

在此需要注意,有一个行为标签,该行是为了给当前影院增加对应的标签信息,例如是否有vip厅、是否赠送零食、以及一些其他配置标签。

这些标签的添加只需要在标签输入框中输入文本,点击添加即可在标签区域显示;此时我们可以添加一个一维数组,命名为标签:

在这里插入图片描述
在这里插入图片描述

随后给予确认按钮事件,点击按钮后添加输入的标签信息到标签数组中,之后再直接循环标签信息即可。

此时给予按钮事件:

在这里插入图片描述
在这里插入图片描述

此时我们发现,在事件中,我还判断了要添加的标签文本内容字符数是否为0,如果是为0 则表示没有输入内容,就不会进入到添加内容中;接着若内容大于0,则表示有内容,进入到条件中,直接给予标签一维数组添加值为输入框的值即可,当然最后还还要清空对应的输入框标签内容,否则体验感就不是很好。

此时我们已经添加了对应的标签信息到一维数组,那如何使标签信息显示呢?我们需要一个for循环,直接给显示的标签信息放到for循环中,指定 for 循环的数据来源为标签的循环数组即可:

在这里插入图片描述
在这里插入图片描述

接着再给文本要显示的内容绑定为当前数据1即可:

在这里插入图片描述
在这里插入图片描述

那么此时我们查看预览,输入内容后即可添加信息到标签进行显示。

接下来添加一个按钮即可完成剩下操作:

在这里插入图片描述
在这里插入图片描述

剩下的页面内容相似,不再赘述,其页面如下.

影院删除页:

在这里插入图片描述
在这里插入图片描述

影片增加页:

在这里插入图片描述
在这里插入图片描述

影片删除页:

在这里插入图片描述
在这里插入图片描述
本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2022-05-27,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 一、播放影片影院页制作
  • 二、影院拥有的影片显示
  • 三、管理员页
  • 三、影院增加页
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档