Free up the possibility of those complex tactics to raise your smartwatch app design and capability to new heights.
In case you’re growing an utility for WearOs you’ve certainly come around the Scaffold appearing the TimeText():
Well, then if that’s the case the information is made only for you! and is made in Jetpack Compose!
To reach the impact you spot above, thus with the ability to create your customized curved textual content on the place of your selection, in Jetpack Compose, you’ll profit from the CurvedLayout with the curvedText.
1. As first you should definitely have the dependencies on your module:
implementation("androidx.put on.compose:compose-material:1.2.1")
implementation("androidx.put on.compose:compose-foundation:1.2.1")
2. Then, create the composable serve as that lets you write the textual content :
@Composable
non-public amusing MyCoolCurvedText(anchor: Drift, colour: Colour, textual content: String) {
CurvedLayout(
anchor = anchor,
anchorType = AnchorType.Middle,
modifier = Modifier.fillMaxSize(),
) {
curvedRow(
) {
curvedText(
textual content = textual content,
taste = CurvedTextStyle(
fontSize = 14.sp,
colour = colour
)
)
}
}
}//required imports:
//import androidx.put on.compose.basis.AnchorType
//import androidx.put on.compose.basis.CurvedLayout
//import androidx.put on.compose.basis.CurvedTextStyle
//import androidx.put on.compose.basis.curvedRow
//import androidx.put on.compose.materials.curvedText
In fact, you’ll customise it on your liking, and put in additional pieces in line with your wishes
3. Use it inside of your UI
magnificence MainActivity : ComponentActivity() {
override amusing onCreate(savedInstanceState: Package deal?) {
tremendous.onCreate(savedInstanceState)
setContent {
Field(Modifier.fillMaxSize()) {
MyCoolCurvedText(
anchor = 0f,
colour = Colour.Pink,
textual content = "Rounded textual content!"
)
MyCoolCurvedText(
anchor = 90f,
colour = Colour.Inexperienced,
textual content = "WearOs nowadays!"
)
MyCoolCurvedText(
anchor = 180f,
colour = Colour.Blue,
textual content = "I am rounded!"
)
MyCoolCurvedText(
anchor = 270f,
colour = Colour.Yellow,
textual content = "Hi devs!"
)
}
}
}
}
And there you’ve got it!
If you have an interest in additional WearOs Jetpack Compose Android pointers let me know within the feedback!