DEV Community

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

Posted on • Edited on

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 👇

Top comments (0)