Herhangi bir Figma çerçeve, grup veya bileşen katmanı, alt öğelerinin dinamik olduğunu belirtmek için bir içerik parametresiyle ek açıklama ekleyebilir. Bu, container bileşenleri tasarlamak veya tasarımda uygulama kodu tarafından özel bileşenlerin yerleştirilebileceği alanlar oluşturmak için kullanılabilir.
Bir çerçeveye veya gruba alt parametre eklemek için Figma'daki katmanı seçin, "Parametreler"in yanındaki + düğmesini tıklayın, ardından menüden children
'yi seçin.
Kullanıcı Arayüzü Paketi Android Studio'ya aktarıldıktan sonra, parametre oluşturulan @Composable
işlev imzasında @Composable
RelayContainerScope.() -> Unit
türünde (bu örnekte customGraphic
olarak adlandırılır) görünür.
@Composable
fun HelloCardWithCustomChild(
modifier: Modifier = Modifier,
customGraphic: @Composable RelayContainerScope.() -> Unit
) {
TopLevel(modifier = modifier) {
Image()
CustomGraphic { customGraphic() }
Title()
}
}
@Preview
işlevinde, alanı doldurmak için Figma dosyasındaki tasarım kullanılır (bu örnekte customGraphic
parametresi ayarlanır).
@Preview(widthDp = 248, heightDp = 265)
@Composable
private fun HelloCardWithCustomChildPreview() {
MaterialTheme {
HelloCardWithCustomChild(
customGraphic = {
RelayText(
content = "Label",
fontSize = 16.0.sp,
fontFamily = montserrat,
color = Color(
alpha = 255,
red = 0,
green = 0,
blue = 0
),
textAlign = TextAlign.Left,
fontWeight = FontWeight(500.0.toInt())
)
RelayImage(
image = painterResource(
R.drawable.hello_card_with_custom_child_custom_graphic_still
),
contentScale = ContentScale.Crop,
modifier =
Modifier.requiredWidth(132.0.dp).requiredHeight(48.0.dp)
)
}
)
}
}
Bir katmana alt öğe parametresi eklemek, katmanı aşağıdaki şekillerde de etkiler:
- Daha önce katmana eklenen Relay parametreleri, Relay for Figma eklentisi kullanıcı arayüzünde görünmez ve oluşturulan kodda kullanılamaz.
- Oluşturulan kodda, katmanın içeriği artık varsayılan olarak oluşturulmaz. Bu, yalnızca önizlemede karşılık gelen composable'ın içeriği haline gelir. composable'ın herhangi bir içeriğe sahip olması için geliştiricinin alt öğe parametresine içerik aktaracak bir kod yazması gerekir.
Sizin için önerilenler
- Not: Bağlantı metni JavaScript kapalıyken görüntülenir
- Düzen oluşturma ile ilgili temel bilgiler
- Parametre ekleme
- Oluşturulabilir önizlemelerle kullanıcı arayüzünüzü önizleme