KIconButton - farimarwat/KrossUi GitHub Wiki

🎯 KIconButton Component Documentation

A platform-aware icon button for Kotlin Multiplatform apps. Provides a customizable button with optional icon and text, supporting both Android and iOS.


🔹 Overview

Element Type Description
KIconButton Composable Clickable button with icon and optional label.

🧩 KIconButton

Definition:
A cross-platform button component that supports displaying an icon and an optional label. Automatically adapts to Android (DrawableResource) and iOS (SF Symbol) icons.

Parameters

Parameter Type Default Description
modifier Modifier Modifier Modifier to style or position the button.
title String? null Optional label to show beside the icon.
onClick () -> Unit Lambda invoked when the button is clicked.
colors KIconButtonColors KIconButtonDefaults.colors() Button and content colors in various states.
fontSize TextUnit KIconButtonDefaults.FontSize Font size for the label text.
cornerRadius Double KIconButtonDefaults.CornerRadius Corner radius for the button shape.
isEnabled Boolean true Enables or disables the button.
iosIcon String? null iOS-specific SF Symbol name (e.g., "star.fill").
androidIcon DrawableResource? null Android-specific drawable resource ID.

🎨 KIconButtonColors

Defines the visual appearance of the button based on its state.

Property Type Description
containerColor Color Background color for the enabled state.
contentColor Color Icon and text color in enabled state.
disabledContainerColor Color Background color when disabled.
disabledContentColor Color Icon/text color when disabled.

🧰 KIconButtonDefaults

Default values used by KIconButton.

Property Type Default Value Description
colors() Function Predefined color set Returns default color scheme.
FontSize TextUnit 14.sp Default font size.
CornerRadius Double 8.0 Default corner radius.

✅ Usage Example

KIconButton(
    modifier = Modifier
        .fillMaxWidth(),
    title = "Favourite",
    iosIcon = "star.fill", // ✅ Use SF Symbols on iOS
    androidIcon = Res.drawable.ic_star, // ✅ Use drawables for Android
    onClick = {
        println("Icon Button Pressed")
    }
)

🔹 Note:

  • On iOS, always use a valid SF Symbol (e.g., "star.fill").
  • On Android, provide a proper drawable resource (e.g., Res.drawable.ic_star).