android Drawer Arrow Drawable（meun-icon-to-back-arrow）使用，仿知乎菜单栏界面

来源：互联网发布：openstack网络架构图编辑：程序博客网时间：2024/05/24 22:42

http://blog.csdn.net/itwuchen/article/details/45419219（转）

Drawer Arrow Drawable（meun-icon-to-back-arrow）使用，仿知乎菜单栏界面

一、什么是Drawer Arrow Drawable

Drawer Arrow Drawable 其实就是一个抽屉侧滑菜单栏，只不过加入了很酷炫的meun-icon-to-back-arrow动画效果，如下图所示

二、Drawer Arrow Drawable的实现原理

设计方法：

我的想法是：如果我能生成每条线末端的移动曲线，我就能随抽屉（drawer）的滑动，根据参数t简单地计算出每条路径（path）上的点，
然后只需从curveA上的点M向curveB上的N绘制一条直线即可。

为了生成这些曲线，我需要一个适合取用的点的集合案例。我首先想到我应该在打开抽屉的时候，从我的设备上录制视频，分成N帧。但是我突然
想到：抽屉滑动时的插值器会使得这些帧不能均匀分布。不用太复杂，我只是粗略地移动抽屉，然后对每一步截屏。

这儿，我把所有的图像放在Adobe Illustrator上，并用一条向量追踪一条线（方便缩放：6pt等于6px），这是一个劳动密集型的过程,
充满了大量的错误;毕竟,六个像素加抗锯齿是一种低精度,相对于要使用到的数学方法

三、Drawer arrow Drawable的使用

[java] view plaincopyprint?
package com.example.ldrawertest;  
  
import com.example.ldrawerlibrary.ActionBarDrawerToggle;  
import com.example.ldrawerlibrary.DrawerArrowDrawable;  
import android.annotation.SuppressLint;  
import android.app.ActionBar;  
import android.app.Activity;  
import android.content.Intent;  
import android.content.res.Configuration;  
import android.net.Uri;  
import android.os.Bundle;  
import android.support.v4.widget.DrawerLayout;  
import android.view.MenuItem;  
import android.view.View;  
import android.widget.AdapterView;  
import android.widget.ArrayAdapter;  
import android.widget.ListView;  
  
  
public class MainActivity extends Activity {  
  
    private DrawerLayout mDrawerLayout;  
    private ListView mDrawerList;  
    private ActionBarDrawerToggle mDrawerToggle;  
    private DrawerArrowDrawable drawerArrow;  
    private boolean drawerArrowColor;  
  
    @SuppressLint("NewApi")  
    @Override  
    protected void onCreate(Bundle savedInstanceState) {  
        super.onCreate(savedInstanceState);  
        setContentView(R.layout.activity_main);  
          
        //得到一个actionbar  
        ActionBar ab = getActionBar();  
        // 给左上角图标的左边加上一个返回的图标  
        ab.setDisplayHomeAsUpEnabled(true);  
        //必须通过调用setHomeButtonEnabled(true)方法确保这个图标能够作为一个操作项  
        ab.setHomeButtonEnabled(true);  
  
          
        mDrawerLayout = (DrawerLayout) findViewById(R.id.drawer_layout);  
       //抽屉侧栏的布局，为一个listView  
        mDrawerList = (ListView) findViewById(R.id.navdrawer);  
  
        //创建DrawerArrow  
        drawerArrow = new DrawerArrowDrawable(this) {  
            @Override  
            public boolean isLayoutRtl() {  
                return false;  
            }  
        };  
          
        /* 
         *  ActionBarDrawerToggle  是 DrawerLayout.DrawerListener实现。 
            和 NavigationDrawer 搭配使用，推荐用这个方法，符合Android design规范。 
            作用： 
            1.改变android.R.id.home返回图标。 
            2.Drawer拉出、隐藏，带有android.R.id.home动画效果。 
            3.监听Drawer拉出、隐藏； 
         */  
          
          
        //动作条抽屉切换器将抽屉与app icon动作条绑定正确交互。  
        mDrawerToggle = new ActionBarDrawerToggle(this, mDrawerLayout,  
            drawerArrow, R.string.drawer_open,  
            R.string.drawer_close) {  
            //当抽屉关闭时  
            public void onDrawerClosed(View view) {  
                super.onDrawerClosed(view);  
                /* 
                 * getActivity().invalidateOptionsMenu();  
                 * 在运行时改变menu item的状态。你需要重写onPrepareOptionsMenu() ， 
                 * 它方便你对item移除，添加，使不可用等。在android 3.0以上， 
                 * 你必须调用invalidateOptionsMenu() 。 
                 *  
                 */  
                invalidateOptionsMenu();  
            }  
            //当抽屉打开时  
            public void onDrawerOpened(View drawerView) {  
                super.onDrawerOpened(drawerView);  
                invalidateOptionsMenu();  
            }  
        };  
          
        //设置监听drawer切换  
        mDrawerLayout.setDrawerListener(mDrawerToggle);  
        //该方法会自动和actionBar关联, 将开关的图片显示在了action上，如果不设置，也可以有抽屉的效果，不过是默认的图标    
        mDrawerToggle.syncState();  
  
        //设置LDrawer填充内容，通过Adapter填充  
        String[] values = new String[]{  
            "     用户名",  
            "     发现",  
            "     关注",  
            "     收藏",  
            "     草稿",  
            "     提问",  
            "     设置"  
        };  
          
        ArrayAdapter<String> adapter = new ArrayAdapter<String>(this,  
            android.R.layout.simple_list_item_1, android.R.id.text1, values);  
        mDrawerList.setAdapter(adapter);  
          
          
        //抽屉侧栏设置点击事件  
        mDrawerList.setOnItemClickListener(new AdapterView.OnItemClickListener() {  
            @Override  
            public void onItemClick(AdapterView<?> parent, View view,  
                                    int position, long id) {  
                switch (position) {  
                    case 0:  
                        mDrawerToggle.setAnimateEnabled(false);//设置停止或开启动画  
                        drawerArrow.setProgress(1f);//设置普通菜单图标模式  
                        break;  
                    case 1:  
                        mDrawerToggle.setAnimateEnabled(false);  
                        drawerArrow.setProgress(0f);//设置返回箭头模式  
                        break;  
                    case 2:  
                        mDrawerToggle.setAnimateEnabled(true);  
                        mDrawerToggle.syncState();  
                        break;  
                    case 3:  
                        if (drawerArrowColor) {  
                            drawerArrowColor = false;  
//                            drawerArrow.setColor(R.color.ldrawer_color);//设置颜色  
                        } else {  
                            drawerArrowColor = true;  
//                            drawerArrow.setColor(R.color.drawer_arrow_second_color);  
                        }  
                        mDrawerToggle.syncState();  
                        break;  
                    case 4:  
                        Intent browserIntent = new Intent(Intent.ACTION_VIEW, Uri.parse("https://github.com/IkiMuhendis/LDrawer"));  
                        startActivity(browserIntent);  
                        break;  
                    case 5:  
                        Intent share = new Intent(Intent.ACTION_SEND);  
                        share.setType("text/plain");  
                        share.addFlags(Intent.FLAG_ACTIVITY_NEW_TASK);  
                        share.putExtra(Intent.EXTRA_SUBJECT,  
                            getString(R.string.app_name));  
                        share.putExtra(Intent.EXTRA_TEXT, getString(R.string.app_description) + "\n" +  
                            "GitHub Page :  https://github.com/IkiMuhendis/LDrawer\n" +  
                            "Sample App : https://play.google.com/store/apps/details?id=" +  
                            getPackageName());  
                        startActivity(Intent.createChooser(share,  
                            getString(R.string.app_name)));  
                        break;  
                    case 6:  
                        String appUrl = "https://play.google.com/store/apps/details?id=" + getPackageName();  
                        Intent rateIntent = new Intent(Intent.ACTION_VIEW, Uri.parse(appUrl));  
                        startActivity(rateIntent);  
                        break;  
                }  
  
            }  
        });  
    }  
  
      
      
    //菜单键点的事件处理  
    @Override  
    public boolean onOptionsItemSelected(MenuItem item) {  
        if (item.getItemId() == android.R.id.home) {  
            if (mDrawerLayout.isDrawerOpen(mDrawerList)) {  
                mDrawerLayout.closeDrawer(mDrawerList);  
            } else {  
                mDrawerLayout.openDrawer(mDrawerList);  
            }  
        }  
        return super.onOptionsItemSelected(item);  
    }  
  
    //activity创完成后  
    @Override  
    protected void onPostCreate(Bundle savedInstanceState) {  
        super.onPostCreate(savedInstanceState);  
        mDrawerToggle.syncState();  
    }  
  
    //配置改变时  
    @Override  
    public void onConfigurationChanged(Configuration newConfig) {  
        super.onConfigurationChanged(newConfig);  
        mDrawerToggle.onConfigurationChanged(newConfig);  
    }  
}  

0 0