Oluşturmada Görünümleri Kullanma

Compose kullanıcı arayüzüne bir Android View hiyerarşisi ekleyebilirsiniz. Bu yaklaşım özellikle de henüz mevcut olmayan UI öğelerini kullanmak istiyorsanız Oluştur, beğen AdView. Bu yaklaşım, tasarlamış olabileceğiniz özel görünümleri yeniden kullanmanıza da olanak tanır.

Bir görünüm öğesi veya hiyerarşi eklemek için AndroidView composable'dan bahsetmek istiyorum. AndroidView, şunu döndüren bir lambda iletildi: View AndroidView ayrıca bir update sağlar ve ekran genişlediği zaman çağrılan geri çağırmayı kullanın. AndroidView yeniden besteliyor geri çağırma işlevinde bir State okuması her değiştiğinde. AndroidView, benzer pek çok diğer yerleşik composable'lar için kullanılabilecek bir Modifier parametresi alır Örneğin, üst composable'daki konumunu ayarlayın.

@Composable
fun CustomView() {
    var selectedItem by remember { mutableStateOf(0) }

    // Adds view to Compose
    AndroidView(
        modifier = Modifier.fillMaxSize(), // Occupy the max size in the Compose UI tree
        factory = { context ->
            // Creates view
            MyView(context).apply {
                // Sets up listeners for View -> Compose communication
                setOnClickListener {
                    selectedItem = 1
                }
            }
        },
        update = { view ->
            // View's been inflated or state read in this block has been updated
            // Add logic here if necessary

            // As selectedItem is read here, AndroidView will recompose
            // whenever the state changes
            // Example of Compose -> View communication
            view.selectedItem = selectedItem
        }
    )
}

@Composable
fun ContentExample() {
    Column(Modifier.fillMaxSize()) {
        Text("Look at this CustomView!")
        CustomView()
    }
}

Görüntüleme bağlamalı AndroidView

Bir XML düzenini yerleştirmek için AndroidViewBinding androidx.compose.ui:ui-viewbinding kitaplığı tarafından sağlanan API. Alıcı: Bunu yapmak için projenizde görünüm bağlamayı etkinleştirmelisiniz.

@Composable
fun AndroidViewBindingExample() {
    AndroidViewBinding(ExampleLayoutBinding::inflate) {
        exampleView.setBackgroundColor(Color.GRAY)
    }
}

Tembel listelerde AndroidView

Tembel liste içinde bir AndroidView kullanıyorsanız (LazyColumn, LazyRow, Pager vb.) kullanıyorsanız AndroidView kullanabilirsiniz aşırı yüklenmeye yol açtı. Bu aşırı yükleme, Compose'un yeniden içeren bestenin olduğu gibi yeniden kullanıldığında temel View örneği bir örnek verelim.

Bu aşırı AndroidView yüklemesi 2 ek parametre ekler:

  • onReset - View cihazının dolmak üzere olduğunu belirtmek için geri arama çağrıldı yeniden kullanıldı. Görünümü yeniden kullanmayı etkinleştirmek için bu değer boş olmamalıdır.
  • onRelease (isteğe bağlı) - View adlı kullanıcının şu özelliklere sahip olduğunu belirtmek için geri arama çağrıldı: besteden çıkmıştı ve bir daha kullanılmayacak.

@OptIn(ExperimentalComposeUiApi::class)
@Composable
fun AndroidViewInLazyList() {
    LazyColumn {
        items(100) { index ->
            AndroidView(
                modifier = Modifier.fillMaxSize(), // Occupy the max size in the Compose UI tree
                factory = { context ->
                    MyView(context)
                },
                update = { view ->
                    view.selectedItem = index
                },
                onReset = { view ->
                    view.clear()
                }
            )
        }
    }
}

Compose'da parçalar

Compose'da Fragment eklemek için AndroidViewBinding composable'ı kullanın. AndroidViewBinding, parçasını oluşturur.

Bunu, FragmentContainerView içeren bir XML dosyasını şişirerek yapabilirsiniz. Fragment öğesinin sahibi olarak belirleyin.

Örneğin, my_fragment_layout.xml tanımlandıysa şunu kullanabilirsiniz: android:name XML özelliğini Fragment adlı öğrencinin sınıf adı:

<androidx.fragment.app.FragmentContainerView xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/fragment_container_view"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:name="com.example.compose.snippets.interop.MyFragment" />

Bu parçayı Compose'da şu şekilde şişirin:

@Composable
fun FragmentInComposeExample() {
    AndroidViewBinding(MyFragmentLayoutBinding::inflate) {
        val myFragment = fragmentContainerView.getFragment<MyFragment>()
        // ...
    }
}

Aynı düzende birden çok parça kullanmanız gerekiyorsa her FragmentContainerView için benzersiz bir kimlik tanımladı.

Compose'dan Android çerçevesine çağrı yapma

Compose, Android çerçeve sınıfları kapsamında çalışır. Örneğin, (Activity veya Fragment gibi) Android View sınıflarında ve Android Context gibi çerçeve sınıfları, sistem kaynakları, Service veya BroadcastReceiver.

Sistem kaynakları hakkında daha fazla bilgi edinmek için Oluşturma'daki kaynaklar başlıklı makaleyi inceleyin.

Besteciler

CompositionLocal sınıfları, composable işlevler aracılığıyla verilerin dolaylı olarak aktarılmasına olanak tanır. Onlar genellikle kullanıcı arayüzü ağacının belirli bir düğümünde bir değerle sağlanır. Bu değer CompositionLocal beyan edilmeden composable alt öğeleri tarafından kullanılmalıdır composable işleve bir parametre olarak ekleyin.

CompositionLocal, Context, Configuration veya Oluştur öğesinin bulunduğu View gibi kodu, Search Ads 360'a karşılık gelen LocalContext, LocalConfiguration veya LocalView. Daha iyi sonuç için CompositionLocal sınıflarının başında Local öneki olduğunu unutmayın bulunabilir.

current kullanarak mevcut CompositionLocal değerine erişin Örneğin, aşağıdaki kodda Toast.makeToast yöntemine LocalContext.current.

@Composable
fun ToastGreetingButton(greeting: String) {
    val context = LocalContext.current
    Button(onClick = {
        Toast.makeText(context, greeting, Toast.LENGTH_SHORT).show()
    }) {
        Text("Greet")
    }
}

Daha kapsamlı bir örnek için Örnek Olay: BroadcastRecipientrs bölümüne gidin. uygulayacaksınız.

Diğer etkileşimler

İhtiyaç duyduğunuz etkileşim için tanımlanmış bir yardımcı program yoksa, en iyi uygulama genel oluşturma kurallarına uymaktır. veriler aksar, olaylar gelişir (Düşünme ve devam ettirme, girin). Örneğin, bu composable Farklı bir etkinlik başlatır:

class OtherInteractionsActivity : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        // get data from savedInstanceState
        setContent {
            MaterialTheme {
                ExampleComposable(data, onButtonClick = {
                    startActivity(Intent(this, MyActivity::class.java))
                })
            }
        }
    }
}

@Composable
fun ExampleComposable(data: DataExample, onButtonClick: () -> Unit) {
    Button(onClick = onButtonClick) {
        Text(data.title)
    }
}

Örnek olay: Yayın alıcıları

Taşımak veya uygulamak isteyebileceğiniz özelliklerin daha gerçekçi bir örneği için oluşturmak ve CompositionLocal ile tarafı sergilemek için efektleri olsun, diyelim ki BroadcastReceiver kaydının şuralardan yapılması gerekiyor: bir composable işlevdir.

Çözüm, mevcut bağlamı kullanmak için LocalContext özelliğinden yararlanır ve rememberUpdatedState ve DisposableEffect yan etkileri.

@Composable
fun SystemBroadcastReceiver(
    systemAction: String,
    onSystemEvent: (intent: Intent?) -> Unit
) {
    // Grab the current context in this part of the UI tree
    val context = LocalContext.current

    // Safely use the latest onSystemEvent lambda passed to the function
    val currentOnSystemEvent by rememberUpdatedState(onSystemEvent)

    // If either context or systemAction changes, unregister and register again
    DisposableEffect(context, systemAction) {
        val intentFilter = IntentFilter(systemAction)
        val broadcast = object : BroadcastReceiver() {
            override fun onReceive(context: Context?, intent: Intent?) {
                currentOnSystemEvent(intent)
            }
        }

        context.registerReceiver(broadcast, intentFilter)

        // When the effect leaves the Composition, remove the callback
        onDispose {
            context.unregisterReceiver(broadcast)
        }
    }
}

@Composable
fun HomeScreen() {

    SystemBroadcastReceiver(Intent.ACTION_BATTERY_CHANGED) { batteryStatus ->
        val isCharging = /* Get from batteryStatus ... */ true
        /* Do something if the device is charging */
    }

    /* Rest of the HomeScreen */
}

Sonraki adımlar

Artık Görünümler'de Compose'u kullanırken birlikte çalışabilirlik API'lerini öğrendiğinize göre daha fazla bilgi edinmek için Göz önünde bulundurulması gereken diğer noktalar sayfasını inceleyin.

ziyaret edin.