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

Improving mobile performance, from slow screens to app start time

Based on our experience working with thousands of mobile developer teams, we developed a mobile monitoring maturity curve.

Read more

Top comments (0)

AWS Security LIVE!

Tune in for AWS Security LIVE!

Join AWS Security LIVE! for expert insights and actionable tips to protect your organization and keep security teams prepared.

Learn More

👋 Kindness is contagious

Discover a treasure trove of wisdom within this insightful piece, highly respected in the nurturing DEV Community enviroment. Developers, whether novice or expert, are encouraged to participate and add to our shared knowledge basin.

A simple "thank you" can illuminate someone's day. Express your appreciation in the comments section!

On DEV, sharing ideas smoothens our journey and strengthens our community ties. Learn something useful? Offering a quick thanks to the author is deeply appreciated.

Okay