基于React Native的手工艺分享App设计与实现.docx

《基于React Native的手工艺分享App设计与实现.docx》由会员分享，可在线阅读，更多相关《基于React Native的手工艺分享App设计与实现.docx（44页珍藏版）》请在优知文库上搜索。

1、摘要本文设计的手工艺app主要是可供用户足不出户就可以在家进行线上学习手工艺制作的。可以有效地解决用户想学习却找不到学习的地方的这个问题。本软件的功能主要是用户学习为主。下面列出了该论文所需要完成的工作内容：具体介绍了该项目的背景和该项目在开发中所要使用到的相关技术；阐述了手工艺app的需求分析、功能设计、系统实现和调试以及运用到的一些技术。app使用ReaCtNative为框架，语言以及CSS来开发。ReactNatiVe可以用JaVaSCriPt也能编写原生移动应用。虽说这是一个跨平台的应用开发，但由于缺少条件，所以本文的项目主要是运行在安卓平台上的。同时ReaCtNative的版本非常地

2、多样，而本软件的ReactNative版本为0.50.1.在软件测试部份，本文对各个主要模块进行了功能性测试并且对总体进行了非功能性测试。关键词：手工艺ReaCtNativeJavaScriptCSSAbstractThehandicraftappdesignedinthispaperismainlyforuserstoIeamthehandicraftmakingonlineathomewithoutleavinghome.ltcaneffectivelysolvetheproblemthatuserswanttolearnbutcannotfindaplacetoleam.Themainf

3、unctionofthissoftwareisuserleaming.Thefollowingisalistoftheworktobecompletedinthispaper:specificallyintroducesthebackgroundofthisprojectandtherelatedtechnologiestobeusedinthedevelopmentofthisproject;describesthedemandanalysis,functiondesign,systemimplementationanddebuggingofthehandicraftappaswellass

4、ometechnologiestobeused.Appisdevelopedwithreactnativeasframework,languageandCSS.ReactnativecanwritenativemobileapplicationsaswellasJavaScriptAlthoughthisisacrossplatformapplicationdevelopment,butduetothelackofconditions,theprojectofthispaperismainlyrunningontheAndroidplatform.Atthesametime,theversio

5、nofreactnativeisverydiverse,andtheversionofreactnativeofthissoftwareis0.50.1.Inthesoftwaretestingpart,thispaperhascarriedoutfunctionaltestoneachmainmoduleandnonfunctionaltestonthewhole.Keywords:handicraftReactNativeJavaScriptCSS第一章绪论11.1. 选题背景和意义11.2. 国内外研究概括和发展趋势21.2.1 国内研究概括和发展趋势21.2.2 国外研究概括和发展趋势

6、21.3. .论文的主要工作31.4. 主要技术简介31.4.1 Android平台31.4.2 ReactNative框架31.4.3 JavaScript技术41.4.4 CSS技术41.4.5 Node51.5. 章、结5第二章系统分析62.1 系统功能分析62.1.1 登录功能62.1.2 首页62.1.3 抽屉页62.1.4 查看手工艺简介页面62.2 系统性能分析72.2.1 准确性和及时性72.2.2 易用性72.2.3 安全性72.3 可行性分析72.3.1 技术可行性72.3.2 操作可行性82.3.3 设计可行性82.3.4 经济可行性82.4 本章小结8第三章系统设计93

7、.1 系统层次模块93.2 系统流程93.3 数据流程图103.4 功能设计模块113.4.1 用户登录113.4.2 首页133.4.3 抽屉页153.4.4 手工艺简介页面163.4.5 手工艺教程页面183.5 本章小结21第四章系统测试224.1 测试环境224.2 功能测试224.3 非功能性测试234.4 用户界面测试244.5 测试总结25第五章总结与展望265.1 研究成果265.2 未来方向26参考文献28致谢30第一章绪论IJ.选题背景和意义随着科学与技术地不断发展，许多的手工艺品也可以在机器上进行大量地生产，这造成了物质的泛滥。单一、固定的产品已经不能满足人们的需要，人们

8、开始追求个性的、独一无二的手工艺品。不得不说，手工艺品在这个时代背景下出现了很大的机遇。传统的工匠不仅可以创造自己的平台特色，使用的工具还可以通过发表纪录片、文字、媒体。以前制作手工的艺术人不仅能够，把目标注意在很多流行的简短小视频或者直播（把百度百科的放上来直播的意思），通过这样的方式就能把，整个的制作流程呈现给大家。增强平台销售商品的信心，提高员工的曝光度，打造品牌。此外，传统工艺也可以通过融资等打开与知名品牌的合作渠道。例如，在东京和Skytrey,Starbox和日本传统的玻璃技术EdoCabOS,推出了一套限量咖啡饮料，吸引了消费者的注意。咖啡和伟大的技术的结合为每个发行方都有好处。

9、随着人们生活水平的不停进步，在满足了基本的物质生活需求后，需要一些额外的手艺或来满足自己的精神需求。一直以来，手工艺采用的都是手口相传的形式来进行学习或传授他人。但就目前的快节奏生活来看，人们要想快速地找到有经验的手工艺人来进行学习是比较困难的。同时也随着有经验的手工艺人逐渐高龄化，仅仅凭着口头相传无法增加手工艺传播的范围。也无法和现代人的生活习惯进行匹配。故借助这个平台，为这些想要进行手工艺学习的人们提供了一个学习的环境。目前，互联网的发展不仅给传统手工艺者的工作带来了新的发展，而且也让我们的信息流通变得越来越容易，如静乐剪纸、光影纸雕等。来自中国西安的静乐剪纸，和来自于美国的光影纸雕，但是

10、它们两者使用的制作材料是几乎一模一样的，制作方法也差不多一样。互联网信息链接让他们知道自己的位置。在静乐剪纸中运用光影雕刻，可以解决静乐剪纸受个体文化的影响和不太复杂的创意，也可以提高精致度。很明显，传统技术的融合带来了新的活力，互联网提供了一个很好的机会。1.2. 国内外研究概括和发展趋势1.2.1 国内研究概括和发展趋势现如今，人们在网络上进行学习已经是大势所趋，这都是因为互联网在近几年的不断发展壮大。我们也非常感谢互联网能够给予这个平台，让人们足不出户即可在家进行学习。互联网可以增加学习视频的传播性，从而让更多的人可以进行学习。许多传统的工匠利用网络信息的特性来建立一个个的专业的网站和A

11、PP学习平台。我们为了提高用户的兴趣以及更清晰地描述手工艺品的制作过程，同时也降低用户在学习过程中的难度可以在平台设计中可以添加到3D、VR等元素。我们为了让许多传统手工艺品的继承人与家庭继承人甚至男女继承人之间的差距可以缩小，从而为传统手工艺品的未来发展吸引新的工人，而使用了这种方法。现在，即使有各种各样的应用程序在建立中也遇到了许多困难。首先，传统工艺的创新太低、太慢，无法进一步激发用户的兴趣。如今，在信息爆炸的碎片化时代，没有持续创新的应用很快就会被大众忘记，因为对于用户来说这种新鲜感相对于高科技只是暂时的。如何维护好用户之间的关系才是一个大问题。其次，传统的地方工艺需要花费大量的时间和

12、经历许多复杂的过程，有时有几十个复杂的过程只是为了准备任务。第三，许多与传统工艺和应用程序制造过程相关的常识必须由一个由导师和工匠组成的特殊团队进行解释和传授。如何招聘专业人才，制作出质量有保障的教学视频，无疑是一个大问题。1.2. 2国外研究概括和发展趋势国外的市场竞争不如中国激烈。整个市场的发展潜力仍然巨大，潜在用户数量也很大。一些外国用户使用应用程序的可能性仍然相对较高。相互传播，广泛实施，将增加用户的关注度。国外应用程序的开发有自己的专门团队，专利名称也远多于中国。开发的应用程序功能强大，符合质量标准，用户体验自然就会良好。国外据我目前找到的资料显示，暂时还没发现有比较系统的手工艺学习

13、APP,但国外的手工学习网站挺齐全的。但国外的应用程序界面设计值得我们去借鉴和学习。不过随着时间的推进，在文明的推动下，国外工艺设计应用程序越来越多，大多以用户为中心，从用户的角度出发，按照人机技术的原理，交互设计也符合用户的应用习惯，具有很强的普及性；在视觉设计方面，色彩的使用相对平和，这在一定程度上防止了用户在长时间使用这款应用时感到紧张。1.3. 论文的主要工作该项目应用中的登录功能、查看教程、查看手工艺简介等功能的实现与设计都是由我独立完成的，并且我为了能够顺利地实现这些功能，我做了以下几点工作：(1)学习与这些功能模块相关的技术，查阅相关技术资料，并且和指导老师进行讨论，选择其中最适

14、合的技术和开发框架。(2)依照产品需要来对系统功用需求来实行剖析，对非功能需求进行设计，这样就能让软件愈加地契合用户的应用习性。(3)独立完成上面所列出来的功能，并对实现代码过程中遇到的问题列出解决方案，实现性能后再对模块实行测试。(4)在开发完成后，完成系统的功能性测试与非功能性测试。1.4. 主要技术简介本节主要介绍了软件实现时所用到的技术和平台。该项目尽管应用的是跨平台的移动应用开发框架，但具体实现时因为自身硬件的原因只有在Android平台上面测试过。所用的编程语言为JavaSCriPt,还有层叠样式表。1.4.1 Android平台Google公司开发的移动操作系统Android。A

15、ndroid是基于Linux内核以及其他开源软件。这款移动操作系统专为触摸屏移动设备设计比如智能手机和平板电脑等。此外，谷歌还进一步开发了用于电视机、汽车和手表的Android电视、AndrOid汽车和Wear操作系统，它们每一款都有独特的用户界面。1.4.2 ReactNative框架ReactNatiVe,是Facebook开发的一个多平台的移动应用开发框架，也被称之为RN。JS框架上的JS源代码，JS框架自诞生以来一直是支持IOS和Android一个开源的平台。ReaCtNatiVe开发移动应用程序使用的是JaVaSCriPt语言、JSHTML、CSS,所以，那些熟悉Web前端开发的人可以进入移动应用领域，没有太多需要学习的东西。而把ReactNative合并起来的是两个方式，一个是采用JS桥接，另一个是加NatiVe桥接。最终产品是一个从应用触感上很难与用Objective-C或Java编写的应用分辨开来的的真正的移动应用。ReactNative与原来的应用程序所使用的底层Ul组件几乎相同。你所要做的就是用JaVaSCriPt和React的形式对这些基本组件进行组合起来。当你在调试界面之时会十分的方便，更改代码之后保存，界面会自己跟着变化，这一点在调试的时候非常实用，但是有时速度有点慢，因此需要重置。1.1.1 JavaScript技术