Android Radial / Pie Menu

Question

I am looking to create a radial menu in a game that I am writing. Is there a class or API included to assist with this or an open source solution?

Something like this.

Thank you, Jake

Answer 1

Below has the View class ondraw() method to Draw the Radial Menu..

    @Override
    protected void onDraw(Canvas canvas) {
    super.onDraw(canvas);
    mRadialMenuPaint.setShadowLayer(mShadowRadius, 0.0f, 0.0f, mShadowColor);  
    //Draw the menu if the menu is to be displayed.
    if(isMenuVisible) {
        canvas.drawArc(mMenuRect, mStartAngle, 180, true, mRadialMenuPaint);
        //See if there is any item in the collection
        if(mMenuItems.size() > 0) {
            float mStart = mStartAngle;
            //Get the sweep angles based on the number of menu items
            float mSweep = 180/mMenuItems.size();
            for(SemiCircularRadialMenuItem item : mMenuItems.values()) {
                mRadialMenuPaint.setColor(item.getBackgroundColor());
                item.setMenuPath(mMenuCenterButtonRect, mMenuRect, mStart, mSweep, mRadius, mViewAnchorPoints);
                canvas.drawPath(item.getMenuPath(), mRadialMenuPaint);
                if(isShowMenuText) {
                    mRadialMenuPaint.setShadowLayer(mShadowRadius, 0.0f, 0.0f, Color.TRANSPARENT);  
                    mRadialMenuPaint.setColor(item.getTextColor());
                    canvas.drawTextOnPath(item.getText(), item.getMenuPath(), 5, textSize, mRadialMenuPaint);
                    mRadialMenuPaint.setShadowLayer(mShadowRadius, 0.0f, 0.0f, mShadowColor);
                }
                item.getIcon().draw(canvas);
                mStart += mSweep;
            }
            mRadialMenuPaint.setStyle(Style.FILL);
        }
    }
    //Draw the center menu toggle piece
    mRadialMenuPaint.setColor(centerRadialColor);
    canvas.drawArc(mMenuCenterButtonRect, mStartAngle, 180, true, mRadialMenuPaint);
    mRadialMenuPaint.setShadowLayer(mShadowRadius, 0.0f, 0.0f, Color.TRANSPARENT);  
    //Draw the center text
    drawCenterText(canvas, mRadialMenuPaint);

}

and also Manage the X,Y Cordinates on Touch Event to touch Item Menu

  @Override
  public boolean onTouchEvent(MotionEvent event) {
    int x = (int) event.getX();
    int y = (int) event.getY();

    switch (event.getAction()) {
    case MotionEvent.ACTION_DOWN:
        if(mMenuCenterButtonRect.contains(x, y-15)) {
            centerRadialColor = RadialMenuColors.HOLO_LIGHT_BLUE;
            isMenuTogglePressed = true;
            invalidate();
        }
        else if(isMenuVisible) {
            if(mMenuItems.size() > 0) {
                for(SemiCircularRadialMenuItem item : mMenuItems.values()) {
                    if(mMenuRect.contains((int) x+20, (int) y))
                        if(item.getBounds().contains((int) x+20, (int) y)) {
                            System.out.println("get x...> " + x);
                            System.out.println("get y...> " + y);
                            isMenuItemPressed = true;
                            mPressedMenuItemID = item.getMenuID();
                            break;
                        }
                }
                mMenuItems.get(mPressedMenuItemID).setBackgroundColor(mMenuItems.get(mPressedMenuItemID).getMenuSelectedColor());
                invalidate();
            }
        }
        break;
    case MotionEvent.ACTION_UP:
        if(isMenuTogglePressed) {
            centerRadialColor = Color.WHITE;
            if(isMenuVisible) {
                isMenuVisible = false;
                centerMenuText = openMenuText;
            } else {
                isMenuVisible = true;
                centerMenuText = closeMenuText;
            }
            isMenuTogglePressed = false;
            invalidate();
        }

        if(isMenuItemPressed) {
            if(mMenuItems.get(mPressedMenuItemID).getCallback() != null) {
                mMenuItems.get(mPressedMenuItemID).getCallback().onMenuItemPressed();
            }
            mMenuItems.get(mPressedMenuItemID)
                .setBackgroundColor(mMenuItems.get(mPressedMenuItemID).getMenuNormalColor());
            isMenuItemPressed = false;
            invalidate();
        }
        break;
    }

    return true;
}

Hope above code to be helpful..