Phase 1 Migration
Common
Design Components
App A App B
App C
Slide 71
Slide 71 text
Common Design Components
● View all compose components
● Document design system
Slide 72
Slide 72 text
airbnb/Showkase
Code ! Issues Pull Requests
Showkase
Compatible with Compose 1.0.4
Showcase 1.0.0-beta12
Showkase is an annotation-processor based Android library that
helps you organize, discover, search and visualize Jetpack
Compose UI elements.
Slide 73
Slide 73 text
Showkase
9:41
App
com.app
General
Logs
Other
Keyline overlay
Slow down animations
Network Activity
Logs
Lifecycle logs
Show UX
Slide 74
Slide 74 text
Showkase
9:41
App
com.app
General
Logs
Other
Keyline overlay
Slow down animations
Network Activity
Logs
Lifecycle logs
Show UX
9:41
Design Components
Components
Colors
Typography
Slide 75
Slide 75 text
Showkase
Compose Design Spec
Generate
Slide 76
Slide 76 text
Showkase
@ShowkaseRoot
class AppRootModule: ShowkaseRootModule
Interop
@Test
fun postViewTest() {
composeTestRule.onNodeWithText("Submit").performClick()
}
Slide 108
Slide 108 text
Interop
@Test
fun postViewTest() {
composeTestRule.onNodeWithText(“Submit").performClick()
Espresso.onView(withText(“Success")).check(matches(isDisplayed()))
}
Slide 109
Slide 109 text
Migration Phase 2
● Migrate medium complexity features
● Setup scaffolding to catch regressions
Slide 110
Slide 110 text
Migration Phases
0% Compose Milestones
Slide 111
Slide 111 text
Migration Phases
● Milestones depend on complexity & code size
● Low Complexity
->
High Complexity
Slide 112
Slide 112 text
Migration Phases
0% Compose Milestones
Testing Infra
Slide 113
Slide 113 text
Internationalization
Slide 114
Slide 114 text
Migration Phases
0% Compose Milestones
Slide 115
Slide 115 text
Languages Support
strings.xml
values-en
values-de
values-fr
strings.xml
strings.xml
Slide 116
Slide 116 text
Languages Support
Add strings
Slide 117
Slide 117 text
Languages Support
Translation service
Add strings
Slide 118
Slide 118 text
Languages Support
Translation service
Provides translated strings
Add strings
Slide 119
Slide 119 text
Languages Support
● Compose language interop
Slide 120
Slide 120 text
adrielcafe/lyricist
Code ! Issues Pull Requests
Lyricist
The missing I18N and L10N multiplatform library for Jetpack
Compose!
Slide 121
Slide 121 text
Languages Support
Strings
(xml)
Types
KSP
Composition
Local
Slide 122
Slide 122 text
Languages Support
strings.xml
values
values-pt
strings.xml
Slide 123
Slide 123 text
Languages Support
Hello world
string>
Avocado
item>
string-array>
%d zero
item>
plurals>
resources>
Slide 124
Slide 124 text
Languages Support
Olá mundo
string>
Abacate
item>
string-array>
%d zero
item>
plurals>
resources>
Slide 125
Slide 125 text
Languages Support
ksp {
arg("lyricist.xml.resourcesPath",
android.sourceSets.main.res.srcDirs.first().absolutePath)
arg("lyricist.xml.moduleName", “xml")
arg("lyricist.xml.defaultLanguageTag", "en")
}
Slide 126
Slide 126 text
Languages Support
data class Strings(
val greeting: String,
val array: List,
val plurals: (quantity: Int)
->
String
)
object Locales {
val En = "en"
val Pt = "pt"
}
Slide 127
Slide 127 text
Languages Support
@Composable
public fun ProvideStrings() {
CompositionLocalProvider(
provider provides lyricist.strings
)
}
Slide 128
Slide 128 text
Languages Support
@Preview
@Composable
fun PostViewPreview() {
val xmlStrings = rememberXmlStrings()
ProvideXmlStrings(xmlStrings) {
Text(text = xmlStrings.greeting)
}
}
Slide 129
Slide 129 text
Languages Support
@Preview
@Composable
fun PostViewPreview() {
val xmlStrings = rememberXmlStrings()
ProvideXmlStrings(xmlStrings) {
Text(text = xmlStrings.greeting)
}
}
Slide 130
Slide 130 text
Languages Support
@Preview
@Composable
fun PostViewPreview() {
val xmlStrings = rememberXmlStrings()
ProvideXmlStrings(xmlStrings) {
Text(text = xmlStrings.greeting)
}
}
Slide 131
Slide 131 text
Languages Support
@Preview
@Composable
fun PostViewPreview()
9:41
Post
Hello World
Slide 132
Slide 132 text
Languages Support
@Preview(locale = “pt”)
@Composable
fun PostViewPreview()
9:41
Post
Olá mundo
Slide 133
Slide 133 text
Migration Phases
0% Compose Milestones
Slide 134
Slide 134 text
Tooling
Slide 135
Slide 135 text
Kotlin Upgrades
This version (1.1.1) of the Compose Compiler requires
Kotlin version 1.6.10 but you appear to be using
Kotlin version 1.6.20 which is not known to be compatible.