ui::FocusRingStyle¶

Header: winui/render/FocusRing.hpp.

The focus visual's parameters as plain data. Theme::focus_ring_style() builds one from the active theme.

Example:

const ui::Rect     bounds{0, 0, 300, 40};
ui::FocusRingStyle style = theme.focus_ring_style();
// Inside `bounds`: the rings' outer edge on its edge, as the window rings a list row.
ui::draw_focus_ring(renderer, bounds.inset(ui::Thickness{style.outward_extent()}), theme.corner_radius, style);

// Or hand-built, e.g. a high-contrast yellow ring:
const ui::FocusRingStyle hc{
    .kind        = ui::FocusVisual::FluentRings,
    .outer_color = ui::Color::from_rgba(255, 255, 0),
    .inner_color = ui::colors::Black,
};

kind¶

FocusVisual kind = FocusVisual::FluentRings

Which visual draw_focus_ring() draws.

outer_color¶

Color outer_color

Outer ring, or the phase-0 dashes / the dots.

inner_color¶

Color inner_color

Inner ring, or the offset dashes (Metro).

outer_width¶

float outer_width = 2.0f

Outer ring width in DIPs (FluentRings).

inner_width¶

float inner_width = 1.0f

Inner ring width in DIPs (FluentRings).

margin¶

float margin = 3.0f

How far the two-ring band reaches outward: where the outer ring's outer edge lands, not the center of its stroke.

dash_length¶

float dash_length = 1.0f

MetroDashedPair only: draw_dotted_rect()'s own dash_length. Metro uses a 1px dash on a 1px gap.

outward_extent¶

float outward_extent() const

How far outward draw_focus_ring() paints beyond the rect it's given, for this style's kind: margin for the Fluent rings, and zero for ClassicDotted and MetroDashedPair, which draw inside the given rect (see draw_focus_ring()). Insetting a rect by it puts the ring inside the rect in every era (Element::focus_ring_inside()).