Class Divider

A visual separator that creates a thematic break between different content sections.

Inheritance
object
CallbackEventHandler
Focusable
VisualElement
BaseVisualElement
Divider
MenuDivider
Implements
Inherited Members
VisualElement.Focus()
VisualElement.Overlaps(Rect)
VisualElement.ToString()
VisualElement.TryGetBinding(BindingId, out Binding)
VisualElement.TryGetDataSourceContext(BindingId, out DataSourceContext)
VisualElement.TryGetLastBindingToUIResult(in BindingId, out BindingResult)
VisualElement.TryGetLastBindingToSourceResult(in BindingId, out BindingResult)
VisualElement.GetFirstOfType<T>()
VisualElement.GetFirstAncestorOfType<T>()
VisualElement.canGrabFocus
VisualElement.focusController
VisualElement.cacheAsBitmap
CallbackEventHandler.RegisterCallback<TEventType>(EventCallback<TEventType>, TrickleDown)
CallbackEventHandler.RegisterCallbackOnce<TEventType>(EventCallback<TEventType>, TrickleDown)
CallbackEventHandler.RegisterCallback<TEventType, TUserArgsType>(EventCallback<TEventType, TUserArgsType>, TUserArgsType, TrickleDown)
CallbackEventHandler.RegisterCallbackOnce<TEventType, TUserArgsType>(EventCallback<TEventType, TUserArgsType>, TUserArgsType, TrickleDown)
CallbackEventHandler.RegisterCallback<TEventType>(EventCallback<TEventType>, CallbackOptions)
CallbackEventHandler.RegisterCallback<TEventType, TUserArgsType>(EventCallback<TEventType, TUserArgsType>, TUserArgsType, CallbackOptions)
CallbackEventHandler.UnregisterCallback<TEventType>(EventCallback<TEventType>, TrickleDown)
CallbackEventHandler.UnregisterCallback<TEventType>(EventCallback<TEventType>, CallbackOptions)
CallbackEventHandler.UnregisterCallback<TEventType, TUserArgsType>(EventCallback<TEventType, TUserArgsType>, TrickleDown)
CallbackEventHandler.UnregisterCallback<TEventType, TUserArgsType>(EventCallback<TEventType, TUserArgsType>, CallbackOptions)
CallbackEventHandler.NotifyPropertyChanged(in BindingId)
Namespace: Unity.AppUI.UI
Assembly: Unity.AppUI.dll
Syntax
[UxmlElement]
public class Divider : BaseVisualElement, IEventHandler, IResolvedStyle, ITransform, ITransitionAnimations, IExperimentalFeatures, IVisualElementScheduler, IContextOverrideElement, IAdditionalDataHolder
Remarks

The Divider component is a thin line that groups content in lists and layouts. Dividers can separate content into clear groups and establish hierarchy, creating visual rhythm and improving content readability.

Dividers can be oriented horizontally or vertically, and their appearance can be customized through size and spacing properties to match your design requirements.

Note: Dividers are non-interactive elements with picking mode set to ignore by default.

Examples

Basic horizontal divider — simple horizontal divider with default properties.

<Divider />

Custom styled divider — customized divider with specific size and spacing.

<Divider direction="Horizontal" size="L" spacing="XL" />

Using dividers in a layout — example of using dividers in a complex layout.

<Box>
    <Text text="Section 1" />
    <Divider spacing="M" />
    <Text text="Section 2" />
    <Box style="flex-direction: row;">
        <Box>
            <Text text="Left Content" />
        </Box>
        <Divider direction="Vertical" size="S" spacing="S" />
        <Box>
            <Text text="Right Content" />
        </Box>
    </Box>
    <Divider spacing="M" />
    <Text text="Section 3" />
</Box>

Constructors

Divider()

Default constructor.

Declaration
public Divider()

Fields

contentUssClassName

The Divider content styling class.

Declaration
public const string contentUssClassName = "appui-divider__content"
Field Value
Type Description
string

sizeUssClassName

The Divider size styling class.

Declaration
public const string sizeUssClassName = "appui-divider--size-"
Field Value
Type Description
string

spacingUssClassName

The Divider spacing styling class.

Declaration
public const string spacingUssClassName = "appui-divider--spacing-"
Field Value
Type Description
string

ussClassName

The Divider main styling class.

Declaration
public const string ussClassName = "appui-divider"
Field Value
Type Description
string

verticalUssClassName

The Divider vertical mode styling class.

Declaration
public const string verticalUssClassName = "appui-divider--"
Field Value
Type Description
string

Properties

contentContainer

The content container of the Divider. This is always null.

Declaration
public override VisualElement contentContainer { get; }
Property Value
Type Description
VisualElement
Overrides

direction

The orientation of the Divider.

Declaration
[CreateProperty]
[UxmlAttribute]
public Direction direction { get; set; }
Property Value
Type Description
Direction

size

The size of the Divider.

Declaration
[CreateProperty]
[UxmlAttribute]
public Size size { get; set; }
Property Value
Type Description
Size

spacing

The spacing of the Divider.

Declaration
[CreateProperty]
[UxmlAttribute]
public Spacing spacing { get; set; }
Property Value
Type Description
Spacing

Methods

GetDirectionUssClassName(Direction)

Declaration
public static string GetDirectionUssClassName(Direction enumValue)
Parameters
Type Name Description
Direction enumValue
Returns
Type Description
string

GetSizeUssClassName(Size)

Declaration
public static string GetSizeUssClassName(Size enumValue)
Parameters
Type Name Description
Size enumValue
Returns
Type Description
string

GetSpacingUssClassName(Spacing)

Declaration
public static string GetSpacingUssClassName(Spacing enumValue)
Parameters
Type Name Description
Spacing enumValue
Returns
Type Description
string

Implements

Extension Methods