Side-Menu.Android的应用

Side-Menu.Android的应用

最近学习了一波android的自带组件，发现原始的ui真是巨丑无比，而自己水平有限，那些超炫酷的交互又不知如何下手，然后就着手寻找一些开源的ui框架，映入眼帘的是交互炫酷的Side-Menu.Android。

简介

Side-Menu.Android是Yalantis 出品的分类侧滑菜单，同时也发现了一款同样是Yalantis出品的Phoenix Pull-to-Refresh-Android，这里不细说，附上github，实现比较简单，，有兴趣的同学可以自行使用。

顺便提醒一下，Yalantis官网放有很多很好看的开源项目哦。



github地址 —— [ Side-Menu.Android ]

github地址 —— [ Phoenix Pull-to-Refresh-Android ]

Yalantis官网 —— [ Yalantis ]

官方使用介绍

First of all you have to upload animation submodule with

git submodule update

–init command

Or you can add gradle dependency with command :

dependencies {
compile 'com.github.yalantis:Side-Menu.Android:1.0.1'
}

and command:

repositories {
maven {
url "https://jitpack.io"
}
}
dependencies {
compile 'com.github.ozodrukh:CircularReveal:(latest-release)@aar'
}

To add gradle dependency you need to open build.gradle (in your app folder,not in a project folder) then copy and add the dependencies there in the dependencies block;

for CircularReveal module

After you have to create special overlay layout to show in behind current

Circular Reveal

animated view. And to add all items to menu you have to add all of them into

LinearLayout

<andr
4000
oid.support.v4.widget.DrawerLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent">

<io.codetail.widget.RevealFrameLayout
android:id="@+id/conteiner_frame"
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:id="@+id/content_overlay"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"/>
<LinearLayout
android:id="@+id/content_frame"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"/>

<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:minHeight="?attr/actionBarSize"
android:background="?attr/colorPrimary"/>

</io.codetail.widget.RevealFrameLayout>

<ScrollView
android:id="@+id/scrollView"
android:scrollbarThumbVertical="@android:color/transparent"
android:layout_width="80dp"
android:layout_height="match_parent"
android:layout_gravity="start|bottom">

<LinearLayout
android:id="@+id/left_drawer"
android:orientation="vertical"
android:layout_width="80dp"
android:layout_height="wrap_content"
android:divider="@android:color/transparent"
android:dividerHeight="0dp"
android:background="@android:color/transparent">
<!-- Layout of Drawer -->
</LinearLayout>
</ScrollView>
</android.support.v4.widget.DrawerLayout>

ViewAnimator viewAnimator = new ViewAnimator<>
(ActionBarActivity.this,
new ArrayList<Resourceble>(),
(LinearLayout)findViewById(R.id.left_drawer),
contentFragment,
drawerLayout);
//to open menu you have to override ActionBarDrawerToggle method
@Override
public void onDrawerSlide(View drawerView, float slideOffset) {
super.onDrawerSlide(drawerView, slideOffset);
if (slideOffset > 0.6 && viewAnimator.getLinearLayout().getChildCount() == 0)
viewAnimator.showMenuContent();
}
public void onDrawerClosed(View view) {
super.onDrawerClosed(view);
viewAnimator.getLinearLayout().removeAllViews();
viewAnimator.getLinearLayout().invalidate();
}

All menu items should implement

Resourceble

interface to get menu item name and drawable res And all fragments should implement

ScreenShotable

to get screenshot of a fragment

You can customize icons that u place in the menu,or add mor items. Simply by changing the list you parse to view animator .For example:

private List<SlideMenuItem> list = new ArrayList<>();
// the list of menu items

SlideMenuItem menuItem0 = new SlideMenuItem(ContentFragment.CLOSE, R.drawable.icn_close);
list.add(menuItem0);
SlideMenuItem menuItem = new SlideMenuItem(ContentFragment.BUILDING, R.drawable.icn_1);
//first parameter is the id of menu item,the second is the icon resouce
list.add(menuItem);
SlideMenuItem menuItem2 = new SlideMenuItem(ContentFragment.BOOK, R.drawable.icn_2);
list.add(menuItem2);

viewAnimator = new ViewAnimator<>(this, list, contentFragment, drawerLayout, this);

使用体会

在官网提供的最新版本’com.github.yalantis:Side-Menu.Android:1.0.1’ 中与github提供的项目不一致，移除了SupportAnimator改为Animator

对于android界面开发真是身心俱疲，好麻烦，好佩服google能开发出这么复杂的系统，心力憔悴，继续学习使用。

实际显示效果：