KVADRANT UI api reference demo

components

A component library for Compose Multiplatform in the Metro design language — Windows Phone 8 and Windows 8 — with an optional adapter that lets it sit beside androidx.compose.material3.

Every component below was built from a document rather than from a screenshot: the Windows Phone SDK's own template dictionary, its theme resources, and Microsoft's published UX guidelines. Where no public source exists the number is named as such in the component's KDoc and ships as a parameter rather than a constant. Anything the phone did not do is behind KvadrantTheme(remastered = true), which is off by default — that is what keeps the fidelity claim falsifiable.

Press things. Each page below runs the component itself, compiled to WebAssembly from the same sources the library publishes, in both palettes at once. The light theme is not an inversion of the dark one, and putting them side by side is the quickest way to see that.

the sample application, running · the API reference · source · the catalogue, including what has no preview · why the architecture is this

foundation

kvadrantTilt press and hold: the plane leans towards the finger and follows it KvadrantOverscroll drag the list past either end: the content compresses towards the edge rather than sliding off it KvadrantTypography the named styles of a Windows Phone page, at the weights it set them in KvadrantText one string set in the bundled Selawik faces KvadrantAccents the twenty accents Windows Phone 8 shipped, each with its readable ink KvadrantIcons the drawn icon set — no Segoe glyph is in this library KvadrantSurface the chrome colour a panel sits on

controls

KvadrantButton the flat outlined button, and the same one disabled KvadrantTextBox type in it: a light field in both themes, and focus does not bring in the accent KvadrantAutoCompleteBox the field that offers what it thinks you are typing, on a sheet of white in either theme KvadrantPasswordBox the masked field, set in a bullet the bundled font actually has KvadrantToggleSwitch off and on, and one you can move KvadrantCheckBox a square, a tick, and a label that is part of the target KvadrantRadioButton one of three, exclusive KvadrantSlider drag it KvadrantProgressBar a determinate bar over a track at a tenth of the accent KvadrantProgressDots five dots on a 4.4 s cycle — each one switches off the moment it lands

lists and pickers

KvadrantListItem a row with a subtitle, tilting under a press KvadrantLongList grouped rows with the letter headers a jump list lands on KvadrantGroupHeader the accented letter square that opens the jump list KvadrantJumpList the letter grid, with the empty letters dimmed and dead KvadrantListPicker tap to expand in place; six or more items go to a page instead KvadrantListPickerPage the full-mode page a long picker opens KvadrantLoopingSelector a wheel with no ends — scroll past the last value and the first comes round KvadrantPickerPage the surface a looping selector arrives on, tipping in from -50° KvadrantDatePicker three wrapping columns on a picker page, in the order the locale writes a date KvadrantTimePicker hours, minutes and the half of the day, on a twelve-hour clock KvadrantMessageBox the modal, swivelling in over a dimmed page KvadrantToast the notification that slides down from the top of the screen KvadrantContextMenuHost press and hold the row

tiles

KvadrantTile the three sizes, on the gap the Start screen actually used TileRow tiles laid end to end on the tile gap KvadrantTileGrid mixed sizes packed into the Start screen's column grid KvadrantTileBadge the unread count in the corner of a tile KvadrantFlipTile a live tile turning over on its own — the interval is jittered, as the phone's was KvadrantIconicTile the icon-and-count template, with the label at the foot KvadrantCycleTile several faces in rotation rather than two

navigation

KvadrantPage the page frame: application title, page title, and the margins under them KvadrantPageHeader the two lines every Windows Phone page opened with KvadrantPivot swipe sideways: the headers travel at their own rate, and the ends wrap round KvadrantPivotHeaders the header strip on its own, driven by a pager KvadrantPanorama the long horizontal canvas, with its title parallaxing behind the sections KvadrantAppBar four round buttons and a menu — tap the ellipsis KvadrantAppBarButton one circle, drawn rather than filled, at the glyph size the guidelines gave

motion

KvadrantTurnstile the page transition the whole system was built around — tap to play it KvadrantTurnstileFeather the same rotation, staggered per row, which is how a list arrived KvadrantSwivel the dialog's arrival: a rotation about the horizontal axis KvadrantSlide in from an edge, on the phone's own exponential curves KvadrantRoll a rotation about the bottom-left corner KvadrantRotate a plain rotation with a fade, by whatever angle the caller asks for KvadrantScrim the dimmed layer a modal sits on