Android UI之SlidingMenu侧滑菜单

SlidingMenu侧滑菜单是一种比较新的设置界面或配置界面的效果,在主界面左滑或者右滑出现设置界面效果,能方便的进行各种操作。很多优秀的应用都采用了这种界面方案,像facebook、人人网、everynote、Google+、网易新闻、知乎日报、有道云笔记等等。

现在这种交互方式越来越流行了,虽然这种交互方式可以通过自定义组件的方式来实现,但是用第三方开源库更简单。地址: https://github.com/jfeinstein10/SlidingMenu.git

侧滑菜单实现原理:

在一个Activity的布局中需要有两部分,一个是菜单(menu)的布局,一个是内容(content)的布局。两个布局横向排列,菜单布局在左,内容布局在右。初始化的时候将菜单布局向左偏移,以至于能够完全隐藏,这样内容布局就会完全显示在Activity中。然后通过监听手指滑动事件,来改变菜单布局的左偏移距离,从而控制菜单布局的显示和隐藏。

实例:

运行效果:

要想能够实现SlidingMenu的效果,首先必须要将它作为libary导入到你的工程,目录结构如下:

代码清单:

主界面内容布局:activity_main.xml

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context=".MainActivity" >

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/hello_world" />

</RelativeLayout>

侧滑菜单布局:slidingmenu.xml

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context=".MainActivity" >

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Sliding Menu Layout" />

</RelativeLayout>

尺寸资源文件:dimens.xml

<resources>

    <!-- Default screen margins, per the Android Design guidelines. -->
    <dimen name="activity_horizontal_margin">16dp</dimen>
    <dimen name="activity_vertical_margin">16dp</dimen>

    <dimen name="slidingmenu_offset">150dp</dimen>
    <dimen name="shadow_width">15dp</dimen>
</resources>

shadow.xml资源 这个资源文件是用来实现阴影效果的图形,使用了渐变的绘图效果。

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" >

    <gradient
        android:endColor="#33000000"
        android:centerColor="#11000000"
        android:startColor="#00000000" />

</shape>

Java源代码文件:MainActivity.java

package com.rainsong.slidingmenudemo;

import android.os.Bundle;
import android.app.Activity;
import android.view.Menu;
import com.jeremyfeinstein.slidingmenu.lib.SlidingMenu;

public class MainActivity extends Activity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        // 实例化滑动菜单对象
        SlidingMenu menu = new SlidingMenu(this);
        // 设置为左滑菜单
        menu.setMode(SlidingMenu.LEFT);
        // 设置触摸屏幕的模式
        menu.setTouchModeAbove(SlidingMenu.TOUCHMODE_FULLSCREEN);
        // 设置滑动阴影的宽度
        menu.setShadowWidthRes(R.dimen.shadow_width);
        // 设置滑动阴影的图像资源
        menu.setShadowDrawable(R.drawable.shadow);
        // 设置滑动菜单划出时主页面显示的剩余宽度
        menu.setBehindOffsetRes(R.dimen.slidingmenu_offset);
        // 设置渐入渐出效果的值
        menu.setFadeDegree(0.35f);
        // 附加在Activity上
        menu.attachToActivity(this, SlidingMenu.SLIDING_CONTENT);
        // 设置滑动菜单的布局
        menu.setMenu(R.layout.slidingmenu);
    }

    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        // Inflate the menu; this adds items to the action bar if it is present.
        getMenuInflater().inflate(R.menu.main, menu);
        return true;
    }

}

时间: 2024-10-19 11:53:14

Android UI之SlidingMenu侧滑菜单的相关文章

Android之十SlidingMenu侧滑菜单的实现分析

Android之十SlidingMenu侧滑菜单的实现分析 SlidingMenu侧滑菜单是一种比较新的设置界面或配置界面的效果,在主界面左滑或者右滑出现设置界面效果,能方便的进行各种操作.很多优秀的应用都采用了这种界面方案,像facebook.人人网.everynote.Google+.网易新闻.知乎日报.有道云笔记等等 侧滑菜单实现原理: 在一个Activity的布局中需要有两部分,一个是菜单(menu)的布局,一个是内容(content)的布局.两个布局横向排列,菜单布局在左,内容布局在右

IOS开发UI篇--一个侧滑菜单SlidingMenu

一.简介 侧滑菜单已经成为app一个极常用的设计,不管是事务类,效率类还是生活类app.侧滑菜单因Path 2.0和Facebook为开发者熟知,国内目前也有很多流行app用到了侧滑菜单,比如QQ.网易邮箱.知乎等等.iOS官方并没有提供类似于侧滑栏之类的组件,所以我们需要自己写一个侧滑栏控件,为了不要重复造轮子,我在github上找到了一个使用简单方便,新手容易入手的侧滑菜单控件,地址:https://github.com/John-Lluch/SWRevealViewController/t

SlidingMenu 侧滑菜单的用法

很多APP都有侧滑菜单的功能,部分APP左右都是侧滑菜单~SlidingMenu 这个开源项目可以很好帮助我们实现侧滑功能,将侧滑菜单引入项目的方式很多中,先通过例子介绍各种引入方式,然后给大家展示个实例:主布局 ViewPager,左右各一个侧滑菜单的用法,差不多已经能满足大部分应用的需求了.关于常用属性,在文章末尾介绍. 1.在Activity中通过SlidingMenu构造方法,直接设置侧滑菜单 package com.zhy.zhy_slidemenu_demo; import andr

Android毛玻璃效果侧滑菜单

实现目标 相信大家都知道毛玻璃效果是怎样的,也可以说是高斯模糊效果.效果图如下: 这是一个透明,且会对背景进行高斯模糊的效果,看起来就像是毛玻璃一样,其实不光是侧滑菜单,只要是view,理论上都可以实现这样的效果,接下来我们就来实现这个效果. 第一步:框架搭建 我使用的android studio,所以要创建这样一个带侧滑菜单的项目非常简单,在新建项目的步骤中,执行到这一步,选择Navigation Drawer Activity就可以了: android studio会自动创建带有这种侧滑覆盖

两种主流的实现侧滑菜单控件的学习总结

第一次开始研究侧滑菜单实现还是QQ加入这个功能之后吸引的我,当时就觉得这个侧滑菜单的想法简直独具匠心,使用侧滑菜单的好处必须明显,它可以无形的使我们的屏幕利用更大化,你可以假想自己的屏幕比现实还要大,那个侧滑菜单就藏在看不见的屏幕里,当我们用侧滑手势之后,就将它们从看不见的屏幕里拉入真实屏幕中,当我们使用完菜单后,又可以将它们收回到看不见的屏幕中...这让本来空间就有限的手机屏幕,屏幕利用率得到大大的提高.后来通过自己在网络博客论坛的寻觅,发现了两种比较便捷的能帮助我们实现侧滑菜单效果的控件:

仿QQ5.0 里的侧滑菜单效果的实现

今天,我来分享下,侧滑菜单的实现原理,一般android侧滑的实现原理和步骤如下:(源码下载在下面最后给出哈) 1.使用ViewGroup 放2个view,一个是menu菜单,一个是content内容 2.监听onTouchEvent事件 处理ACTION_MOVE中的leftMargin位置,从而改变menu菜单的滑动位置 当ACTION_UP时,根据显示菜单的宽度,决定将其显示或隐藏动画效果: (1)使用Scroller这个辅助类实现动画效果 (2)单起一个Thread(或Task)来改变l

Android笔记(五十二) 侧滑菜单SlidingMenu

SlidingMenu是一个优秀的开源项目,可以实现侧滑菜单,简单介绍一下这SlidingMenu的使用: 常用属性和方法: setTouchModeAbove(int i )是否可以通过滑动手势打开menu TOUCHMODE_MARGIN = 0  在边缘滑动 TOUCHMODE_FULLSCREEN = 1 在屏幕任意位置滑动 TOUCHMODE_NONE = 2 滑动无法打开menu setMode(int mode)设置menu出现位置 LEFT = 0    菜单出现在屏幕左侧 RI

Android 侧滑菜单的简单实现(SlidingMenu)二

在上一篇博文中已经简单的实现了侧滑菜单,代码也很简单,就几行代码. 这篇文章依然讲侧滑菜单,与前一篇文章不同的是,这篇文章用不同的代码方式来实现侧滑菜单. 在前面的文章中已经用了在Activity中通过SlidingMenu构造方法直接设置侧滑菜单,这里换成通过Activity继承SlidingActivity来实现侧滑. 代码如下: public class MainActivity extends SlidingActivity 重写onCreate()方法: @Override publi

Android 侧滑菜单的简单实现(SlidingMenu)

在我还没有学习Android的时候就用过侧滑菜单的APP,当时第一个感觉是:哇塞,这效果不错!当然,现在自己都已经学Android了,这效果当然也要做出来啊~ SlidingMenu是一种比较新的设置界面或配置界面的效果(我觉得已经不新了耶~),在主界面左滑或者右滑出现设置界面效果,能方便的进行各种操作.很多优秀的应用都采用了这种界面方案,像facebook.人人网.everynote.Google+等等.效果如下图: 其实网上已经有很多写SlidingMenu使用的文章了.不过,别人始终是别人