Evo uiLayout
Radial Layout Group
Arrange UI elements along a circular or arc shaped layout
This page documents Evo UI v1. For the current version, see Evo UI v2. Upgrading? Read the migration guide.
Overview
Radial Layout Group arranges UI elements along a circle or a partial arc. You can configure angles, spacing, radius, direction, child rotation, and size control. It behaves similarly to Unity's built in layout groups but distributes children around a circular path instead of linear rows or columns.
Usage
Add Radial Layout Group component to a RectTransform
Add child UI elements under it
The layout updates automatically when values change
Properties
| Name | Type | Description |
|---|---|---|
radiusScale | float | Scales the calculated base radius (0.1 to 2) |
centerOffset | Vector2 | Shifts the circle's center point |
startAngle | float | Beginning angle of the arc in degrees |
endAngle | float | Ending angle of the arc in degrees |
clockwise | bool | Flips rotation direction |
evenDistribution | bool | Space children evenly across arc range |
customSpacing | float | Angle spacing used only when evenDistribution is disabled |
faceCenter | bool | Rotates each child so it faces inward toward the circle center |
controlChildSize | bool | Automatically applies the defined child size |
childSize | Vector2 | Width and height applied when size control is active |
Code Example
using UnityEngine;
using Evo.UI;
public class RadialLayoutGroupExample : MonoBehaviour
{
public RadialLayoutGroup radial;
void Start()
{
// Base radius scaling
radial.RadiusScale = 1f;
// Create a half circle from -90 to 90 degrees
radial.StartAngle = -90f;
radial.EndAngle = 90f;
// Clockwise or counter clockwise layout
radial.Clockwise = true;
// Even spacing between children
radial.EvenDistribution = true;
// Optional: custom spacing if EvenDistribution is false
radial.CustomSpacing = 30f;
// Align children toward the circle center
radial.FaceCenter = true;
// Control child size from the layout
radial.ControlChildSize = true;
radial.ChildSize = new Vector2(60f, 60f);
// Offset the entire circle slightly upward
radial.CenterOffset = new Vector2(0f, 20f);
}
}