CtrlK
BlogDocsLog inGet started
Tessl Logo

tessl/maven-org-jetbrains-compose-ui--ui-uikitsimarm64

Compose Multiplatform UI library for iOS Simulator ARM64 target providing declarative UI framework based on Jetpack Compose for multiplatform development

Pending
Overview
Eval results
Files

core-ui.mddocs/

Core UI Foundation

Essential building blocks for all Compose UI applications including the Modifier system, alignment, measurement units, and core interfaces.

Capabilities

Modifier System

The Modifier interface is the primary way to decorate or add behavior to Compose UI elements. Modifiers can be chained together to create complex styling and behavior combinations.

/**
 * An ordered, immutable collection of modifier elements that decorate or add behavior to Compose UI elements.
 */
interface Modifier {
    /**
     * Accumulates a value starting with initial and applying operation to current result and each element.
     */
    fun <R> foldIn(initial: R, operation: (R, Element) -> R): R
    
    /**
     * Accumulates a value starting with initial and applying operation from right to left.
     */
    fun <R> foldOut(initial: R, operation: (Element, R) -> R): R
    
    /**
     * Returns true if any element matches the given predicate.
     */
    fun any(predicate: (Element) -> Boolean): Boolean
    
    /**
     * Returns true if all elements match the given predicate.
     */
    fun all(predicate: (Element) -> Boolean): Boolean
    
    /**
     * Concatenates this modifier with another modifier.
     */
    infix fun then(other: Modifier): Modifier
    
    /**
     * A single Element contained within a Modifier chain.
     */
    interface Element : Modifier {
        override fun <R> foldIn(initial: R, operation: (R, Element) -> R): R
        override fun <R> foldOut(initial: R, operation: (Element, R) -> R): R
        override fun any(predicate: (Element) -> Boolean): Boolean
        override fun all(predicate: (Element) -> Boolean): Boolean
    }
    
    /**
     * The companion object Modifier is the empty, default, or starter Modifier that contains no elements.
     */
    companion object : Modifier {
        override fun <R> foldIn(initial: R, operation: (R, Element) -> R): R
        override fun <R> foldOut(initial: R, operation: (Element, R) -> R): R
        override fun any(predicate: (Element) -> Boolean): Boolean
        override fun all(predicate: (Element) -> Boolean): Boolean
        override infix fun then(other: Modifier): Modifier
    }
}

Usage Examples:

// Basic modifier chaining
Modifier
    .fillMaxWidth()
    .padding(16.dp)
    .background(Color.Blue)
    .clickable { /* action */ }

// Conditional modifiers
val baseModifier = Modifier.fillMaxWidth()
val finalModifier = if (isEnabled) {
    baseModifier.clickable { /* action */ }
} else {
    baseModifier.alpha(0.5f)
}

Alignment System

Provides alignment specifications for positioning elements within containers, supporting both absolute and relative positioning.

/**
 * An interface to calculate the position of a sized box inside an available space.
 */
interface Alignment {
    /**
     * Calculates the position of a box with the given size in the available space.
     */
    fun align(size: IntSize, space: IntSize, layoutDirection: LayoutDirection): IntOffset
    
    /**
     * 2D Alignments for absolute positioning
     */
    interface Horizontal {
        fun align(size: Int, space: Int, layoutDirection: LayoutDirection): Int
    }
    
    interface Vertical {
        fun align(size: Int, space: Int): Int
    }
    
    companion object {
        // 2D alignments
        val TopStart: Alignment
        val TopCenter: Alignment
        val TopEnd: Alignment
        val CenterStart: Alignment
        val Center: Alignment
        val CenterEnd: Alignment
        val BottomStart: Alignment
        val BottomCenter: Alignment
        val BottomEnd: Alignment
        
        // 1D vertical alignments
        val Top: Vertical
        val CenterVertically: Vertical
        val Bottom: Vertical
        
        // 1D horizontal alignments  
        val Start: Horizontal
        val CenterHorizontally: Horizontal
        val End: Horizontal
    }
}

/**
 * BiasAlignment allows positioning with a bias value from -1.0 to 1.0
 */
class BiasAlignment(
    val horizontalBias: Float,
    val verticalBias: Float
) : Alignment {
    class Horizontal(val bias: Float) : Alignment.Horizontal
    class Vertical(val bias: Float) : Alignment.Vertical
}

/**
 * AbsoluteAlignment uses start/end positioning regardless of layout direction
 */
object AbsoluteAlignment {
    val TopLeft: Alignment
    val TopRight: Alignment
    val CenterLeft: Alignment
    val CenterRight: Alignment
    val BottomLeft: Alignment
    val BottomRight: Alignment
    
    val Left: Alignment.Horizontal
    val Right: Alignment.Horizontal
}

Usage Examples:

// In a Box composable
Box(
    modifier = Modifier.size(200.dp),
    contentAlignment = Alignment.Center
) {
    Text("Centered content")
}

// Custom bias alignment
Box(
    modifier = Modifier.fillMaxSize(),
    contentAlignment = BiasAlignment(0.3f, -0.2f)
) {
    Text("Custom positioned")
}

Measurement Units

Density-independent and scalable measurement units for consistent layout across different screen densities and user preferences.

/**
 * Dimension value representing device-independent pixels (dp). 
 */
@JvmInline
value class Dp(val value: Float) : Comparable<Dp> {
    override operator fun compareTo(other: Dp): Int
    operator fun plus(other: Dp): Dp
    operator fun minus(other: Dp): Dp
    operator fun times(other: Float): Dp
    operator fun times(other: Int): Dp
    operator fun div(other: Float): Dp
    operator fun div(other: Int): Dp
    operator fun unaryMinus(): Dp
    
    companion object {
        val Hairline: Dp
        val Infinity: Dp
        val Unspecified: Dp
    }
}

/**
 * Create a Dp using an Int
 */
val Int.dp: Dp

/**
 * Create a Dp using a Double  
 */
val Double.dp: Dp

/**
 * Create a Dp using a Float
 */
val Float.dp: Dp

/**
 * Scalable dimension value representing scalable pixels (sp) for text.
 */
@JvmInline
value class Sp(val value: Float) : Comparable<Sp> {
    override operator fun compareTo(other: Sp): Int
    operator fun plus(other: Sp): Sp
    operator fun minus(other: Sp): Sp
    operator fun times(other: Float): Sp
    operator fun times(other: Int): Sp
    operator fun div(other: Float): Sp
    operator fun div(other: Int): Sp
    operator fun unaryMinus(): Sp
    
    companion object {
        val Unspecified: Sp
    }
}

/**
 * Create an Sp using an Int
 */
val Int.sp: Sp

/**
 * Create an Sp using a Double
 */
val Double.sp: Sp

/**
 * Create an Sp using a Float  
 */
val Float.sp: Sp

/**
 * Represents a unit of text measurement
 */
sealed class TextUnit {
    object Unspecified : TextUnit()
    
    companion object {
        val Unspecified: TextUnit
    }
}

Usage Examples:

// Using dp for layout dimensions
Modifier
    .width(200.dp)
    .height(100.dp)
    .padding(16.dp)

// Using sp for text sizes
TextStyle(fontSize = 16.sp)

// Arithmetic operations
val largeSpacing = 16.dp + 8.dp  // 24.dp
val halfWidth = 100.dp / 2       // 50.dp

Layout Direction

Support for left-to-right (LTR) and right-to-left (RTL) layout directions for internationalization.

/**
 * Layout direction of a UI, either Left to Right or Right to Left.
 */
enum class LayoutDirection {
    Ltr, Rtl
}

/**
 * CompositionLocal providing the current layout direction
 */
val LocalLayoutDirection: ProvidableCompositionLocal<LayoutDirection>

Usage Examples:

// Access current layout direction
val layoutDirection = LocalLayoutDirection.current

// Conditional behavior based on layout direction
val startPadding = if (layoutDirection == LayoutDirection.Ltr) 16.dp else 8.dp
val endPadding = if (layoutDirection == LayoutDirection.Ltr) 8.dp else 16.dp

Core Geometry Types

Essential geometric types for positioning and sizing UI elements.

/**
 * An immutable 2D integer offset.
 */
@Immutable
data class IntOffset(val x: Int, val y: Int) {
    operator fun plus(other: IntOffset): IntOffset
    operator fun minus(other: IntOffset): IntOffset
    operator fun unaryMinus(): IntOffset
    
    companion object {
        val Zero: IntOffset
    }
}

/**
 * An immutable 2D integer size.
 */
@Immutable  
data class IntSize(val width: Int, val height: Int) {
    operator fun times(other: Int): IntSize
    
    companion object {
        val Zero: IntSize
    }
}

/**
 * An immutable 2D floating-point offset.
 */
@Immutable
data class Offset(val x: Float, val y: Float) {
    operator fun plus(other: Offset): Offset
    operator fun minus(other: Offset): Offset
    operator fun times(operand: Float): Offset
    operator fun div(operand: Float): Offset
    operator fun unaryMinus(): Offset
    fun getDistance(): Float
    fun getDistanceSquared(): Float
    
    companion object {
        val Zero: Offset
        val Infinite: Offset
        val Unspecified: Offset
    }
}

/**
 * An immutable 2D floating-point size.  
 */
@Immutable
data class Size(val width: Float, val height: Float) {
    operator fun times(operand: Float): Size
    operator fun div(operand: Float): Size
    
    companion object {
        val Zero: Size
        val Unspecified: Size
    }
}

/**
 * An immutable rectangle.
 */
@Immutable
data class Rect(
    val left: Float,
    val top: Float, 
    val right: Float,
    val bottom: Float
) {
    constructor(offset: Offset, size: Size)
    constructor(topLeft: Offset, bottomRight: Offset)
    
    val width: Float
    val height: Float
    val size: Size
    val center: Offset
    val topLeft: Offset
    val topCenter: Offset
    val topRight: Offset
    val centerLeft: Offset
    val centerRight: Offset
    val bottomLeft: Offset
    val bottomCenter: Offset
    val bottomRight: Offset
    
    fun isEmpty(): Boolean
    fun isFinite(): Boolean
    fun contains(offset: Offset): Boolean
    fun overlaps(other: Rect): Boolean
    fun intersect(other: Rect): Rect
    
    companion object {
        val Zero: Rect
    }
}

Usage Examples:

// Creating positions and sizes
val position = IntOffset(x = 100, y = 50)
val size = IntSize(width = 200, height = 100)

// Floating point geometry
val center = Offset(150.0f, 75.0f)
val bounds = Size(300.0f, 200.0f)

// Rectangle operations
val rect = Rect(
    left = 0.0f,
    top = 0.0f, 
    right = 100.0f,
    bottom = 50.0f
)
val contains = rect.contains(Offset(25.0f, 25.0f)) // true

Density Interface

Interface for converting between different measurement units based on screen density.

/**
 * A density of the screen. Used for the conversions between [Dp] and pixels.
 */
interface Density {
    /**
     * The logical density of the display.
     */
    val density: Float
    
    /**
     * Current user preference for the scaling factor for fonts.
     */
    val fontScale: Float
    
    /**
     * Convert [Dp] to pixels.
     */
    fun Dp.toPx(): Float
    
    /**
     * Convert [Sp] to pixels.
     */
    fun Sp.toPx(): Float
    
    /**
     * Convert pixels to [Dp].
     */
    fun Float.toDp(): Dp
    
    /**
     * Convert pixels to [Sp].
     */
    fun Float.toSp(): Sp
    
    /**
     * Convert [Dp] to [Int] pixels.
     */
    fun Dp.roundToPx(): Int
    
    /**
     * Convert [Sp] to [Int] pixels.
     */
    fun Sp.roundToPx(): Int
}

/**
 * CompositionLocal providing the current density
 */
val LocalDensity: ProvidableCompositionLocal<Density>

Usage Examples:

// Access current density
val density = LocalDensity.current

// Convert between units
with(density) {
    val pixels = 16.dp.toPx()      // Convert dp to pixels
    val dp = 48.0f.toDp()          // Convert pixels to dp
    val textPixels = 14.sp.toPx()   // Convert sp to pixels
}

Install with Tessl CLI

npx tessl i tessl/maven-org-jetbrains-compose-ui--ui-uikitsimarm64

docs

composables.md

core-ui.md

graphics.md

index.md

input.md

ios-integration.md

layout.md

material-design.md

resources.md

state.md

text.md

window.md

tile.json