一、实验目的与内容:
目的:掌握安卓中活动的编写、自定义用户界面的开发、碎片开发、广播机制以及数据持久化技术等;并能通过对课堂知识进行扩展来完善该界面,并使界面尽量美观。
内容要求:
请尽量模拟如下深大校园主页的功能,参考:
具体要求:
①该实现的界面在某些地方应体现出如下功能:
a. 界面能对平板与手机平台进行自适应(参考第4章碎片);
b. 能对用户身份有强制下线的功能,比如网络中断,登录界面强行退出并显示提示错误的界面;
c. 界面某些地方体现数据持久化的技术,如文件数据的读取、存储的多种实现方式,并简单阐述几种实现方式具体的适用场景;
d. 界面要比较工整,没必要实现参考界面上的所有子项,能保证自己的界面实现能有扩展到参考界面的能力即可。
②功能并不局限于上面的要求,可以根据自己的理解设计一些新的功能,并在报告文档中进行详细的阐述,作为报告的亮点;
③APP的布局尽快模仿参考界面,如果有较大的困难,可以只实现出右半边部分的界面,并尽量按上面要求进行完善;
④对于某一种功能,可以在不同的子项处采用多种实现方式,并比较这些实现方式的不同及优劣势。
参考:尽量多的应用参考书《第一行代码 Android》第二版第2章活动、第3章UI开发第4章碎片、第5章广播机制与第6章数据持久化技术的各个知识点。
注意:
实验报告中需要有功能的描述、实验结果的截屏图像及详细说明;
也欢迎采用其它章节的知识点完成本次实验报告,如果实现的功能言之合理,会考虑酌情加分。
二、实验过程和代码与结果
项目亮点:
①通过数据库实现了登录效果
②页面更贴近实际校园类APP,页面更简洁
③采用动态绘制以适应不同横宽比的设备
④按钮区分各个功能,使进入各个功能更方便
⑤采用listview进行布局各条数据,不将各个数据写死,方便真正投入实用
⑥将每个Adapter和对应的类区分成不同的目录,方便查找
1.“我的校园”APP的构建过程及结果
我将主要分为以下三个方面进行介绍:主页面,登录界面,成绩查询。
①主页面
布局分析:
主页面应该是一个垂直方向的LinearLayout:
(1)显示校园图片的banner:
Banner采用轮播进行布局,先布局好所有的child,每个child都充满整个屏幕,然后拦截touch事件,根据手指滑动的距离调用scrollBy()来滚动,当手指停下的时候计算下个要到达第几个child的意图,根据Scroller和回调函数computeScroll()函数来完成接下来的滚动,这个只是child的滚动,我们看到下面还有四个小圆点,这个我叫做指示器,指示当前到了哪个图片,因为它不用响应事件,完全可以画出来,所以我重写了ViewGroup的draw()方法,在super.draw()之后绘制指示器,计算坐标。注意:重绘的时候需要调用setWillNotDraw(false)这个方法,否则将失效。
(2)一个GridLayout布局
中间的八个功能按钮使用GridLayout完成布局。
(3)一个ListView用来显示新闻
此处定义了一个ListView来进行展示对应的新闻,由于这些数据在实际应用中都来自学校服务器,故应采用一个model来完成数据的交互。
使用ListView时需要一个adapter,此处我自定义了一个adapter。 其中,每一条新闻的布局也是通过xml直接堆叠出来。
(4)底部菜单栏
分析得知,整个菜单栏是一个RelativeLayout,然后里面嵌套一个水平方向的LinearLayout,每一个菜单都是一个垂直方向的LinearLayout。
从上图中可以看到,中间的菜单比其他的菜单要往上面突起一点,也就说超过了父容器LinearLayout的高度,这个属性可以在最外层的RelativeLayout中设置一个属性android:clipChildren属性,否则子child是不能超出父容器的。
此外,要将突出的中间的菜单变为圆角,需要使用shape完成这个操作。
(5)顶部ActionBar
我这里使用了ActionBar,对于默认的ActionBar,要加一个右上角的用户头像,关于左上角的文字直接调用Activity的setTitle()就可以更改了,先加右上角的头像,然后重写Activity的一个回调函数,这样就能创建右上角的用户头像。
②登录界面
点击右上角头像,即可滑出登录界面,此处有一侧滑菜单
(1)侧滑菜单的实现
若要加入侧滑菜单,则要先编写侧滑出菜单的布局。
要实现这种侧滑效果,首先自定义一个滑动Layout继承自RelativeLayout,里面有两个View分别是用来存放内容和菜单布局的,然后记录手指一动的距离更改内容View的leftMargin(注意:只有leftMargin的值是负数才能够向左偏移,如果是正数的话那么会向右压缩),在内容View移动的同时,调用菜单的setTranslateX()方法就可以达到菜单移动了。
实现菜单侧滑的几个主要函数
/** * 切换菜单的显示和隐藏 */ public void switchMenu() { if( mLeftParams.leftMargin == 0) { showMenu(); } else { hideMenu(); } } /** * 显示菜单 */ public void showMenu() { new SmoothScrollTack().execute(-mLeftEdge, mLeftParams.leftMargin); } /** * 隐藏菜单 */ public void hideMenu() { new SmoothScrollTack().execute(0, mLeftParams.leftMargin); }
(2)登录的实现
此处的登录借助了数据库SQLite进行登录数据验证,获取从文本框输入的字符之后,将获取的用户名与密码与数据库进行比对,并返回结果。