Documentation
¶
Overview ¶
Package cupertino provides an Apple Human Interface Guidelines (HIG) theme.
The Cupertino theme follows Apple's design language with system blue accent colors, rounded pill-shaped buttons, iOS-style toggle switches for checkboxes, thin auto-hiding scrollbars, sheet-style dialogs, and segmented control tab bars.
Creating a Theme ¶
Create a theme with the default system blue accent:
theme := cupertino.NewTheme() accent := theme.Colors.Accent radius := theme.Radius
Or customize the accent color:
theme := cupertino.NewTheme(cupertino.WithAccentColor(widget.Hex(0x34C759)))
Light and Dark Schemes ¶
Both light and dark themes are available:
lightTheme := cupertino.NewTheme() darkTheme := cupertino.NewDarkTheme()
Component Painters ¶
The package provides painter implementations that render UI components according to Apple HIG specifications. Painters implement the interfaces defined in core packages and can be injected into widgets:
- ButtonPainter implements button.Painter for rounded pill buttons
- CheckboxPainter implements checkbox.Painter for iOS toggle switches
- RadioPainter implements radio.Painter for radio items
- TextFieldPainter implements textfield.Painter for rounded text fields
- DropdownPainter implements dropdown.Painter for dropdown menus
- SliderPainter implements slider.Painter for thin track sliders
- DialogPainter implements dialog.Painter for sheet-style dialogs
- ScrollbarPainter implements scrollview.Painter for thin scrollbars
- TabViewPainter implements tabview.Painter for segmented controls
Example:
btn := button.New(
button.Text("Submit"),
button.PainterOpt(cupertino.ButtonPainter{Theme: cupertinoTheme}),
)
Index ¶
Constants ¶
This section is empty.
Variables ¶
This section is empty.
Functions ¶
This section is empty.
Types ¶
type ButtonPainter ¶
type ButtonPainter struct {
Theme *Theme // nil uses default system blue fallback
}
ButtonPainter renders buttons using Apple HIG design tokens. Cupertino buttons use rounded pill shapes with system blue fills.
Button variants map to iOS styles:
- Filled: rounded rect with accent color fill (primary CTA)
- Outlined: rounded rect with accent color border
- TextOnly: text-only button with accent color text
- Tonal: rounded rect with light accent tint fill
If Theme is nil, ButtonPainter falls back to the default system blue palette.
func (ButtonPainter) PaintButton ¶
func (p ButtonPainter) PaintButton(canvas widget.Canvas, state button.PaintState)
PaintButton renders a button according to Apple HIG specifications.
type CheckboxPainter ¶
type CheckboxPainter struct {
Theme *Theme // nil uses default system blue fallback
}
CheckboxPainter renders checkboxes as iOS-style toggle switches. Instead of the traditional square checkbox, Cupertino uses a pill-shaped toggle switch that slides between on/off states.
The toggle track is a rounded pill. When checked (on), the track fills with the accent color and the thumb knob slides to the right. When unchecked (off), the track shows a gray outline.
If Theme is nil, CheckboxPainter falls back to the default system blue palette.
func (CheckboxPainter) PaintCheckbox ¶
func (p CheckboxPainter) PaintCheckbox(canvas widget.Canvas, state checkbox.PaintState)
PaintCheckbox renders a checkbox as an iOS toggle switch.
type ColorScheme ¶
type ColorScheme struct {
// Accent is the primary tint color (default: System Blue #007AFF).
Accent widget.Color
// OnAccent is the text/icon color on accent backgrounds.
OnAccent widget.Color
// Label is the primary text color.
Label widget.Color
// SecondaryLabel is the color for secondary text.
SecondaryLabel widget.Color
// TertiaryLabel is the color for tertiary text (placeholders).
TertiaryLabel widget.Color
// QuaternaryLabel is the color for quaternary text (disabled).
QuaternaryLabel widget.Color
// SystemBackground is the primary background color.
SystemBackground widget.Color
// SecondarySystemBackground is the grouped/secondary background.
SecondarySystemBackground widget.Color
// TertiarySystemBackground is the elevated/tertiary background.
TertiarySystemBackground widget.Color
// Separator is the color for thin separators.
Separator widget.Color
// OpaqueSeparator is the color for opaque separators.
OpaqueSeparator widget.Color
// SystemFill is the color for thin overlays on interactive elements.
SystemFill widget.Color
// SecondarySystemFill is the color for medium-thick overlays.
SecondarySystemFill widget.Color
// TertiarySystemFill is the color for thick overlays.
TertiarySystemFill widget.Color
// SystemRed is the destructive action color.
SystemRed widget.Color
// SystemGreen is the success/confirmation color.
SystemGreen widget.Color
// SystemOrange is the warning color.
SystemOrange widget.Color
}
ColorScheme holds the Apple HIG color roles for the Cupertino theme.
Apple uses a set of system-defined adaptive colors that automatically adjust between light and dark modes. This struct provides both semantic colors and the full set of system colors.
type DialogPainter ¶
type DialogPainter struct {
Theme *Theme // nil uses default system blue fallback
}
DialogPainter renders dialogs using Apple HIG design tokens. Cupertino dialogs follow the iOS alert/sheet style: rounded corners, grouped background, centered title, and stacked or horizontal action buttons.
If Theme is nil, DialogPainter falls back to the default system blue palette.
func (DialogPainter) PaintDialog ¶
func (p DialogPainter) PaintDialog(canvas widget.Canvas, ps dialog.PaintState)
PaintDialog renders a dialog according to Apple HIG specifications.
type DropdownPainter ¶
type DropdownPainter struct {
Theme *Theme // nil uses default system blue fallback
}
DropdownPainter renders dropdowns using Apple HIG design tokens. Cupertino dropdowns use rounded popover menus with subtle shadows and a chevron indicator following iOS picker conventions.
If Theme is nil, DropdownPainter falls back to the default system blue palette.
func (DropdownPainter) PaintMenu ¶
func (p DropdownPainter) PaintMenu(canvas widget.Canvas, st *dropdown.MenuPaintState)
PaintMenu renders a dropdown menu according to Apple HIG specifications.
func (DropdownPainter) PaintTrigger ¶
func (p DropdownPainter) PaintTrigger(canvas widget.Canvas, st *dropdown.TriggerPaintState)
PaintTrigger renders a dropdown trigger according to Apple HIG specifications.
type Option ¶
type Option func(*themeConfig)
Option configures a Cupertino theme.
func WithAccentColor ¶
WithAccentColor sets the accent (tint) color for the theme. Default is Apple System Blue (#007AFF).
type RadioPainter ¶
type RadioPainter struct {
Theme *Theme // nil uses default system blue fallback
}
RadioPainter renders radio items using Apple HIG design tokens. Cupertino radio buttons use filled circles with accent-colored selection.
If Theme is nil, RadioPainter falls back to the default system blue palette.
func (RadioPainter) PaintRadio ¶
func (p RadioPainter) PaintRadio(canvas widget.Canvas, state radio.PaintState)
PaintRadio renders a radio item according to Apple HIG specifications.
type ScrollbarPainter ¶
type ScrollbarPainter struct {
Theme *Theme // nil uses default fallback
}
ScrollbarPainter renders scrollbars using Apple HIG design tokens. Cupertino scrollbars are very thin (3px), use rounded ends, and appear only during scrolling with a fade-out effect. They overlay content rather than taking up layout space.
If Theme is nil, ScrollbarPainter falls back to the default Cupertino palette.
func (ScrollbarPainter) PaintScrollbar ¶
func (p ScrollbarPainter) PaintScrollbar(canvas widget.Canvas, ps scrollview.PaintState)
PaintScrollbar renders thin Cupertino-style scrollbars.
type SliderPainter ¶
type SliderPainter struct {
Theme *Theme // nil uses default system blue fallback
}
SliderPainter renders sliders using Apple HIG design tokens. Cupertino sliders use a thin track with accent-colored active fill and a white thumb with a subtle shadow, following iOS slider conventions.
If Theme is nil, SliderPainter falls back to the default system blue palette.
func (SliderPainter) PaintSlider ¶
func (p SliderPainter) PaintSlider(canvas widget.Canvas, ps slider.PaintState)
PaintSlider renders a slider according to Apple HIG specifications.
type TabViewPainter ¶
type TabViewPainter struct {
Theme *Theme // nil uses default system blue fallback
}
TabViewPainter renders tab bars as iOS-style segmented controls. Instead of a traditional tab bar with an underline indicator, Cupertino uses a pill-shaped segmented control where the selected segment has a raised white background.
If Theme is nil, TabViewPainter falls back to the default system blue palette.
func (TabViewPainter) PaintTabBar ¶
func (p TabViewPainter) PaintTabBar(canvas widget.Canvas, ps tabview.PaintState)
PaintTabBar renders a segmented control according to Apple HIG specifications.
type TextFieldPainter ¶
type TextFieldPainter struct {
Theme *Theme // nil uses default system blue fallback
}
TextFieldPainter renders text fields using Apple HIG design tokens. Cupertino text fields use a rounded rectangle with a light background and subtle border, following iOS text field conventions.
If Theme is nil, TextFieldPainter falls back to the default system blue palette.
func (TextFieldPainter) PaintTextField ¶
func (p TextFieldPainter) PaintTextField(canvas widget.Canvas, st textfield.PaintState)
PaintTextField renders a text field according to Apple HIG specifications.
type Theme ¶
type Theme struct {
// Colors holds the Cupertino color scheme.
Colors ColorScheme
// Radius is the default corner radius for interactive elements (8-12px).
Radius float32
// contains filtered or unexported fields
}
Theme provides Apple Human Interface Guidelines (HIG) design tokens.
A Theme contains the complete set of design tokens needed to style a Cupertino-style application: colors, corner radius, and font size. It can be generated with customizable accent color using NewTheme.
Create a theme with default system blue:
theme := cupertino.NewTheme() accent := theme.Colors.Accent
Create a dark theme:
darkTheme := cupertino.NewDarkTheme()
Customize accent color:
theme := cupertino.NewTheme(cupertino.WithAccentColor(widget.Hex(0x34C759)))
func NewDarkTheme ¶
NewDarkTheme creates a Cupertino dark theme.
By default it uses Apple System Blue (#007AFF) as the accent color. Use WithAccentColor to customize.
func NewTheme ¶
NewTheme creates a Cupertino light theme.
By default it uses Apple System Blue (#007AFF) as the accent color. Use WithAccentColor to customize.