虚拟仿真实验在教学中的应用

2022-10-27 02:41宝鸡文理学院电子电气工程学院海鹏博
内江科技 2022年9期
关键词:适配器控件视图

◇宝鸡文理学院电子电气工程学院 方 元 海鹏博

本文以设计一款网上购物客户端为例,借助Android系统为平台,使得学生更好掌握所学知识,首先采用RadioButton类和Fragment类来设计首页面和添加视图,从而实现五个页面的数据加载并且随意的切换;其次利用Intent类设计页面的跳转,来实现不同按钮的跳转功能。接下来再利用TabLayout类和Viewpager类来实现商品的展示和论坛功能,使得界面可以与导航栏一起滑动;再次利用ScrollView类和ListView类实现个人界面的设计,可以使图片与文字整体的滑动。利用GridView类实现美妆视频的显示,使用RadioPlayer类实现对视频的播放。最后短信的验证、地址的选择以及在线支付借助第三方框架实现,充分利用已存在的框架,实现该功能的使用,从而完成网上购物客户端的设计。经测试结果表明,网上购物客户端基本达到预期的效果,在手机上能够正常运行,为方便人们生活,对提高生活品质具有较好的实用价值。

1 概述

随着科技的不断进步与发展,安卓手机市场的发展速度也在不断地加快,各种购物资源也随之在不断地快速扩散,这些小小的资源看起来微不足道,但已经深深地融入到我们每个人的生活中。有了操作系统做基础,再加上支付宝,微信支付,银联等网络快捷支付,对于网上买东西已然成为年轻人的青睐,现在的网上购物,如淘宝、京东、天猫、唯品会等已成为人类不可或缺的一部分。

本设计以售卖护肤品为背景,设计了一款基于安卓系统的手机app[1-2]。本设计的完成主要是对安卓应用层的调用,其中涉及到安卓中四大组件,Intent意图的切换,fragment碎片的替换,以及第三方的一些框架,如注册时短信的接收,支付系统的实现等[4-6]。

2 网上购物客户端的设计

2.1 总体设计的方案

为了实现购物客户端的设计,根据设计流程图,主要完成注册与登录、首页、美妆教程、个人设置、讨论区和皮肤检测等功能。客户端实现后,当启动软件的时候,开始进入logo界面[7-8],然后从登录界面到主页面,再次进入到各个功能,其设计流程图如图1所示。

2.2 功能模块的设计

根据图1可知,本系统模块大体上分为6个模块,分别为注册与登录、首页、美女教程、我的脸、论坛和个人设置。每个页面上都有不同的信息提供给用户。在注册和登录中,用户可使用手机号码进行注册并登录。在首页模块中,展示推荐的产品及促销活动。在美妆教程模块中,主要展示一些美妆视频,给用户提供好的化妆教程。在我的脸模块中,可通过手机摄像头测试自身的皮肤性质,并提供关于皮肤缺陷的解决方案。在论坛模块中,为用户提供讨论区,方便用户相互学习交流,分享个人喜好品牌等。在个人设置模块中,完善个人资料,并可对一些数据进行保存。

图1 软件的流程图

(1)用户界面的设计。本设计采用src文件夹主要存放开发的源代码,gen文件主要存放代码中经常用到的R文件。R文件是在开发过程中,寻找其他控件或者其他资源的id表。assets文件夹主要存放一些需要播放的媒体文件,比如:很多软件打开都会有背景音乐,这个音乐文件的路径将存放在该文件下[9-10]。bin文件主要存放本项目的主要文件,比如在运行代码之后,就会自动生成对应的apk文件,该文件将保存在bin文件夹中[11-13]。Libs文件存放一些开发过程中经常使用的一些第三方jar包,这些jar包可以为本项目增加一些额外的功能,方便实现更多要求的功能[14]。res文件夹Drawable下存放着整个项目中所需要的图片资源,由于存在四种尺寸不同的文件,从而方便该项目代码可以适合不同设备不同屏幕的需求[15]。例如,手机和平板都可以使用,他不会因为屏幕的尺寸不同出现失真现象。res/layout文件夹存放xml文件,也就是布局文件;主界面的布局就是通过该文件里来实现的。

在安卓系统中,最常用的布局有五种,本设计用到的是线性布局(LinearLayout)和相对布局(RelativeLayout)。在该文件中的每个控件都需要定义一个唯一的ID,方便在代码中进行调用。下面是控件imageButton的内容:

android:id="@+id/exit"//定义一个唯一的ID

android:layout_width="wrap_content"//设置该控件的宽度为包裹

android:layout_height="wrap_content"//设置该控件的高度为包裹

android:layout_alignParentRight="true"/该控件相对于父控件的右侧对齐

android:layout_alignParentTop="true"/控件的上边缘和父控件的上边缘对齐

android:background="@drawable/close"//控件的背景图片路径

控件TextView可以设置文本内容:text="@string/title"、设置文本的尺寸:textSize="25sp"、设置文本的颜色:textColor="#11cd6e"等一些基本的属性。

通过控件imageButton的内容,布局好界面后,还不能显示在屏幕上,需要通过把这个文件下载到代码中进行运行。每个类都要去实现Activity这个类,首先要复写的就是onCreate这个方法,这也是程序的入口,每个Activity启动,都要先调用这个方法。

下面就是继承Activity类,程序入口代码如下所示。

Protected void onCreate(Bundle savedInstanceState)

{super.onCreate(savedInstanceState);

setContenView(R.layout.activity_main);

setContentView(R.layout.activity_main);

通过该段代码将activity_main.Xml文件加载到视图中显示出来。

本次设计中在整体框架上采用RadioGroup+Fragment的组合完成整体页面的搭建。

本软件下方具有5个按钮,所采用的控件是RadioGroup,分别实现首页、视频教程、我的脸、秀脸和我等按键。点击后会出现不同的View,展现不同的内容,用户界面的5个按键如图2所示。

(2)首页的实现。首页中通过ImageView实现上布局,中间采用RadioButton,下面采用ListView。其中,数据都是从服务器取得,加载到ImageView和ListView的适配器中,所采用的适配器是BaseAdapter。

ListView是一个具有setAdapter的方法,为ListView做适配,内容格式是每一条包含一段文字或者一个视图。

RadioButton的点击跳转不同的页面,实现不同的功能,主要代码如下:

case R.id.registration:

Intentsignintent=new Intent(this.getActivity(),SignActivity.class);

startActivity(signintent);

break;

如果采用switch和case语句来的实现该功能,可以使代码更简单明了。

(3)化妆教程的实现。化妆教程的界面采用Tablayout+Viewpager+ScrollView+GridView的控件实现页面的完成,把列表分成两列,可加载不同的视频。

其中,Tablayout添加标签,提示用户的分栏。Viewpager添加fragment实现不同的内容布局,一个Activity有两fragment,可加载不同的视图。

GridView中采用两列视图来显示数据。将网络上的数据加载到集合中,在适配器中加载到GridView中,从而可出现化妆教程的效果图。

(4)我的脸的实现。皮肤检测采用的是一个基本的GridView控件实现,数据是字符串,加载到适配器中,显示在视图上。

GridView中采用四列视图来显示数据。点击图标后,出现不同的内容,可对应不同的解决方案。

(5)论坛的实现。论坛的实现是采用Tablayout+Viewpager+ListView的组件来实现页面视图的加载功能。

Tablayout添加标签,分为四个Tab标签,给用户提供可以滑动的页面显示。

Viewpager添加fragment实现不同的内容布局,一个Activity有两个碎片,加载不同的视图。

用户可以选择在不同的标签下进行对产品的讨论和技术的交流。

当用户左右滑动时或者点击上方的标签时,可切换不同的内容。

(6)个人设置的实现。个人设置的界面采用ScrollView+ListView来达到目的,可以支持图片和列表同时上拉或下拉。

本页面的列表为了简单起见,采用SimpleAdpter适配器,如果需要实现一个数据显示在Activity上,需要三个步骤:①获取网络数据;②建立适配器(ArrayAdapter/SimpleAdapter/自定义BaseAdatpter);③加载适配器到listview中(listview.setAdapter())。

按照这三步骤,可把适配器中的视图一一显示在ListView的控件中。

3 功能测试

3.1 软件测试的环境

一般程序运行环境有两种,一种是运行在eclipse软件上自带的手机模拟器上,还有一种就是直接运行在安卓手机系统上。第一种方案,需要打开eclipse软件,在该项目的文件上右击找到“Run As”下的“Android Application”运行该程序。

选择Sony-l39t该手机驱动,点击ok,稍等之后,该程序在手机上运行,就可以手动进行测试了。这种方式可以把代码运行在手机上,视图将会加载出来,可以非常直接的观察是否有bug。

第二种方案,在测试时需要用到adb命令。adb命令运用在Linux中,由于手机底层就是Linux,因此可以利用adb命令来实现软件测试,配置adb系统环境后,命令如图3所示。

这种测试称之为压力测试,通过测试程序会不会出现崩溃,来看出程序是否稳固。

3.2 测试的结果与分析

根据测试好的程序,应用于android系统中,首先实现了注册和登陆界面如图4所示。

图4 注册和登录界面

图中注册时需要手机号码,输入后手机会收到一条验证码短信,其次设置密码进行输入,等到全部输入完成,如果信息都正确,那么会跳转到登陆页面中。

登陆页面中需要用户的手机号以及注册时的密码,输入栏的右边分别是清空手机号和显示当前密码。最下方是登陆按钮,如果账户与密码匹配,就会跳转到首页部分。

当登录成功后,视图都显示出来,各模块功能同时能够实现,如秒杀界面,商品详情界面等。美妆教程的页面中提供给用户视频教程,可以随意点开视频进行播放。‘我的脸’页面可以检测自己皮肤的状态并可根据提示方案进行及时的调整护肤方法。论坛页面中为用户提供了可以相互讨论的区域,方便大家相互的技术交流,从而更快地了解到这款APP中所有商品的特点。个人设置的页面中展现的是个人的资料,可以进行修改并且记录历史。Adb命令测试如图5所示。

图5 adb命令测试界面

根据图5可知,Adb命令测试顺利完成,表明该设计没有错误信息,该款app软件能够在手机上顺畅的运行。

4 结束语

本文借助Android系统为平台,在教学过程中,采用Java语言,通过linux程序代码,使用不同的布局方法设计出一款网上购物客户端APP,设计出的APP各项指标均符合要求。在设计首页面时,采用了RadioButton类和ViewPager类来实现,该类是通过左右滑动和点击下方按钮来进行不同页面的切换,再用ViewPager与Fragment结合使用,完成首页面的搭建;其次利用TabLayout类和Viewpager类来实现商品的展示和论坛功能,使得界面可以与导航栏一起滑动,页面的跳转即采用Intent类实现;综合各个界面结果可知,运用Android系统的工具进行设计时,采用了不同的工具来设计,不仅可以实现不同的界面效果,而且增加设计整体的效果。设计方法简单,便携直观。最后短信方式验证、地址的选择以及在线支付借助第三方框架实现,充分利用已存在的框架,实现该功能的使用,从而完成网上购物客户端的设计。从本文的设计结果可以看出,教学成果明显,学生学习积极性高,更好的将所学知识转化为实际应用,从而提高了教学质量。

猜你喜欢
适配器控件视图
基于C++Builder 的电子邮件接收程序设计*
使用“填表单”微信小程序 统计信息很方便
基于.net的用户定义验证控件的应用分析
基于3D打印的轻型导弹适配器
Y—20重型运输机多视图
SA2型76毫米车载高炮多视图
《投影与视图》单元测试题
电源适配器怎么选
Django 框架中通用类视图的用法
6款电力线网络适配器横向评测