«

android 开源项目GuillotineMenu,酷炫的铡刀菜单

时间:2024-3-2 19:56     作者:韩俊     分类: Android


开源项目GuillotineMenu使用指南


先上效果图:


IDE使用的是Android studio.


首先下载GuillotineMenu项目的library引用到项目中,下载地址:

http://download.csdn.net/detail/u012027644/8840527


guillotine.xml:这个XML是菜单的布局

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@color/guillotine_background"
    android:orientation="vertical">

    <android.support.v7.widget.Toolbar
        style="@style/Toolbar"
        app:contentInsetStart="0dp">

        <ImageView
            android:id="@+id/guillotine_hamburger"
            style="@style/ImageView.Hamburger"
            android:src="@drawable/ic_menu" />
    </android.support.v7.widget.Toolbar>

    <LinearLayout
        android:id="@+id/profile_group"
        style="@style/LinearLayout.GuillotineItem"
        android:layout_marginTop="@dimen/guillotine_medium_margin">

        <ImageView
            style="@style/ImageView.GuillotineItem"
            android:src="@drawable/ic_profile" />

        <TextView
            style="@style/TextView.GuillotineItem"
            android:text="我的信息" />
    </LinearLayout>

    <LinearLayout
        android:id="@+id/feed_group"
        style="@style/LinearLayout.GuillotineItem">

        <ImageView
            style="@style/ImageView.GuillotineItem"
            android:src="@drawable/ic_feed" />

        <TextView
            style="@style/TextView.GuillotineItem"
            android:text="我的发现" />
    </LinearLayout>

    <LinearLayout
        android:id="@+id/activity_group"
        style="@style/LinearLayout.GuillotineItem">

        <ImageView
            style="@style/ImageView.GuillotineItem"
            android:src="@drawable/ic_activity" />

        <TextView
            style="@style/TextView.GuillotineItem"
            android:text="我的活动" />
    </LinearLayout>

    <View
        android:layout_width="match_parent"
        android:layout_height="@dimen/guillotine_divider_height" />

    <LinearLayout
        android:id="@+id/settings_group"
        style="@style/LinearLayout.GuillotineItem">

        <ImageView
            style="@style/ImageView.GuillotineItem"
            android:src="@drawable/ic_settings" />

        <TextView
            style="@style/TextView.GuillotineItem"
            android:text="设        置" />
    </LinearLayout>
</LinearLayout>

activity_main.xml:主Activity的布局

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/root"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <!--顶部遮挡缝隙部分-->
    <View
        android:layout_gravity="top"
        android:layout_width="match_parent"
        android:layout_height="35dp"
        android:background="@color/guillotine_background"
        />

    <!--标题栏-->
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">

        <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            app:contentInsetStart="0dp"
            style="@style/Toolbar">

            <ImageView
                android:id="@+id/content_hamburger"
                style="@style/ImageView.Hamburger"
                android:src="@drawable/ic_menu_90" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:text="断头台菜单"
                android:textColor="#ffffff"
                android:textStyle="bold"
                android:textSize="24sp"/>

        </android.support.v7.widget.Toolbar>

    </LinearLayout>
</FrameLayout>

主Activity的代码:

public class MainActivity extends AppCompatActivity {

    private static final long RIPPLE_DURATION = 250;

    //获取控件
    @InjectView(R.id.toolbar)
    Toolbar toolbar; //标题栏
    @InjectView(R.id.root)
    FrameLayout root; //布局
    @InjectView(R.id.content_hamburger)
    ImageView contentHamburger; //菜单按钮

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        ButterKnife.inject(this);

        if (toolbar != null) {
            setSupportActionBar(toolbar);
            getSupportActionBar().setTitle(null);
        }

        //弹出的菜单
        View guillotineMenu = LayoutInflater.from(this).inflate(R.layout.guillotine, null);
        root.addView(guillotineMenu);

        // 添加弹出的菜单
        //GuillotineBuilder的第一个参数为菜单的View,第二个参数为关闭菜单的View也就是菜单布局中的按钮,第三个参数为打开菜单的View也就是主页面中的按钮
        new GuillotineAnimation.GuillotineBuilder(guillotineMenu, guillotineMenu.findViewById(R.id.guillotine_hamburger), contentHamburger)
                .setStartDelay(RIPPLE_DURATION)
                .setActionBarViewForAnimation(toolbar)
                .build();
    }
}

DEMO的下载地址:http://download.csdn.net/detail/u012027644/8840433


项目github的地址:https://github.com/Yalantis/GuillotineMenu-Android

        <p>版权声明:本文为博主原创文章,未经博主允许不得转载。</p>

标签: android

热门推荐