他山之石之使用SlidingMenu实现侧滑的效果

来源:互联网 发布:万汇电商淘宝代运营 编辑:程序博客网 时间:2024/05/01 17:31

用开源框架SlidingMenu实现侧滑效:

从OOP的思想来看,SlidingMenu也是对象,我们首先要完成对该对象的创建,然后去利用该对象完成必要的业务逻辑。创建SlidingMenu的方式和AlertDialog的方式一样,都是通过用一连串的setXXX方法来完成对象的创建工作.下面我们用两种方式来展示实现侧滑菜单的这一效果:

第一种 直接在Activity中创建对象并显示出来,因为SlidingMenu直接继承于RelativeLayout视图,示例代码如下:


完成了SlidingMenu对象的创建后,显示出来就显得容易多了。下面是侧滑的下过图示,下面逐一分析每个setXXX方法具体指的是该对象的哪部分属性。

     上面是侧滑后的效果图,从前面的代码图示中,第25行创建slidingMenu对象,要指出是在具体的上下文环境,也就是活动(界面)环境。第27行的set方法设定滑动的模式,本例是从LEFT开始往右边滑动,还有两种方式可选,RIGHT和LEFT_RIGHT。第29行的set方法设定触发滑动的模式,本例为全屏触发,还有TOUCHMODE_MARGIN边缘触发(在屏幕的边缘处触发滑动)等,这两种较常用。34、35行两个分别带有Shadow的set方法肯定是与滑动过程中的阴影有关,我暂时断章取义的解释成阴影,这两个set方法其实就是针对在上图中蒋欣和安卓小机器人右边的那个很窄的长条状图样,它就是滑动过程中的Shadow,在这里其实也是一个美女图片,只不过被横向压缩了。第一个Shadow设定是该图样的宽度,都二个Shadow是设定该图样的背景图片,是不是很直观。第40行的set方法(setBehindOffsetRes)设置的效果是滑动菜单滑动完成后,原来页面"剩余"宽度,即上图样中长条的图片到屏幕右侧的宽度,此外,还有一个方法需要注意,(setBehindWidthRes),这两个方法很像,但是他们的业务逻辑刚好相反,不可以同时setting,否则会报错,不信你去看这个开源框架的作者给出的提示NOTE。setBehindWidthRes方法是滑动菜单完成滑动后"覆盖"原来的页面的宽度,就是菜单OPEN展开后的宽度,就是上图样中蒋欣美女和安卓机器人那个视图的宽度。很显然,上面两个带有Behind的set方法的刚好是争锋相对的,如果你想报出一大片的红色区域的话,试一试吧,通常我们只需要选择其中之一即可。第45行中的set方法设定是滑动过程中的渐入渐出效果,上面解释的很清楚了。第47行是关联当前的活动界面,在其中显示出来,这也没啥可说的。第50行是设定所需要展示的菜单视图,即上图中蒋欣和安卓机器人这个View。那么SlidingMenu这对象就创建完成了。这是在Activity界面中展示出来的侧滑菜单。下面介绍第二种方式。

第二种  在特定的界面(Activity)中创建侧滑菜单,示例代码如下所示:

       和前面的代码图示相比,这里创建一个SlidingMenu对象的方法相对于前面一种在Acticity中显示滑动菜单,少了两个set方法,但是多了一个setBehindContentView方法,这个方法就是设定布局的,在图中的注释已经阐述了。本例中设定的是从右向左边滑动,下图是示例效果:


       这里可以看到,滑动菜单界面没有显示标题栏,这个很好理解,因为我们的菜单是独立的一个界面,并不在指定的活动中“内嵌”。还有一点,从右边往左边滑动这个图案并不好看,同样,QQ中只用了LEFT这个滑动模式。可见,LEFT和RIGHT侧滑的UI效果,并不完全对称,其实自然界本来就是如此。
    这就是滑动菜单的基本使用,这里是展示了滑动的简单效果,还有很多其他的功能的用法,后续学习、、、、


续写关于SlidingMenu的另一个滑动模式的用法:前文中提及了滑动模式的设置方法,menu.setTouchModeAbove(),该方法一共只有三个参数供选择,除了前面的全屏触发和边沿触发外,还有一种为TOUCHMODE_NONE。这种触发模式是设置为在屏幕禁止触发,而是由特定的控件触发,比如Button或ImageView等。示例代码如下:


在上面的示例代码中,我们设定该触发在屏幕类禁止,而是有控件触发的,此时,我们只需要在XML文件中定义某个空间具备onClick的特性,调用showMenu()方法就可以实现触发滑动菜单了。











0 0