Android编程：扇形展开的悬浮菜单按钮CircularFloatingActionMenu实例

Android编程：扇形展开的悬浮菜单按钮CircularFloatingActionMenu实例

本文博客链接:http://blog.csdn.net/jdh99,作者:jdh,转载请注明.

环境：

主机:WIN10

开发环境:Android Studio 2.2 Preview 3

说明：

用第三方库CircularFloatingActionMenu实现悬浮按钮扇形展开

效果图：

源码：

private void initFloatingActionsMenu(View view) {
        // 添加 右下角的白色+号按钮
        final ImageView fabIcon = new ImageView(getContext());
        fabIcon.setImageDrawable(getResources().getDrawable(R.drawable.ic_fab, null));
        final FloatingActionButton fabButton = new FloatingActionButton.Builder(getActivity())
                .setContentView(fabIcon)
                .setPosition(FloatingActionButton.POSITION_BOTTOM_LEFT)
                .build();

        SubActionButton.Builder rLSubBuilder = new SubActionButton.Builder(getActivity());

        ImageView imageViewQuit = new ImageView(getContext());
        ImageView imageViewTool = new ImageView(getContext());
        ImageView imageViewPalette = new ImageView(getContext());
        ImageView imageViewCamera = new ImageView(getContext());
        imageViewQuit.setImageDrawable(getResources().getDrawable(R.drawable.ic_call_end_black_48dp, null));
        imageViewTool.setImageDrawable(getResources().getDrawable(R.drawable.ic_settings_applications_black_48dp, null));
        imageViewPalette.setImageDrawable(getResources().getDrawable(R.drawable.ic_color_lens_black_48dp, null));
        imageViewCamera.setImageDrawable(getResources().getDrawable(R.drawable.ic_camera_alt_black_48dp, null));

        SubActionButton buttonQuit = rLSubBuilder.setContentView(imageViewQuit).build();
        SubActionButton buttonPalette = rLSubBuilder.setContentView(imageViewPalette).build();
        SubActionButton buttonTool = rLSubBuilder.setContentView(imageViewTool).build();
        SubActionButton buttonCamera = rLSubBuilder.setContentView(imageViewCamera).build();

        // Build the menu with default options: light theme, 90 degrees, 72dp
        // radius.
        // Set 4 default SubActionButtons
        // FloatingActionMenu通过attachTo(fabButton)附着到FloatingActionButton
        final FloatingActionMenu buttonToolMenu = new FloatingActionMenu.Builder(getActivity())
                .addSubActionView(buttonPalette)
                .addSubActionView(buttonCamera)
                .addSubActionView(buttonTool)
                .addSubActionView(buttonQuit)
                .setStartAngle(0)
                .setEndAngle(-90)
                .attachTo(fabButton)
                .build();

        // Listen menu open and close events to animate the button content view
        buttonToolMenu.setStateChangeListener(new FloatingActionMenu.MenuStateChangeListener() {
            @Override
            public void onMenuOpened(FloatingActionMenu menu) {
                // 增加按钮中的+号图标顺时针旋转45度
                // Rotate the icon of fabButton 45 degrees clockwise
                fabIcon.setRotation(0);
                PropertyValuesHolder pvhR = PropertyValuesHolder.ofFloat(View.ROTATION, 45);
                ObjectAnimator animation = ObjectAnimator.ofPropertyValuesHolder(fabIcon, pvhR);
                animation.start();
            }

            @Override
            public void onMenuClosed(FloatingActionMenu menu) {
                // 增加按钮中的+号图标逆时针旋转45度
                // Rotate the icon of fabButton 45 degrees
                // counter-clockwise
                fabIcon.setRotation(45);
                PropertyValuesHolder pvhR = PropertyValuesHolder.ofFloat(View.ROTATION, 0);
                ObjectAnimator animation = ObjectAnimator.ofPropertyValuesHolder(fabIcon, pvhR);
                animation.start();
            }
        });

        RxView.clicks(buttonQuit)
                .throttleFirst(1, TimeUnit.SECONDS)
                .compose(this.bindUntilEvent(FragmentEvent.DESTROY))
                .subscribe(v -> {
                    Voip.getInstance().hangUpCall(callId);
                    finishActivity();
                });

        RxView.clicks(buttonPalette)
                .throttleFirst(1, TimeUnit.SECONDS)
                .compose(this.bindUntilEvent(FragmentEvent.DESTROY))
                .subscribe(v -> {
                    buttonToolMenu.close(true);
//                    buttonToolMenu.collapse();
                    dialogPalette.show();
                });

        RxView.clicks(buttonCamera)
                .throttleFirst(1, TimeUnit.SECONDS)
                .compose(this.bindUntilEvent(FragmentEvent.DESTROY))
                .subscribe(v -> {
                    buttonToolMenu.close(true);
//                    buttonToolMenu.collapse();
                    dialogSelectImage.show();
                });
    }

参考链接：

1. oguzbilgener/CircularFloatingActionMenu