Android径向/饼图菜单

时间:2010-04-13 03:56:07

标签: android user-interface

我希望在我正在编写的游戏中创建一个放射状菜单。是否包含一个类或API来协助此解决方案或开源解决方案?

类似于this

谢谢你, 杰克

2 个答案:

答案 0 :(得分:4)

下面有用于绘制径向菜单的View类ondraw()方法..

    @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);

}

并且还管理触摸事件中的X,Y坐标以触摸项目菜单

  @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;
}

enter image description here

希望上面的代码有用..

答案 1 :(得分:2)

此类菜单没有内置API,但至少有两种方法可以做到这一点

1)构建一个代表“菜单”的布局,并将其附加到android视图根目录下的“FrameLayout”。通过在元素可见之前调整元素的位置,您可以将其移动到scree周围。这种方法有点“hacky”,但应该可行。

2)构建一个完全自定义的组件,包括您自己的绘图方法和onTouch事件,并将其附加到您的视图中。这个方法要复杂得多(你需要实现所有的绘图方法),但也有点笼统。

在任何一种情况下,请记住,当用户使用轨迹球/ d-pad时,您需要考虑径向菜单的功能。