英雄联盟壁纸网设计与实现.docx

《英雄联盟壁纸网设计与实现.docx》由会员分享，可在线阅读，更多相关《英雄联盟壁纸网设计与实现.docx（22页珍藏版）》请在第一文库网上搜索。

1、目录1作品概述12 .开发环境22.1 硬件环境22.2 软件环境22.3 工具软件22.4 产品架构23 .需求分析33.1 总体目标33.2 功能需求34 .系统设计44.1 系统详细设计44.2 数据库设计115 .功能实现136 .设计总结197 .参考文献201.作品概述在游戏电竞行业发展的时代，英雄联盟作为全球最受欢迎的游戏之一，在国内称第二可能没有端游敢称第一，在游戏中，每个人都有自己喜欢的英雄人物和皮肤，很多忠实的游戏玩家，会把自己喜欢的英雄或者皮肤，用作电脑或者手机桌面壁纸壁纸，但是很多人找不到喜欢的壁纸，或者找不到高清无水印的。英雄联盟壁纸网就是为了帮助那些有信仰的人，找不

2、到高清无水印的壁纸，或者没有自己喜欢的壁纸。本作品的设计非常人性化,主页壁纸展示非常的简洁,主页上展示的都是最新和热门的壁纸，比如英雄联盟某个英雄出了一款新的皮肤，大家都非常喜欢，在英雄联盟壁纸网站上面可以非常容易的找到这个皮肤壁纸，有精准的壁纸分类和搜索功能，一键直达，高效方便。2 .开发环境2.1 硬件环境处理器：InteI(R)Core(TM)i7-9750HCPU2.60GHz2.60GHz显卡：1660ti内存：24GB2.2 软件环境操作系统：WindC)WSIO专业版1909开发工具：HBuiIderX2.7.9浏览器：谷歌浏览器2.3 工具软件HBuiIderX,PS2.4 产

3、品架构B/S结构，即BrOWSer/Server(浏览器/服务器)结构，是随着Internet技术的兴起，对C/S结构的一种变化或者改进的结构。在这种结构下，用户界面完全通过WWW浏览器实现，一部分事务逻辑在前端实现，但是主要事务逻辑在服务器端实现。B/S结构，主要是利用了不断成熟的州呼浏览器技术，结合浏览器的多种SCriPt语言(VBSeript、JaVaSCriPt)和ACtiVeX技术，用通用浏览器就实现了原来需要复杂专用软件才能实现的强大功能，并节约了开发成本，是一种全新的软件系统构造技术。3 .需求分析3.1 总体目标为了英雄联盟的忠实信仰玩家，和自己对英雄联盟的热爱，做一个英雄联盟

4、玩家都喜欢的壁纸网站，每一张壁纸都有不同的感触，每一张壁纸都有不同的背景故事。不仅仅只是一个壁纸网站，每一张壁纸都是由一个故事演变而来。做一个高效的壁纸网站，一键直达。3.2 功能需求首先根据用户的体验度来确定，一个壁纸网站须拥有最热门，最新的壁纸，还有最全的壁纸，还有壁纸分类，壁纸搜索，能够使用户更方便的查找自己需要的壁纸；而让用户知道哪些壁纸比较受欢迎，则得有热门壁纸、热门英雄及热门皮肤；从网站首页就可以看到热门壁纸，最新的壁纸，随便一张壁纸都是可以下载的，且无限制下载，登录可以收藏自己喜欢的壁纸。另外用户可以直接的访问网站和注册,但用户必须登录之后才能收藏壁纸,所以网站得有登录和注册功能

5、。通过对用户需求的相关分析，该壁纸网站主要功能如下：1）首页、壁纸分类、壁纸分类、手绘壁纸、壁纸故事、魄罗壁纸。2）首页优先展示热门壁纸和最新壁纸。3）下载壁纸可以直接右键另存为，就可保存壁纸，非常的方便。4）登录注册功能。提供人性化的提示功能，在用户输入注册信息时给予相应的提示；在未注册情况下登录则提示用户用户名不存在，请先注册。4 .系统设计4.1 系统详细设计总体设计图（1）首页上中下4个部分设计，依次为导航栏，轮播，列表，底部。导航栏采用bootstrap4框架组件中的导航条（Navbar）设计，可以实现响应式导航栏，轮播采用bootstrap4框架组件中的轮播（CaroUSeI）,列

6、表采用4*n排列，简洁清晰明了，底部使用div包围p实现底部版权模块。导航栏1ogo导航条目卜叟索U登最轮播列表内容底部版权（2）壁纸分类整个页面分为5大块，依次为导航栏，轮播，分类列表，分类列表1,底部。导航栏采用bootstrap4框架组件中的导航条（NaVbar）设计，可以实现响应式导航栏，和主页的导航栏一致可以实现点击其他导航栏目，轮播采用bootstrap4框架组件中的轮播（CaroUSeI）,分类列表采用6列排列，分类列表1采用8*n排列，简洁清晰明了，底部使用div包围p实现底部版权模块。产航栏IOgo导航条目I卜叟索11登录轮播列表内容列表内容底部版权（3）手绘壁纸整个页面分为

7、5大块,依次为导航栏,轮播，内容列表,分页,底部。导航栏采用bootstrap4框架组件中的导航条（NaVbar）设计，可以实现响应式导航栏，和主页的导航栏一致可以实现点击其他导航栏目，轮播采用bootstrap4框架组件中的轮播（CaroUSe1）,分类列表采用6歹IJ排列，分类列表1采用4*n排列，简洁清晰明了，底部使用div包围p实现底部版权块。拿航栏IIQgOII导航条目I搜索I录I轮播列表内容分贞底部版权(4)壁纸故事整个页面分为3大块,依次为导航栏,轮播，内容列表,分页,底部。导航栏采用bootstrap4框架组件中的导航条(NaVbar)设计，可以实现响应式导航栏，和主页的导航栏

8、一致可以实现点击其他导航栏目，分类列表采用6列排列，分类列表1采用4*n排列，简洁清晰明了，底部使用div包围p实现底部版权块。号航栏IOgO11导航条目I1叟索11登录列表内容底部版权(5)魄罗壁纸整个页面分为4大块，依次为导航栏，内容列表，分页，底部。导航栏采用bootstrap4框架组件中的导航条(NaVbar)设计，可以实现响应式导航栏，和主页的导航栏一致可以实现点击其他导航栏目，简洁清晰明了，底部使用div包围p实现底部版权块。导航栏IOgo导航条目搜索登录列表内容分页底部版权(6)注册整个页面分为2大块，依次为导航栏，注册模块。导航栏采用bootstrap4框架组件中的导航条(Na

9、Vbar)设计，可以实现响应式导航栏，和主页的导航栏一致可以实现点击其他导航栏目。航栏IogoI登录I注册模块(7)登录整个页面分为2大块，依次为导航栏，注册模块。导航栏采用bootstrap4框架组件中的导航条(NaVbar)设计，可以实现响应式导航栏，和主页的导航栏一致可以实现点击其他导航栏目。甘航栏IIOgOI注册I登录模块4.2 数据库设计数据表Io1,字段id（用户ID）,username（用户名），password（密码），date（注册时间）字段名数据类型字段描述长度主键IdInt用户id6是UsernameVarchar用户名16PasswordVarchar密码18DateT

10、imestamp注册时间5 .功能实现1,1ogo设计采用左图标右边文本的形式，图标的设计，底部一个采用渐变色的圆形，顶层一个大写的1。右边的文本采用炫酷的字体，跟图标一样，采用相同的渐变配色，具体效果图如下。2,顶部导航栏的设计导航栏采用bootstrap4框架组件中的导航条（NaVbar）设计，具体导航栏项目有，1ogo,首页，壁纸分类，手绘壁纸，壁纸故事，魄罗壁纸，搜索，登录，具体效果如下图。,联盟壁纸首页壁纸分类手绘融疑型妣*FHK搜索125805期纸3,轮播的设计轮播采用bootstrap4框架组件中的轮播（CarOUSeI）,左右2边有切换轮播页的按钮,轮播底部有当前轮播页的标题，

11、标题下面有显示当前页的横杠。4,内容列表的设计内容列表采用bootstrap4布局中的网格系统（Gridsystem）,每行每列4个图片，可以实现响应式，根据窗口大小自动排版，上面有当前列表内容的标题。5,分页的设计分页设计采用bootstrap4组件中的分页(Pagination),左右2边是用于点击上一页和下一页的按钮，中间是显示当前页的数字，一共5和页面。上-页2345下一页6,卡片内容列表的设计整个卡片采用bootstrap4组件中的卡片，上面图片，小标题，简介，和下载壁纸的一个按钮。地狱火阿利斯塔“我的族人，早已被屠尽殆尽。我的希望，也将被屠灭一空。但是，我的仇恨，我的怨忿，一直在我

12、的内心里燃烧，在我的血液里沸腾！既然凡人不能给我复仇的力量，那我就与恶魔交易，用我不屈的灵魂来换取熊熊不息的地狱业火，采让另陛逝去的英魂们安息！以吾之意愿，换取无上法力！7,注册页面的设计整个页面的设计，左上角有网站1og。，右边有去登录的按钮，注册板块的表单有，账号和密码，一个用于发送请求的按钮。注册使ajax发送请求信息，后端使用PHP处理接收到的信息并处理，返回处理的结果8,登录页面的设计整个页面的设计，左上角有网站1og。，右边有去注册的按钮，登录板块的表单有，账号和密码，一个用于发送请求的按钮。注册使ajax发送请求信息，后端使用PHP处理接收到的信息并处理，返同处理的结果登录和注册

13、的核心代码操作指令$a=$_GETMaM;1是彘r是注册注册的账号Suser=GETusername;注册的期$pass=$GETpassword;注册的由褊$pass=$_GETemai1;/创建连隹Sconn=newmysq1i(Ioca1hosf,denghuiming,dhmnb.666,denghuiming);/检测连接if($conn-connect-error)die(连接失败：”.conn-connect-error);if(Q=1)$sq1=SE1ECTusername,passwordFROM1o1WHEREusername=Suser,j!resu1t=$conn-qu

14、ery($sq1);if($resu1t-num_rows0)/输出数据一whi1e(row=Sres1t-fetchassoc()echo”!8长号：.$rowusername.-密码：.$rowpassword.;if(Srow,password*)=Spass)echo”登录成功”；e1seecho”账号或密码错误I)e1seecho”账号不存在)e1seif($a=r,)if($user=$pass=,)echo”账号或者密码不能为空！Ie1se$sq1=INSERTINTO1o1(username,password)VA1UES(Juser,$PaSS)Iif($conn-query($sq1)=TRUE)echo”注册成功Ie1seecho”账号已存在“；/echo错误：.$sq1Sconn-error;)9,底部版权模块的设计底部的版权模块，是由div包裹的a标签，实现超链接跳转功能。上传壁纸I联系我们I服务条款和协议I隐私政策I加入我们I测试选项I英捱联盟62009-2019yx1mbz.co