Dock Painters (22 Styles)
Complete catalog of 22 IDockPainter implementations — from AppleDock to DraculaDock — with DockPainterFactory, DockConfig, DockItemState, and DockPainterMetrics
Table of Contents
Overview
The BeepDock control supports 22 distinct visual painter styles, each implementing the IDockPainter interface. Painters control every aspect of dock rendering: background glass/shelf effects, item icons and labels, magnification animation, hover indicators, drag indicators, separators, badges, and hit testing.
Painters are resolved at runtime via DockPainterFactory.GetPainter(dockStyle). The factory returns a singleton instance per style. Key supporting types include DockConfig (layout/behavior properties), DockItemState (per-item visual state), and DockPainterMetrics (computed sizes and bounds).
IDockPainter Contract
Every dock painter implements these 7 core methods:
public interface IDockPainter
{
void PaintDockBackground(Graphics g, Rectangle bounds, DockConfig config);
void PaintDockItem(Graphics g, DockItemState state, DockConfig config);
void PaintIndicator(Graphics g, Rectangle bounds, DockConfig config);
void PaintSeparator(Graphics g, Rectangle bounds, DockConfig config);
Rectangle CalculateItemBounds(int index, DockItemState state, DockConfig config);
Rectangle CalculateDockBounds(Control host, DockConfig config, int itemCount);
int HitTest(Point point, List<Rectangle> itemBounds);
}| Method | Responsibility |
|---|---|
PaintDockBackground | Draws the dock's background surface: glass, acrylic, shelf, frosted, gradient, dark panel |
PaintDockItem | Renders a single dock item: icon, label, badge, hover glow, magnification scale, active indicator |
PaintIndicator | Draws the active-application dot/line/glow indicator below the item |
PaintSeparator | Draws a visual separator between groups of dock items |
CalculateItemBounds | Computes the bounding rectangle for a specific item given its index, state, and config |
CalculateDockBounds | Computes the total dock area based on item count, orientation, and host control size |
HitTest | Determines which item index (if any) is at the given point; returns -1 if no hit |
DockPainterFactory
DockPainterFactory maintains a static Dictionary<DockStyle, IDockPainter> mapping each style enum to its painter instance. The factory is initialized with all 22 painters at startup.
| Member | Signature | Description |
|---|---|---|
GetPainter | static IDockPainter GetPainter(DockStyle style) | Returns the painter for the given style; falls back to AppleDockPainter if style is unrecognized |
Register | static void Register(DockStyle style, IDockPainter painter) | Overrides or adds a painter for a given style (for plugin/extensibility scenarios) |
The DockStyle enum includes all 22 values: Apple, Windows11, iOS, Material3, GNOME, Plank, PlasmaPanel, Neumorphic, Glassmorphism, Cyberpunk, Dracula, Nord, Neon, Minimal, Floating, Bubble, Arc, Terminal, ClassicTaskbar, Pill, Custom, and Default.
DockConfig & DockItemState
DockConfig
DockConfig holds layout and behavior properties that affect all items. It is passed to every painter method.
| Property | Type | Description |
|---|---|---|
DockStyle | DockStyle | Enum identifying the active painter style |
ItemSize | int | Base pixel size of each item (default 48) |
DockHeight | int | Pixel height of the entire dock background |
ItemSpacing | int | Pixels between adjacent items (default 4) |
MaxScale | float | Maximum magnification scale factor for hovered items (default 1.5) |
Position | DockPosition | Screen edge: Bottom, Left, Right, Top |
Orientation | Orientation | Horizontal or Vertical |
Alignment | DockAlignment | Start, Center, or End within the dock area |
IndicatorStyle | IndicatorStyle | Dot, Line, Glow, or None below active items |
AnimationStyle | AnimationStyle | Magnification, Bounce, Pulse, or None on hover |
IconMode | IconMode | IconOnly, IconWithLabel, or LabelOnly |
ShowTooltips | bool | Whether to show tooltips on hover |
ShowBadges | bool | Whether to render notification badges |
DockItemState
DockItemState captures the per-item visual state for a single rendering frame.
| Property | Type | Description |
|---|---|---|
Index | int | Position of this item within the dock |
Bounds | Rectangle | Computed bounding rectangle (from CalculateItemBounds) |
IsHovered | bool | Mouse is over this item |
IsActive | bool | This item's application is the active window |
IsDragging | bool | Item is being dragged (reorder or remove) |
Scale | float | Current animated scale factor (1.0 = normal, up to MaxScale) |
BadgeCount | int | Notification badge number; 0 = no badge |
IconPath | string | File path to the item's icon image |
Label | string | Display text for the item (shown when IconMode includes labels) |
Painter Catalog (22 Total)
| # | Painter Class | Visual Style | Key Features |
|---|---|---|---|
| 1 | AppleDockPainter | macOS Dock | Translucent glass shelf background, magnification zoom animation, active dot indicator, icon bounce on launch |
| 2 | Windows11DockPainter | Windows 11 Taskbar | Centered layout, acrylic blur background, pill-shaped active indicator, rounded corners, Fluent Design System colors |
| 3 | iOSDockPainter | iOS Home Screen Dock | Frosted glass background with blur, rounded-rect icons, subtle shadow, no labels, badge in upper-right |
| 4 | Material3DockPainter | Material Design 3 | Pill-shaped item backgrounds, dynamic color from theme, elevated hover state with surface tint, ripple animation |
| 5 | GNOMEDockPainter | GNOME Shell Dash | Dark semi-transparent panel, minimal icons, left-side dash layout, glowing active dot, subtle separators |
| 6 | PlankDockPainter | Plank (Linux) | Gradient glass shelf, 3D reflection effect, zoom magnification, sharp active triangle indicator |
| 7 | PlasmaPanelPainter | KDE Plasma Panel | Full-width panel with gradient, task-style items with progress bars, icon+label by default, thin active underline |
| 8 | NeumorphicDockPainter | Neumorphism | Soft raised/pressed shadows, pastel color palette, rounded items, inset active indicator, low contrast |
| 9 | GlassmorphismDockPainter | Glassmorphism | Multi-layer glass effect, colorful border glow, frosted background, vibrant hover colors, gradient borders |
| 10 | CyberpunkDockPainter | Cyberpunk / Synthwave | Neon glow borders, dark grid-pattern background, cyan/magenta accents, glitch-style active indicator, terminal font |
| 11 | DraculaDockPainter | Dracula Theme | Dark purple background (#282A36), pink active highlight (#FF79C6), green hover (#50FA7B), consistent Dracula palette |
| 12 | NordDockPainter | Nord Theme | Frost-blue arctic palette (#3B4252, #434C5E), subtle highlights, clean minimal separators, calm aesthetic |
| 13 | NeonDockPainter | Neon / Glow | Intense neon glow effects, dark background, color-cycled hover states, pulsing active indicators, glow blur |
| 14 | MinimalDockPainter | Ultra-Minimal | Nearly invisible background, thin indicator lines only, no labels, flat icons, maximum transparency |
| 15 | FloatingDockPainter | Floating Dock | Rounded pill background detached from screen edge, drop shadow, padding from screen corners, smooth expand/collapse |
| 16 | BubbleDockPainter | Bubble / Circular | Circular item backgrounds, connected by thin line, bubble-pop hover animation, playful rounded aesthetic |
| 17 | ArcDockPainter | Arc Browser | Gradient sidebar-style dock, vertical layout, colorful separator lines, space-themed dark mode, pill highlights |
| 18 | TerminalDockPainter | Terminal / CLI | Monospace terminal aesthetic, dark green-on-black, box-drawing characters for borders, retro computer look |
| 19 | ClassicTaskbarDockPainter | Classic Windows Taskbar | Windows 95/XP-style raised 3D borders, gray gradient, task-style items with labels, flat active state |
| 20 | PillDockPainter | Pill Shape | Long pill-shaped background, each item in a rounded capsule, smooth transitions, compact layout |
Two additional slots exist for Custom (user-provided) and Default (resolves to AppleDockPainter).
Rendering Pipeline
The dock rendering pipeline follows this order each frame:
1. ConfigureAsStyleDock(dockStyle) → sets DockConfig.DockStyle
2. painter = DockPainterFactory.GetPainter(config.DockStyle)
3. painter.CalculateDockBounds(host, config, items.Count)
4. For each item: painter.CalculateItemBounds(i, state, config)
5. painter.PaintDockBackground(g, dockBounds, config)
6. For each item: painter.PaintSeparator(g, sepBounds, config) [if between groups]
7. For each item: painter.PaintDockItem(g, state, config)
8. For each active item: painter.PaintIndicator(g, indicatorBounds, config)The DockPainterMetrics helper computes derived values: total dock width, item spacing, separator positions, magnification zones, and padding. These metrics are cached per-frame and consumed by painters.
Examples
var dock = new BeepDock();
dock.DockStyle = DockStyle.Windows11;
dock.DockStyle = DockStyle.Material3;
dock.Config.AnimationStyle = AnimationStyle.Magnification;
dock.Config.MaxScale = 1.8f;
dock.Config.IconMode = IconMode.IconWithLabel;
dock.DockStyle = DockStyle.Cyberpunk;
dock.Config.ItemSize = 56;
dock.Config.ItemSpacing = 8;
dock.DockStyle = DockStyle.Floating;
dock.Config.DockHeight = 64;
dock.Config.Alignment = DockAlignment.Center;
var item1 = dock.AddItem("browser", "Browser", Color.Cyan);
var item2 = dock.AddItem("terminal", "Terminal", Color.Magenta);
item2.BadgeCount = 3;
dock.DockStyle = DockStyle.Dracula;