toolbar之menu高级用法

前言

在通用的menu使用中,通常的使用方式有以下两类:

 

图片形式菜单和文字形式菜单,但是这两种形式并不能满足所有需求,在实际项目中也可能需要同时需要使用图片和文字,

如同下图:

本文将以两种形式介绍图片+文字实现菜单

 

  1. 自定义ActionProvider
  2. 通过ActionLayout定义菜单布局

先看效果:

toolbar之menu高级用法_第1张图片

 

  • 自定义ActionProvider

首先自定义CustomActionProvider继承ActionProvider,因为Toolbarsupport包下的,所以我们要用support下的ActionProvider类,这个类是在support.v4下,它是兼容ToolbarActionBar;

 

public class CustomActionProvider extends ActionProvider {
    public CustomActionProvider(Context context) {
        super(context);
    }

    @Override
    public View onCreateActionView() {
        return view;
    }

}

这里需要定义一个显示的view

 




    

    

特别说明一下,android:background="?actionBarItemBackground" 是引用系统默认Toolbar/ActionBarMenu的点击效果,

然后完善我们的CustomActionProvider,

 

public class CustomActionProvider extends ActionProvider {

    public CustomActionProvider(Context context) {
        super(context);
    }

    TextView mTitle;
    ImageView mIcon;

    @Override
    public View onCreateActionView() {
        //读取support下Toolbar/ActionBar的高度,为了让这个Menu高和宽和系统的menu达到一致
        int size = getContext().getResources().getDimensionPixelSize(
                android.support.design.R.dimen.abc_action_bar_default_height_material);

        ViewGroup.LayoutParams layoutParams = new ViewGroup.LayoutParams(size, size);
        View view = LayoutInflater.from(getContext())
                .inflate(R.layout.layout_menu_provider, null, false);
        view.setLayoutParams(layoutParams);
        mTitle = view.findViewById(R.id.tv_title);
        mIcon = view.findViewById(R.id.iv_image);
        view.setOnClickListener(mOnClickListener);
        return view;
    }

    View.OnClickListener mOnClickListener;

    public void setOnClickListener(View.OnClickListener onClickListener) {
        this.mOnClickListener = onClickListener;
    }
}

添加自定义方法,供外部调用:

public void setIcon(@DrawableRes int resId) {
    mIcon.setImageResource(resId);
}

public void setText(@StringRes int resId) {
    mTitle.setText(resId);
}

public void setText(CharSequence text) {
    mTitle.setText(text);
}

到这里,准备工作完成,然后是如何使用:

 

 



    

这里需要说明的是我们引用的app:actionProviderClass="com.banzhi.toolbardemo.CustomActionProvider"是以app开头,而不是android.然后是java代码:

 

    CustomActionProvider actionProvider;

    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        getMenuInflater().inflate(R.menu.menu_custom, menu);
        final MenuItem menuItem = menu.findItem(R.id.menu1);
        actionProvider = (CustomActionProvider) MenuItemCompat.getActionProvider(menuItem);
        actionProvider.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                onOptionsItemSelected(menuItem);
            }
        });
        return super.onCreateOptionsMenu(menu);
    }
    @Override
    public void onWindowFocusChanged(boolean hasFocus) {
        super.onWindowFocusChanged(hasFocus);
        actionProvider.setIcon(R.drawable.filter);
        actionProvider.setText(R.string.menutext1);
    }
}

特别说明一点我们CustomActionProvider中暴露的方法不能再onCreateOptionMenu中直接调用,应为ActionProvider还没有加载完成,我这里是在onWindowFocusChanged()中调用。到此我们的第一种方式介绍结束,如果有不明白的地方,可以参考严大的博客点击打开链接。

 

  • ActionLayout定义菜单布局

第二种方式比较简单,也不需要定义actionProvider,只需要定义一个布局文件:

 




然后在menu中使用

 




    

与自定义CustomActionProvider相同,这里也是使用app开头,而不是android,接着是java代码:

 

View actionView;
MenuItem item;

@Override
public boolean onCreateOptionsMenu(Menu menu) {
    getMenuInflater().inflate(R.menu.menu_custom, menu);
    item = menu.findItem(R.id.menu2);
    actionView = item.getActionView();
    return super.onCreateOptionsMenu(menu);
}

然后是添加点击事件:

 

@Override
public void onWindowFocusChanged(boolean hasFocus) {
    super.onWindowFocusChanged(hasFocus);
    actionView.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View view) {
            onOptionsItemSelected(item);
        }
    });
}

如果不添加点击事件,onOptionsItemSelected()中是不会有事件响应;为什么要在onWindowFocusChanged()中添加事件的原因与上面相同,这里就不在解释。如果需要修改menu文字或者图片,可以通过ActionView获取控件修改,比如:

 

TextView text = actionView.findViewById(R.id.text);
text.setText("filter");
到此两种方法介绍结束,源码下载地址 点击打开链接

 

你可能感兴趣的:(android)