Description

Given the following parameters:

• Outer radius
• Inner radius
• Amount of regions
• Starting angle (that second picture starts at 180 degrees)
• Angle drawn (that second picture draws a total of 320 degrees from its starting angle)

How does one calculate the maximal size of the Images to draw so that they remain within their sector? On the left picture, I'm just using a hard-coded value because I haven't specifically been able to think of a nice, general, mathematical equation for that.

More variables could eventually come into play, if I ever decide to expand my library even more. Things such as the width of the separators or of the circumference's outline.

---

Code

This is what I use to draw everything but the children Actors:

/**
 * Takes care of drawing everything that {@link #layout()} didn't.
 * (Basically everything but the children Actors.)
 *
 * @param batch a Batch used to draw Drawables. The {@link #sd} is used to
 *              draw everything else.
 * @param parentAlpha
 */
protected void drawWithShapeDrawer(Batch batch, float parentAlpha) {

    /* Pre-calculating */
    float bgRadian = MathUtils.degreesToRadians*style.totalDegreesDrawn;
    float tmpOffset = MathUtils.degreesToRadians*style.startDegreesOffset;
    int size = getChildren().size;
    float tmpRad = bgRadian / size;

    /* Background image */
    if(style.background != null)
        style.background.draw(batch, getX(), getY(), getWidth(), getHeight());

    /* Rest of background */
    if(style.backgroundColor != null) {
        sd.setColor(style.backgroundColor);
        sd.sector(getX()+style.radius, getY()+style.radius, style.radius-BG_BUFFER, tmpOffset, bgRadian);
    }

    /* Children */
    vector2.set(getX()+style.radius, getY()+style.radius);
    for(int i=0; i<size; i++) {
        float tmp = tmpOffset + i*tmpRad;
        drawChildWithoutSelection(vector2, i, tmp, tmpRad);

        /* Separator */
        drawChildSeparator(vector2, tmp);
    }

    /* The remaining last separator to be drawn */
    drawChildSeparator(vector2, tmpOffset + size*tmpRad);
}

protected void drawChildSeparator(Vector2 vector2, float drawnRadianAngle) {
    if(getChildren().size > 1 && style.separatorColor != null)
        sd.line(pointAtAngle(vector22, vector2, style.innerRadius, drawnRadianAngle),
                pointAtAngle(vector23, vector2, style.radius, drawnRadianAngle),
                style.separatorColor, style.separatorWidth);
}

protected void drawChildWithoutSelection(Vector2 vector2, int index, float startAngle, float radian) {
    if(style.childRegionColor != null) {
        if(style.alternateChildRegionColor != null) {
            sd.setColor(index%2 == 0 ? style.childRegionColor : style.alternateChildRegionColor);
            sd.arc(vector2.x, vector2.y, (style.radius+style.innerRadius)/2, startAngle, radian, style.radius-style.innerRadius);
        } else {
            sd.setColor(style.childRegionColor);
            sd.arc(vector2.x, vector2.y, (style.radius+style.innerRadius)/2, startAngle, radian, style.radius-style.innerRadius);
        }
    }
    drawChildCircumference(vector2, startAngle, radian, style.radius - style.circumferenceWidth/2);
}

protected void drawChildCircumference(Vector2 vector2, float startAngle, float radian, float radius) {
    if(style.circumferenceColor != null && style.circumferenceWidth > 0) {
        sd.setColor(style.circumferenceColor);
        sd.arc(vector2.x, vector2.y, radius, startAngle, radian, style.circumferenceWidth);
    }
}

And this is how I'm laying out those children:

@Override
public void layout() {
    float degreesPerChild = style.totalDegreesDrawn / getChildren().size;
    float half = (float)1 / 2;
    for (int i = 0; i < getChildren().size; i++) {
        Actor actor = getChildren().get(i);
        vector2.set((style.radius+style.innerRadius)/2, 0);
        vector2.rotate(degreesPerChild*(i + half) + style.startDegreesOffset);

        if(actor instanceof Image) { // todo: do this properly !
            actor.setSize(30, 30);
        }
        actor.setPosition(vector2.x+style.radius, vector2.y+style.radius, Align.center);
    }
}

Here is what I ended up doing:

/**
 * Used to estimate the radius of a circle to be constrained within the widget
 * according to the input parameters. Doubling the returned value would give
 * you the size of a contained Actor which would roughly fill most of its
 * sector, or possibly overflow slightly. It is suggested to adjust slightly
 * the returned value by multiplying it with a factor of your choice.<br>
 * It's basically the minimum between 3 different possible radius values
 * based on certain layout properties.
 *
 * @param degreesPerChild the amount of degrees that a child's sector takes.
 * @param actorDistanceFromCenter the distance at which the child Actor is
 *                                positioned from the center of the widget.
 * @return an estimated radius value for an Actor placed with the given
 *         constraints.
 */
public float getEstimatedRadiusAt(float degreesPerChild, float actorDistanceFromCenter) {
    float tmp1 = actorDistanceFromCenter * MathUtils.sinDeg(degreesPerChild/2);
    float tmp2 = getMaxRadius() - actorDistanceFromCenter;
    float tmp3 = actorDistanceFromCenter - getInnerRadiusLength();
    return Math.min(Math.min(tmp1, tmp2), tmp3);
}