Compose के यूज़र इंटरफ़ेस (यूआई) में Android व्यू की हैरारकी शामिल की जा सकती है. यह तरीका,
यह सुविधा तब काम आती है, जब आपको ऐसे यूज़र इंटरफ़ेस (यूआई) एलिमेंट इस्तेमाल करने हों जो अभी
लिखें, पसंद करें
AdView
.
इस तरीके से, उन कस्टम व्यू का फिर से इस्तेमाल किया जा सकता है जिन्हें आपने डिज़ाइन किया है.
व्यू एलिमेंट या हैरारकी शामिल करने के लिए, AndroidView
का इस्तेमाल करें
कंपोज़ेबल. AndroidView
को एक Lambda फ़ंक्शन पास किया जाता है, जो
View
. AndroidView
, update
की सुविधा भी देता है
कॉलबैक को तब कॉल किया जाता है, जब व्यू इनफ़्लेट होता है. AndroidView
फिर से काम करता है
जब भी कॉलबैक में State
बदलता है. AndroidView
, जैसे कि कई
अन्य बिल्ट-इन कंपोज़ेबल, एक Modifier
पैरामीटर लेते हैं, जिसका इस्तेमाल
ताकि पैरंट कंपोज़ेबल में इसकी पोज़िशन सेट की जा सके.
@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() } }
व्यू बाइंडिंग के साथ AndroidView
एक्सएमएल लेआउट को एम्बेड करने के लिए,
AndroidViewBinding
एपीआई, जो androidx.compose.ui:ui-viewbinding
लाइब्रेरी से मिला है. यहां की यात्रा पर हूं
ऐसा करने पर, आपके प्रोजेक्ट में व्यू बाइंडिंग चालू होनी चाहिए.
@Composable fun AndroidViewBindingExample() { AndroidViewBinding(ExampleLayoutBinding::inflate) { exampleView.setBackgroundColor(Color.GRAY) } }
लेज़ी लिस्ट में AndroidView
अगर लेज़ी लिस्ट में AndroidView
का इस्तेमाल किया जा रहा है (LazyColumn
, LazyRow
,
Pager
वगैरह), AndroidView
का इस्तेमाल करें
ओवरलोड को 1.4.0-rc01 वर्शन में लॉन्च किया गया है. इस ओवरलोड की वजह से, आप Compose का इस्तेमाल कर सकते हैं
मौजूदा View
इंस्टेंस, जब शामिल कंपोज़िशन को पहले जैसा किया गया हो
लेज़ी लिस्ट के मामले में होता है.
AndroidView
के इस ओवरलोड से दो अतिरिक्त पैरामीटर जुड़ जाते हैं:
onReset
- कॉलबैक का इस्तेमाल करके, यह बताया जाता है किView
फिर से इस्तेमाल किया गया. व्यू का फिर से इस्तेमाल करने के लिए, यह वैल्यू शून्य नहीं होनी चाहिए.onRelease
(ज़रूरी नहीं) - कॉलबैक का इस्तेमाल करके यह बताया जाता है किView
ने कंपोज़िशन से बाहर निकल गया है और उसे फिर से उपयोग नहीं किया जाएगा.
@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 में फ़्रैगमेंट
Compose में Fragment
जोड़ने के लिए, AndroidViewBinding
कंपोज़ेबल का इस्तेमाल करें.
AndroidViewBinding
में फ़्रैगमेंट के हिसाब से हैंडलिंग है, जैसे कि
फ़्रैगमेंट, जब कंपोज़ेबल कंपोज़ेबल को छोड़ता है.
ऐसा करने के लिए, FragmentContainerView
वाले एक्सएमएल को बढ़ाएं
आपके Fragment
के मालिक के तौर पर.
उदाहरण के लिए, अगर आपने my_fragment_layout.xml
तय किया है, तो
इस तरह का कोड android:name
एक्सएमएल एट्रिब्यूट को
Fragment
की क्लास का नाम:
<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" />
इस फ़्रैगमेंट को Compose में इस तरह भरें:
@Composable fun FragmentInComposeExample() { AndroidViewBinding(MyFragmentLayoutBinding::inflate) { val myFragment = fragmentContainerView.getFragment<MyFragment>() // ... } }
अगर आपको एक ही लेआउट में कई फ़्रैगमेंट इस्तेमाल करने हैं, तो पक्का करें कि
हर FragmentContainerView
के लिए यूनीक आईडी तय किया गया है.
Compose का इस्तेमाल करके Android फ़्रेमवर्क को कॉल करना
Compose, Android फ़्रेमवर्क क्लास के तहत काम करता है. उदाहरण के लिए, इसे होस्ट किया गया है
जो Activity
या Fragment
जैसी Android व्यू क्लास में उपलब्ध हैं और Android का इस्तेमाल कर सकती हैं
फ़्रेमवर्क क्लास, जैसे कि Context
, सिस्टम रिसॉर्स,
Service
या BroadcastReceiver
.
सिस्टम के संसाधनों के बारे में ज़्यादा जानने के लिए, Compose में संसाधन देखें.
स्थानीय लोगों की कंपोज़िशन
CompositionLocal
क्लास कंपोज़ेबल फ़ंक्शन के ज़रिए, डेटा को इंप्लिसिट तरीके से पास करने की सुविधा देती हैं. वे खास हैं
आम तौर पर यूज़र इंटरफ़ेस (यूआई) ट्री के किसी खास नोड में मान के साथ दिया जाता है. वह मान ये काम कर सकता है:
CompositionLocal
का एलान किए बिना, इसके कंपोज़ेबल डिसेंडेंट में इसका इस्तेमाल किया जा सकता है
कंपोज़ेबल फ़ंक्शन में पैरामीटर के तौर पर होता है.
CompositionLocal
का इस्तेमाल, अलग-अलग तरह के Android फ़्रेमवर्क के लिए वैल्यू लागू करने के लिए किया जाता है
लिखें, जैसे कि Context
, Configuration
या View
जिसमें लिखें
कोड को संबंधित
LocalContext
,
LocalConfiguration
,
या
LocalView
.
ध्यान दें कि बेहतर तरीके से काम करने के लिए, CompositionLocal
क्लास की शुरुआत Local
से पहले की गई है
IDE में अपने-आप पूरा होने की सुविधा के साथ खोजना.
CompositionLocal
की मौजूदा वैल्यू को ऐक्सेस करने के लिए, उसके current
का इस्तेमाल करें
प्रॉपर्टी. उदाहरण के लिए, नीचे दिया गया कोड
LocalContext.current
, Toast.makeToast
तरीके में.
@Composable fun ToastGreetingButton(greeting: String) { val context = LocalContext.current Button(onClick = { Toast.makeText(context, greeting, Toast.LENGTH_SHORT).show() }) { Text("Greet") } }
बेहतर उदाहरण के लिए, केस स्टडी देखें: इसके आखिर में BroadcastReceivers सेक्शन होते हैं दस्तावेज़.
अन्य इंटरैक्शन
अगर आपकी ज़रूरत के हिसाब से इंटरैक्शन के लिए कोई उपयोगिता तय नहीं की गई है, तो सबसे सही तरीका आपको Compose के सामान्य दिशा-निर्देश का पालन करना होगा. डेटा फ़्लो डाउन, इवेंट फ़्लो अप होता है (इस पर ज़्यादा विस्तार से चर्चा की गई है: सोचना" लिखें). उदाहरण के लिए, इस कंपोज़ेबल कोई अलग गतिविधि लॉन्च करता है:
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) } }
केस स्टडी: ब्रॉडकास्ट रिसीवर
उन सुविधाओं के ज़्यादा असल उदाहरण के लिए जिन्हें आपको माइग्रेट या लागू करना है
लिखें और CompositionLocal
और साइड
इफ़ेक्ट, मान लें कि
BroadcastReceiver
को इससे रजिस्टर करना होगा
सुविधाओं के साथ जोड़ा जा सकता है.
समाधान, मौजूदा संदर्भ का इस्तेमाल करने के लिए LocalContext
का इस्तेमाल करता है और
rememberUpdatedState
और DisposableEffect
के खराब असर.
@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 */ }
अगले चरण
अब आपको व्यू में Compose का इस्तेमाल करने पर इंटरऑपरेबिलिटी एपीआई के बारे में पता है इसके अलावा, ज़्यादा जानने के लिए अन्य ज़रूरी बातें पेज देखें.
आपके लिए सुझाव
- ध्यान दें: JavaScript बंद होने पर लिंक टेक्स्ट दिखता है
- ध्यान देने वाली अन्य बातें
- Compose में साइड-इफ़ेक्ट
- ComposeLocal के साथ स्थानीय तौर पर स्कोप वाला डेटा