Package-level declarations

Types

Link copied to clipboard

The button's defaults, so the one number a caller is likely to want is reachable.

Link copied to clipboard
data class KvadrantDate(val year: Int, val month: Int, val day: Int)

A date, as three numbers, because a picker is a control and not a calendar.

Link copied to clipboard

Which order the three columns of a date picker go in.

Link copied to clipboard

Whether a time picker shows twelve hours and a meridiem column, or twenty-four.

Link copied to clipboard

What a picker does when tapped, which depends only on how many options it has.

Link copied to clipboard

The two inner margins the platform gives a field, which are the only thing that differs.

Link copied to clipboard
data class KvadrantTime(val hour: Int, val minute: Int)

A time of day on a 24-hour clock, whatever cycle the picker shows it on.

Link copied to clipboard

Which way a slide travels.

Link copied to clipboard

The Start screen's tile sizes: 99, 210, and 432×210 Metro pixels.

Properties

Link copied to clipboard

Six seconds. Not Microsoft's number — see the note on KvadrantFlipTile.

Link copied to clipboard
const val DEFAULT_FLIP_JITTER: Float = 0.25f

±25 %, so that no two tiles in a grid turn together.

Link copied to clipboard
const val FULL_MODE_THRESHOLD: Int = 5

More than this many options and the phone opened a page instead of unfolding.

Link copied to clipboard
const val KVADRANT_PASSWORD_MASK: Char = '\u2022'

What a masked character is drawn as, and it is not Silverlight's.

Link copied to clipboard

How long a swivel takes, in and out.

Link copied to clipboard
Link copied to clipboard

How long the turnstile takes, in and out — 350 ms and 250 ms, the original's asymmetry.

Link copied to clipboard
Link copied to clipboard

The glyph box inside a bar button: 26×26 px. Exposed so a caller can size its own icon to it.

Link copied to clipboard
const val MAX_CYCLE_FACES: Int = 9

The platform's own limit.

Link copied to clipboard

Below this many groups the phone did not offer a jump list, because scrolling was quicker.

Functions

Link copied to clipboard
fun daysInMonth(year: Int, month: Int): Int

How many days a Gregorian month has.

Link copied to clipboard

The same dot's visibility: on while it travels, off the moment it lands.

Link copied to clipboard

One dot's journey across the width, as the phone drew it: a third in the first half second, the middle third over the next second and a half, the last third in another half second, then a pause until the cycle comes round. A still cannot show any of this, which is why it is a value a test can sample rather than a literal buried in a composable.

Link copied to clipboard
fun KvadrantAppBar(modifier: Modifier = Modifier, mini: Boolean = false, menuItems: List<String> = emptyList(), onMenuItemClick: (Int) -> Unit = {}, menuExpanded: Boolean = false, onMenuToggle: () -> Unit = {}, cyrillic: FontFamily? = null, buttons: @Composable () -> Unit = {})

The bar along the bottom of a Windows Phone page: at most four circular buttons and an overflow menu, 72 px tall.

Link copied to clipboard
fun KvadrantAppBarButton(onClick: () -> Unit, modifier: Modifier = Modifier, enabled: Boolean = true, label: String? = null, content: @Composable BoxScope.() -> Unit)

One circular button: 48×48 px with a 1.5 px ring, and a 26×26 px space in the middle for a glyph. It tilts, like everything else the theme touches.

Link copied to clipboard
fun KvadrantAutoCompleteBox(value: String, onValueChange: (String) -> Unit, suggestions: List<String>, onSuggestionSelect: (String) -> Unit, modifier: Modifier = Modifier, placeholder: String = "", enabled: Boolean = true, minimumPrefixLength: Int = MINIMUM_PREFIX_LENGTH, maximumSuggestions: Int = Int.MAX_VALUE, filter: (String, String) -> Boolean = ::startsWithIgnoringCase, cyrillic: FontFamily? = null)

A text box that offers what it thinks you are typing, from the Toolkit's AutoCompleteBox.

Link copied to clipboard
fun KvadrantButton(text: String, onClick: () -> Unit, modifier: Modifier = Modifier, enabled: Boolean = true, contentPadding: PaddingValues = KvadrantButtonDefaults.contentPadding, interactionSource: MutableInteractionSource? = null, cyrillic: FontFamily? = null)

A Metro button, from PhoneButtonBase in the SDK's own System.Windows.xaml.

Link copied to clipboard
fun KvadrantCheckBox(checked: Boolean, onCheckedChange: (Boolean) -> Unit, modifier: Modifier = Modifier, label: String? = null, boxSize: Dp = BOX, enabled: Boolean = true, cyrillic: FontFamily? = null)

The phone's check box, from its own System.Windows theme rather than from the shape language.

Link copied to clipboard
fun KvadrantContextMenuHost(expanded: Boolean, items: List<String>, onDismiss: () -> Unit, onItemClick: (Int) -> Unit, modifier: Modifier = Modifier, cyrillic: FontFamily? = null, anchorTop: Dp? = null, anchorHeight: Dp = 0.dp, content: @Composable () -> Unit)

The menu a long press opens, and the page pushed away behind it.

Link copied to clipboard
fun KvadrantCycleTile(faces: List<@Composable BoxScope.() -> Unit>, modifier: Modifier = Modifier, size: TileSize = TileSize.Medium, color: Color = KvadrantTheme.colors.accent, intervalMillis: Long = DEFAULT_FLIP_INTERVAL_MILLIS, jitter: Float = DEFAULT_FLIP_JITTER, seed: Int = 0, onClick: () -> Unit = {})

A tile that cycles through up to nine faces, one sliding up as the next arrives.

Link copied to clipboard
fun KvadrantDatePicker(value: KvadrantDate, onValueChange: (KvadrantDate) -> Unit, modifier: Modifier = Modifier, visible: Boolean = true, order: KvadrantDateOrder = KvadrantDateOrder.forLocale(Locale.current), years: IntRange = value.year - YEAR_REACH..value.year + YEAR_REACH, monthNames: List<String>? = null, dayLabel: String? = null, monthLabel: String? = null, yearLabel: String? = null, visibleCount: Int = DEFAULT_VISIBLE, cyrillic: FontFamily? = null)

The date picker the phone navigated to: a page of tall square columns, one per component of the date, tipping in from -50°.

Link copied to clipboard
fun KvadrantFlipTile(size: TileSize = TileSize.Medium, modifier: Modifier = Modifier, color: Color = KvadrantTheme.colors.accent, intervalMillis: Long = DEFAULT_FLIP_INTERVAL_MILLIS, jitter: Float = DEFAULT_FLIP_JITTER, seed: Int = 0, onClick: () -> Unit = {}, front: @Composable BoxScope.() -> Unit = {}, back: @Composable BoxScope.() -> Unit = {})

A tile that turns over between two faces.

Link copied to clipboard
fun KvadrantGroupHeader(letter: String, modifier: Modifier = Modifier, onClick: () -> Unit? = null, cyrillic: FontFamily? = null)

The letter above a group: accent-coloured, 22 sp SemiLight.

Link copied to clipboard
fun KvadrantIconicTile(modifier: Modifier = Modifier, size: TileSize = TileSize.Medium, color: Color = KvadrantTheme.colors.accent, count: Int = 0, label: String? = null, cyrillic: FontFamily? = null, onClick: () -> Unit = {}, icon: @Composable () -> Unit = {})

The phone's own tile shape: a small icon, a count, and a label along the bottom.

Link copied to clipboard
fun KvadrantJumpList(letters: List<String>, enabled: Set<String>, modifier: Modifier = Modifier, columns: Int = 4, onLetterClick: (String) -> Unit = {}, cyrillic: FontFamily? = null)

The grid of letters a long list jumps from: squares with a 2 px border, the letter at 36 sp SemiBold, and a letter with nothing behind it drawn in the inactive colour rather than hidden — so the alphabet keeps its shape and your thumb lands where it expects to.

Link copied to clipboard
fun KvadrantListItem(title: String, modifier: Modifier = Modifier, subtitle: String? = null, onClick: () -> Unit? = null, cyrillic: FontFamily? = null, titleStyle: TextStyle = KvadrantTheme.typography.normal)

Two lines: the title at 20 px and the second line at 18.667 px in the subtle colour. The whole row is the touch target, and it tilts.

Link copied to clipboard
fun KvadrantListPicker(items: List<String>, selectedIndex: Int, onSelect: (Int) -> Unit, modifier: Modifier = Modifier, expanded: Boolean = false, onExpandRequest: (KvadrantListPickerMode) -> Unit = {}, header: String? = null, cyrillic: FontFamily? = null)

A one-line control that opens into its options — or, past a threshold, into a whole page.

Link copied to clipboard
fun KvadrantListPickerPage(items: List<String>, selectedIndex: Int, onSelect: (Int) -> Unit, modifier: Modifier = Modifier, header: String = "", applicationTitle: String = "", itemStyle: TextStyle = KvadrantTheme.typography.large, cyrillic: FontFamily? = null)

The page a picker with more than five options opens, rather than unfolding in place.

Link copied to clipboard
fun <T> KvadrantLongList(groups: List<Pair<String, List<T>>>, modifier: Modifier = Modifier, onHeaderClick: () -> Unit? = null, cyrillic: FontFamily? = null, item: @Composable (T) -> Unit)

A list broken into groups, each under a letter — the contacts list, the app list, every long list the phone had.

Link copied to clipboard
fun KvadrantLoopingSelector(values: List<String>, selectedIndex: Int, onSelect: (Int) -> Unit, modifier: Modifier = Modifier, label: String? = null, cyrillic: FontFamily? = null)

One column of a date or time picker: a 148×148 px square with a very large number in it.

Link copied to clipboard
fun KvadrantMessageBox(visible: Boolean, title: String, message: String, onConfirm: () -> Unit, modifier: Modifier = Modifier, onCancel: () -> Unit? = null, confirmText: String = "ok", cancelText: String = "cancel", win8ButtonOrder: Boolean = false, cyrillic: FontFamily? = null, dismissOnOutsideClick: Boolean = false)

The phone's message box: a full-width band across the top of the screen, not a floating card.

Link copied to clipboard
fun KvadrantPage(modifier: Modifier = Modifier, applicationTitle: String? = null, pageTitle: String? = null, scrollable: Boolean = true, cyrillic: FontFamily? = null, appBar: @Composable () -> Unit? = null, content: @Composable ColumnScope.() -> Unit)

A Windows Phone page: titles at the top in the content, an application bar at the bottom, and the page margin applied once instead of by every caller.

Link copied to clipboard
fun KvadrantPageHeader(applicationTitle: String, pageTitle: String, modifier: Modifier = Modifier, cyrillic: FontFamily? = null)

The top of a Windows Phone page: a small application title and an oversized page title beneath it, both in the content and both scrolling away with it.

Link copied to clipboard
fun KvadrantPanorama(title: String, modifier: Modifier = Modifier, cyrillic: FontFamily? = null, scroll: ScrollState = rememberScrollState(), background: @Composable (Modifier) -> Unit = {}, sections: List<Pair<String, @Composable () -> Unit>>)

A single surface wider than the screen, panned sideways, with a title too big to fit and a background that drifts behind it.

Link copied to clipboard
fun KvadrantPasswordBox(value: String, onValueChange: (String) -> Unit, modifier: Modifier = Modifier, placeholder: String = "", mask: Char = KVADRANT_PASSWORD_MASK, cyrillic: FontFamily? = null)

A password field that shows the character you just typed, then hides it.

Link copied to clipboard
fun KvadrantPickerPage(visible: Boolean, modifier: Modifier = Modifier, content: @Composable () -> Unit)

The page a picker opens as, and the rotation it opens with: the columns tip in from -50° over 200 ms and leave by rotating to +90° — face-on to edge-on, so the page does not slide away, it turns away.

Link copied to clipboard
fun KvadrantPivot(titles: List<String>, modifier: Modifier = Modifier, title: String? = null, state: PagerState = rememberKvadrantPivotState(titles.size), swipeEnabled: Boolean = true, cyrillic: FontFamily? = null, content: @Composable (page: Int) -> Unit)

The control the rest of this library exists to make possible.

Link copied to clipboard
fun KvadrantPivotHeaders(titles: List<String>, state: PagerState, cyrillic: FontFamily? = null, modifier: Modifier = Modifier)

The header strip.

Link copied to clipboard
fun KvadrantProgressBar(progress: Float, modifier: Modifier = Modifier)

The determinate half of the same ProgressBar template: two 4 px rectangles, one over the other.

Link copied to clipboard
fun KvadrantProgressDots(modifier: Modifier = Modifier, color: Color = KvadrantTheme.colors.accent)

Five squares crossing the width, over and over. After the tilt this is the most recognisable motion Metro has, and an approximation of it reads as a knock-off at once — so the numbers are the published ones: five 4×4 px dots, a 4.4 second cycle, each starting 200 ms after the one before it.

Link copied to clipboard
fun KvadrantRadioButton(selected: Boolean, onClick: () -> Unit, modifier: Modifier = Modifier, label: String? = null, size: Dp = BOX, enabled: Boolean = true, cyrillic: FontFamily? = null)

The phone's radio button: a 32 px ring with a 3 px stroke and a 16 px dot — exactly half — both in the foreground colour, on a transparent fill. Held down it takes KvadrantColors.checkBoxPressed and KvadrantColors.checkBoxPressedBorder — not the accent.

Link copied to clipboard
fun KvadrantRoll(visible: Boolean, modifier: Modifier = Modifier, transformOrigin: TransformOrigin = TransformOrigin(0f, 1f), content: @Composable () -> Unit)

The roll: ninety degrees in two phases rather than one.

Link copied to clipboard
fun KvadrantRotate(visible: Boolean, degrees: Float, modifier: Modifier = Modifier, content: @Composable () -> Unit)

A page turning in its own plane, a quarter or a half turn either way.

Link copied to clipboard
fun KvadrantScrim(modifier: Modifier = Modifier, content: @Composable () -> Unit = {})

Dims what is behind something, at PhoneSemitransparentColor.

Link copied to clipboard
fun KvadrantSlide(visible: Boolean, direction: SlideDirection, modifier: Modifier = Modifier, distance: Dp = SLIDE_DISTANCE, content: @Composable () -> Unit)

A page sliding 200 px in one of four directions.

Link copied to clipboard
fun KvadrantSlider(value: Float, onValueChange: (Float) -> Unit, modifier: Modifier = Modifier, enabled: Boolean = true)

Two bars meeting at the value, from PhoneSlider in the SDK's own System.Windows.xaml.

Link copied to clipboard
fun KvadrantSurface(modifier: Modifier = Modifier, color: Color = KvadrantTheme.colors.chrome, content: @Composable BoxScope.() -> Unit = {})

A flat, rectangular surface in the theme's chrome colour.

Link copied to clipboard
fun KvadrantSwivel(visible: Boolean, modifier: Modifier = Modifier, backward: Boolean = false, content: @Composable () -> Unit)

A page tipping away from you around its top edge.

Link copied to clipboard
fun KvadrantTextBox(value: String, onValueChange: (String) -> Unit, modifier: Modifier = Modifier, placeholder: String = "", enabled: Boolean = true, contentPadding: PaddingValues = KvadrantTextBoxDefaults.ContentPadding, actionIcon: @Composable () -> Unit? = null, onActionIconClick: () -> Unit? = null, actionIconLabel: String? = null, cyrillic: FontFamily? = null)

A Metro text box, from PhoneTextBox in the SDK's own System.Windows.xaml.

Link copied to clipboard
fun KvadrantTile(size: TileSize = TileSize.Medium, modifier: Modifier = Modifier, color: Color = KvadrantTheme.colors.accent, onClick: () -> Unit = {}, interactionSource: MutableInteractionSource? = null, content: @Composable BoxScope.() -> Unit = {})

A Start-screen tile: a flat rectangle of accent colour that tilts towards the finger.

Link copied to clipboard
fun BoxScope.KvadrantTileBadge(count: Int, modifier: Modifier = Modifier)

The counter bubble in a tile's corner.

Link copied to clipboard
fun KvadrantTileGrid(tiles: List<TileSize>, modifier: Modifier = Modifier, columns: Int = COLUMNS, gap: Dp = KvadrantTheme.metrics.tileGap, tile: @Composable (index: Int, size: TileSize) -> Unit)

The Start screen's packing: a four-column grid where a small tile takes one column, a medium two and a wide all four, and each tile drops onto the first row with room for it.

Link copied to clipboard
fun KvadrantTimePicker(value: KvadrantTime, onValueChange: (KvadrantTime) -> Unit, modifier: Modifier = Modifier, visible: Boolean = true, hourCycle: KvadrantHourCycle = KvadrantHourCycle.TwentyFour, minuteStep: Int = 1, meridiemNames: Pair<String, String> = "AM" to "PM", hourLabel: String? = null, minuteLabel: String? = null, visibleCount: Int = DEFAULT_VISIBLE, cyrillic: FontFamily? = null)

The same page with an hour and a minute on it, and a meridiem column when the cycle is twelve.

Link copied to clipboard
fun KvadrantToast(visible: Boolean, title: String, modifier: Modifier = Modifier, message: String? = null, onDismiss: () -> Unit = {}, onClick: () -> Unit? = null, cyrillic: FontFamily? = null)

The notification that slides down from the top and waits ten seconds.

Link copied to clipboard
fun KvadrantToggleSwitch(checked: Boolean, onCheckedChange: (Boolean) -> Unit, modifier: Modifier = Modifier, enabled: Boolean = true)

The Windows Phone toggle, from the Toolkit's own Generic.xaml rather than from its published dimensions — which is the difference between a switch that looks like Metro and one that is it.

Link copied to clipboard
fun KvadrantTurnstile(visible: Boolean, modifier: Modifier = Modifier, content: @Composable () -> Unit)

The page transition Windows Phone is remembered for after the tilt: content swinging in around its left edge like a turnstile.

Link copied to clipboard
fun KvadrantTurnstileFeather(visible: Boolean, index: Int, modifier: Modifier = Modifier, content: @Composable () -> Unit)

A list arriving one row at a time, all of them swinging on the same axis.

Link copied to clipboard

Black or white on the accent, exposed so a caller can label a tile the way the phone did.

Link copied to clipboard

A pager that never reaches an end.

Link copied to clipboard
fun TileRow(modifier: Modifier = Modifier, gap: Dp = KvadrantTheme.metrics.tileGap, content: @Composable () -> Unit)

Tiles in a row with the 12 px gap of the Start screen.