🅰️ 👆🏼 🦖 Composición Local en Jetpack Compose. ¿Qué es y cómo implementar la localización reactiva de una aplicación que lo usa? 🏇🏽 🤵🏽 🤷🏽

El blog Power in the Technocracy va para los desarrolladores de Android. Vladislav Titov explica cómo lograr una interfaz de usuario ininterrumpida al cambiar la localización.

Cuál es el problema

Trabajar con recursos de cadena en Android se organiza de la siguiente manera:

las cadenas se almacenan como marcado xml en diferentes carpetas de valores
Para obtener una cadena en el código, debe consultar el objeto Contexto.

Context . , , -, Locale Locale.setDefault(), -, Context Locale attachBaseContext(). , UI. ? .

Jetpack Compose , ()

, Compose — .

@Composable
fun Hello() {
    Text(text = "Hello Compose!")
}

. , , . , . :


@Composable
fun Hello() {
    var name = "Compose"
    Text(text = "Hello $name!")
    TextField(
        value = name,
        onValueChanged = { name = it }
    )
}

TextField name, . , . , . Compose , name Text. ?

State — . Compose , , . . , .

@Composable
fun Hello() {
    var name by mutableStateOf("Compose")
    Text(text = "Hello ${name}!")
    TextField(
        value = name,
        onValueChanged = { name = it }
    )
}

mutableStateOf — -builder Composable. MutableState, State, property value. . State , property delegate by ( ). state.value.

(MutableState), . , , , view. , ViewModel, var name by mutableStateOf("Compose") val name by viewModel.nameLiveData.observeAsState(""), onValueChanged = { name = it } onValueChanged = { viewModel.setName(it) }. , var name val name. .

. State , Compose , Composable-. , . , , . , , . :

, Composable, State, . var name by mutableStateOf("Compose") . . , remember:


@Composable
fun Hello() {
    val name by remember { mutableStateOf("Compose") }
    Text(text = "Hello ${name}!")
    TextField(
        value = name,
        onValueChanged = { name = it }
    )
}

Composable “” , . , Composable-.

, Composable side-. - Composable side- . , Composable . , , . .

, , .

CompositionLocal

, , Composable- . . . , . , MyApp , . MyApp .


class MainActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContent {
            val viewModel: MainViewModel = viewModel()
            MyApp(viewModel.user)
        }
    }
}

@Composable
fun MyApp(user: User) {
    UserWidget(user)
}

@Composable
fun UserWidget(user: User) {
    Text(text = user.name)
}

, Composable, .

CompositionLocal. State, , Composable . CompositionLocal Composable. : “ CompositionLocal side-?” - . — .


val ActiveUser = compositionLocalOf<User> { error("No active user found!") }

class MainActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContent {
            val viewModel: MainViewModel = viewModel()
            CompositionLocalProvider(ActiveUser provides viewModel.user) {
                MyApp()
            }
        }
    }
}

@Composable
fun MyApp() {
    UserWidget()
}

@Composable
fun UserWidget() {
    val user = ActiveUser.current
    Text(text = user.name)
}

, - compositionLocalOf CompositionLocal User ActiveUser. trailing User’, , .

- Composable ( , ) CompositionLocal. CompositionLocalProvider(ActiveUser provides viewModel.user) { //contnt }. ActiveUser , , content. user. Provider’. CompositionLocal side-.

CompositionLocal, Composable property CompositionLocal.current. State, Compose , CompositionLocal, Composable. setContent UserWidget, MyApp. , Composable , .

: Context

, , . LocalContext: CompositionLocal Context . , , Jetpack Compose. .

data class Localization(
    val locale: Locale, 
    val strings: MutableMap<String, String> = mutableMapOf()
)

, : , , . .

, :

localizationMap — , O(1), O(n).
supportedLocales
, .

internal val defaultLocalization: Localization = Localization(Locale.ENGLISH)

private val supportedLocales: MutableSet<Locale> = mutableSetOf()

private val localizationMap = hashMapOf<Locale, Localization>()

fun registerSupportedLocales(vararg locales: Locale): Set<Locale> {
    locales.filter { it != Locale.ENGLISH }
        .forEach {
            if (supportedLocales.add(it)) {
                registerLocalizationForLocale(it)
            }
        }
    return supportedLocales + Locale.ENGLISH
}

private fun registerLocalizationForLocale(locale: Locale) {
    localizationMap[locale] = Localization(locale)
}

, , , . . , :

fun Translatable(name: String, defaultValue: String, localeToValue: () -> Map<Locale, String>): Localization.() -> String {
    defaultLocalization.strings[name] = defaultValue
    for ((locale, value) in localeToValue().entries) {
        val localization = localizationMap[locale] ?: throw RuntimeException("There is no locale $locale")
        localization.strings[name] = value
    }
    return fun Localization.(): String {
        return this.strings[name] ?: defaultLocalization.strings[name] ?: throw RuntimeException("There is no string called $name in localization $this")
    }
}

fun NonTranslatable(name: String, defaultValue: String): Localization.() -> String {
    defaultLocalization.strings[name] = defaultValue
    return fun Localization.(): String {
        return defaultLocalization.strings[name] ?: throw RuntimeException("There is no string called $name in localization default")
    }
}

( ):

name — . .

defaultValue — ,

closure localeToValue, -.

: . . extension-, Localization, — .

extension- . , . ? CompositionLocal:

val LocalLocalization = compositionLocalOf { defaultLocalization }

, LocalLocalization object ( MaterialTheme):

object Vocabulary {
    @Composable
    @get:ReadOnlyComposable
    val localization: Localization get() = LocalLocalization.current
}

CompositionLocal:

@Composable
fun Localization(locale: Locale, content: @Composable () -> Unit) {
    CompositionLocalProvider(
        LocalLocalization provides (localizationMap[locale] ?: defaultLocalization),
        children = content
    )
}

val RUSSIAN = Locale("ru")
val TATAR = Locale("tt")

val supportedLocalesNow = registerSupportedLocales(RUSSIAN, TATAR)

val hello = Translatable("hello", "Hello!") {
    hashMapOf(
        RUSSIAN to "!",
        TATAR to "ә!"
    )
}
val nonTrans = NonTranslatable("format", "%1\$d:%2\$02d")

class MainActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContent {
            Localization(locale = TATAR /*smth from supportedLocalesNow*/) {
                val localization = Vocabulary.localization
                Text(text = localization.hello())
                Text(text = localization.nonTrans().format(20, 9))
            }
        }
    }
}