Skip to content

Chaintech-Network/sdp-ssp-compose-multiplatform

Repository files navigation

SDP-SSP-Compose-Multiplatform

Maven Central Kotlin Compose Multiplatform

badge-android badge-ios badge-desktop badge-desktop

SDP-SSP-Compose-Multiplatform is a scalable size unit library designed specifically for Compose Multiplatform projects. It enables consistent UI scaling across iOS, Android, Desktop, and WebAssembly (Wasm), ensuring a seamless user experience on different screen sizes and resolutions.

This library eliminates the traditional reliance on fixed dp (density-independent pixels) and sp (scale-independent pixels) by introducing sdp (scalable dp) and ssp (scalable sp) units. These units dynamically adjust based on screen density, making layouts more adaptive and ensuring better usability across platforms.

git-banner

🚀 Key Features

Compose Multiplatform Support: Works across Android, iOS, Desktop, and WebAssembly (Wasm).

Adaptive UI Scaling: Uses sdp and ssp to automatically adjust sizes based on screen density.

Easy to Integrate: Simple API that seamlessly integrates with existing Jetpack Compose projects.

Consistent Layouts: Ensures UI consistency across multiple screen sizes and platforms.

No Additional Setup Required: Works out-of-the-box without complex configurations.

📦 Installation

Add the dependency to your build.gradle.kts file:

commonMain.dependencies {
    implementation("network.chaintech:sdp-ssp-compose-multiplatform:1.0.6")
}

⚙️ Customizing the Scaling Ratio

By default, the library uses a scaling ratio of 300 for .sdp and .ssp values. You can change this to fit your design needs using:

SDPConfig.setScalingRatio(250.0) // Set a custom ratio

🎨 Usage

Use sdp and ssp for adaptive and scalable UI components:

val padding = 16.sdp
val fontSize = 14.ssp

Box(modifier = Modifier.padding(padding)) {
    Text(text = "Hello, World!", fontSize = fontSize)
}

This ensures a consistent and adaptive layout across all supported platforms.

📱 Platform-Specific Comparisons

Android

  • Layout built using dp & sp Android-dp-banner

  • Layout built using sdp & ssp Android-sdp-banner

iOS

  • Layout built using dp & sp iOS-dp-banner

  • Layout built using sdp & ssp iOS-sdp-banner

Desktop

  • Layout bulit using sdp & ssp sdp_ssp_desktop_cmp

WasmJs

  • Layout bulit using sdp & ssp sdp_ssp_wasm_cmp

📚 Additional Resources

Demo Implementation - Check out the demo class to see the library in action.

Medium

LinkedIn

🌟 If you find this library useful, consider starring ⭐ the repository to show your support!

About

No description, website, or topics provided.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Contributors 3

  •  
  •  
  •