DEV Community

Cover image for SDP-SSP-Compose-Multiplatform
Mobile innovation Network
Mobile innovation Network

Posted on • Edited on

2

SDP-SSP-Compose-Multiplatform

A scalable size unit for Compose Multiplatform for Android & iOS App

Installation

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



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

Enter fullscreen mode Exit fullscreen mode




Usage




@Composable
fun App() = AppTheme {
Box(
modifier = Modifier
.statusBarsPadding()
.fillMaxSize()
.background(Color.White),
contentAlignment = Alignment.Center
) {
Card(
modifier = Modifier.fillMaxWidth(0.82f),
shape = RoundedCornerShape(16.sdp),
colors = CardDefaults.cardColors(Color(0xFFFBF3E8)),
) {
Column(
modifier = Modifier.fillMaxWidth(),
horizontalAlignment = Alignment.CenterHorizontally,
) {
Column(
modifier = Modifier
.fillMaxWidth()
.background(Color(0xFF585DDB))
.padding(vertical = 16.sdp),
horizontalAlignment = Alignment.CenterHorizontally,
) {
Image(
modifier = Modifier
.size(80.sdp),
painter = painterResource(Res.drawable.ic_user),
contentDescription = null,
contentScale = ContentScale.FillBounds
)

                Text(
                    text = "Emily Dounger",
                    fontSize = 16.ssp,
                    color = Color.White,
                    fontWeight = FontWeight.Bold,
                    modifier = Modifier.padding(top = 12.sdp)
                )
            }

            Text(
                text = "Hi there \uD83D\uDC4B , We are Boards to share initital Goals and ideas.",
                fontSize = 14.ssp,
                textAlign = TextAlign.Center,
                color = Color.Black,
                lineHeight = 18.ssp,
                fontWeight = FontWeight.Bold,
                modifier = Modifier.padding(top = 30.sdp).padding(horizontal = 20.sdp)
            )

            Button(
                onClick = {},
                colors = ButtonDefaults.buttonColors(Color(0xFF007AFF)),
                modifier = Modifier.padding(top = 24.sdp, bottom = 20.sdp)
                    .padding(horizontal = 20.sdp).fillMaxWidth().height(40.sdp)
            ) {
                Text(text = "Say Hello", fontSize = 16.ssp)
            }
        }
    }
}
Enter fullscreen mode Exit fullscreen mode

}

Enter fullscreen mode Exit fullscreen mode




Android

  • with using dp

Android dp

  • with using sdp

Android sdp

iOS

  • with using dp

iOS dp

  • with using sdp

iOS sdp

Desktop

  • with using sdp

Desktop sdp

https://github.com/ChainTechNetwork/sdp-ssp-compose-multiplatform.git

Happy coding ❤

Connect with us 👇

Sentry mobile image

Mobile Vitals: A first step to Faster Apps

Slow startup times, UI hangs, and frozen frames frustrate users—but they’re also fixable. Mobile Vitals help you measure and understand these performance issues so you can optimize your app’s speed and responsiveness. Learn how to use them to reduce friction and improve user experience.

Read the guide →

Top comments (0)

A Workflow Copilot. Tailored to You.

Pieces.app image

Our desktop app, with its intelligent copilot, streamlines coding by generating snippets, extracting code from screenshots, and accelerating problem-solving.

Read the docs