2010-04-13 4 views
8

Я ищу, чтобы создать радиальное меню в игре, которую я пишу. Есть ли класс или API, включенные для помощи в решении этого или с открытым исходным кодом?Android Radial/Pie Menu

Нечто вроде this.

Спасибо, Джейк

ответ

7

Ниже имеет вид класс 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 Cordinates на сенсорном Событии коснуться пунктов меню

@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

Надежность выше кода будет полезна ..

+0

Очень впечатляющая работа! Я не могу дождаться, чтобы попробовать это! –

2

Там нет встроенный API для таких меню, тем не менее, есть по крайней мере два способа сделать это

1) Построить схему, отображающая «меню» и присоединить его к «FrameLayout» в корне вашего вида Android. Регулируя положение элемента перед тем, как сделать его видимым, вы можете перемещать его вокруг осыпи. Этот метод немного «взломан», но он должен работать.

2) Создайте полностью настраиваемый компонент, включая собственные методы рисования и события onTouch, и прикрепите его к вашему представлению. Этот метод довольно сложный (вам нужно реализовать все методы рисования), но он также несколько более общий.

В любом случае помните, что вам нужно будет рассмотреть, как работает радиальное меню, когда пользователь использует трекбол/d-pad.

+0

Это то, что я предполагал, но я был hopin g пользовательский компонент уже существует. Спасибо за информацию. –

+0

Можете ли вы показать мне, как переместить радиальный салфетки? – AndroidDev