我在上一篇文章中提到了两个不错的实例,现在就给出第一个实例。DIY控件的步骤请看上一篇文章,地址:
老朽局的做界面和审美女大同小异,首先要观其相,看脸蛋是否水灵,看身板是否匀称,或者看看某些部位是否符合自己的喜好。因此在介绍本控件之前先上图,给大家看一个外观。 一、控件功能简单介绍 上图中最下面的一个控件就是本文要实现的,中间的文本部分是若干个文本控件文本的内容可以设置,并且文本控件的数量可以根据所设置的文本自动更改。提供了更改位置的方法,当用户从后台使用了此方法,本控件可以向上或者乡下滑动到指定的位置,到达指定位置之后,具有惯性反弹效果。当然也可以使用控件提供的方法屏蔽掉此效果,以便控件能够在很短的时间间隔内不停地更换位置。根据描述,可以归纳其功能需求如下:1.具备变更控件中文本内容的位置的功能,这是最基本的。2.可以根据需要灵活的增加或者屏蔽惯性反弹效果的特性。3.具备修改控件中文本内容和数量的功能。4.控件的大小应该随背景图的大小变化,屏幕中显示的第二条文本永远垂直居中。二、控件的实现 上图中看到的滚轮是由一个加了一个背景(黑色边框和白底的部分)和一个前景(中间的一条玻璃和上下各一条深色阴影)FrameLayout封装了滚轮控件所达到的效果。此图取自iphone的分层素材,再次申明!如果没有这些素材,本控件就表现为3行文字。 本控件继承自LinearLayout(layout1),为了使其中内容水平居中,在layout1中创建了一个水平的LinearLayout(layout2)。紧接着在layout2中创建了最核心的部分--滚动视图(ScrollView),我们看到的滚动效果就是有此控件实现的。由于滚动视图中只能放入一个子视图,我们只能在其中再创建一个layout,我这里实现垂直滚动,所以选择了垂直线性视图(layout3),如果有需要水平滚动的,就选择一个水平线性视图吧!然后在layout3中添加若干承载文本控件的线性视图(众多layout4),根据背景图的高度计算出每一个layout4的高度:H_background / layoutAmount,然后让layout4中的文本控件垂直居中且水平居中。这样做的好处是你不必关心文本控件之间的margin,就可以很方便的使各个文本控件都能位于控件中的合理位置,省去了后面控制滚动视图滚动距离的麻烦。 关于滚动视图,可能有很多人知道怎么让它滚动,但是滚动视图的滚动是没有惯性反弹效果的,在这里为其添加一个惯性反弹效果。反弹要用到Android的animation,也就是拉着画布抖动一下——先向一个方向拉一定距离,然后在向反方向拉回去,这样就OK了。如果要求比较高,也可以定义动画的加速度使其看起来更加逼真。由于时间关系,本控件未添加此效果,有兴趣的话可以修改源代码自己添加,不难,就是几行程序而已。三、控件移植 这里说到移植,很多搞过嵌入式系统的人,尤其是搞Linux的人也许会笑话我这种说法。姑且忍耐一下吧,Linux移植的事情我也搞过一年,自己也觉得不贴切,怎奈我苦于找不到一个动词来描述这一行为,纠结。 这里所说的移植就是将本代码讲过少许地调整,放到你的工程中,当作一个控件来使用。要经过如下几个步骤:1.在attrs.xml中定义几个属性,关于此文件的位置以及格式,详见:代码就不复制了,后面会给出整个工程,进去找就可以了。2.把源码包里的解释类src/com.Runner_Widget.Runner.java放入您的工程目录下,最好新建一个包:Widgets,专门存放你的个人控件。相应的,要修改解释类第一行的包路径修改成你自己的路径。3.在你的main.xml或者其他使用到此控件的描述文件中添加此控件,并定义好命名空间,之后再填入attrs.xml中定一个的各个属性的值,否则eclipse中的预览会出问题,甚至运行时会产生异常。添加方法还是参见我的第一篇文章:4.在你的Activity中使用findViewById找到此控件的实例,使用控件提供的方法为其设置属性,具体方法如下:int GetPos()--获得当前控件滚动到了那一个位置int GetItemAmount()--获得控件中有多少个文本控件,也就是有多少行void SetPos(int pos)--设置控件滚动的绝对位置void SetEnableGravity(boolean enable)--设置控件惯性反弹使能void SetArrayAdapter(String[] array)--设置控件中显示的文本和文本数量由于我在使用此控件时不显示滚动条,也不能通过触摸更改滚动位置,所以在代码中屏蔽掉了相关功能,如若需要,可以在解释类的CreateScrollViewContainer()方法中打开被注释的两行显示滚动条;注释掉解释类的子类ScrollContainer的public boolean onTouchEvent (MotionEvent ev) { return false; }就可以打开触摸滚动的功能。下面给出源代码: (437.39 KB, 下载次数: 221)