Wenn Sie bereits eine ansichtsbasierte App haben, sollten Sie nicht das gesamte mit der Benutzeroberfläche. Auf dieser Seite erfahren Sie, wie Sie neue Compose-Komponenten zu Ihrem bestehenden App hinzu. Informationen zur Verwendung von „Schreiben“ in Ihrer App finden Sie unter „Schreiben“ einrichten für eine vorhandene App.
Jetpack Compose wurde von Anfang an mit der Interoperabilität von Ansichten entwickelt. Das bedeutet, dass Sie Ihre bestehende ansichtsbasierte App zu „Compose“ migrieren können während Sie gleichzeitig neue Funktionen entwickeln können. Für die Migration zu Compose empfehlen eine schrittweise Migration, bei der die Funktionen "Compose" und "Views" gleichzeitig in Ihrem -Codebasis, bis sich Ihre Anwendung vollständig in Compose befindet.
<ph type="x-smartling-placeholder">![Die Phasen der Migration einer ansichtsbasierten App zu „Compose“](https://developer.android.google.cn/static/develop/ui/compose/images/interop-stages.png?authuser=8&hl=de)
So migrieren Sie Ihre Anwendung zu Compose:
- Mit der Funktion „Schreiben“ neue Bildschirme erstellen
- Identifizieren Sie wiederverwendbare Elemente und eine Bibliothek gängiger UI-Komponenten.
- Vorhandene Funktionen werden nacheinander ersetzt.
Neue Bildschirme mit der Funktion „Schreiben“ erstellen
Am besten verwendest du die Funktion „Schreiben“, um neue Funktionen zu erstellen, die den gesamten Bildschirm abdecken. die Akzeptanz von Compose verbessern können. Mit dieser Strategie können Sie und die Vorteile von „Schreiben“ nutzen und gleichzeitig Unternehmensanforderungen zu erfüllen.
<ph type="x-smartling-placeholder">![Ein neuer Bildschirm in „Compose“](https://developer.android.google.cn/static/develop/ui/compose/images/interop-newscreen.png?authuser=8&hl=de)
Wenn Sie mit der Funktion "Schreiben" neue Bildschirme in Ihrer bestehenden App erstellen, unter den Einschränkungen Ihrer App-Architektur arbeiten. Wenn Sie Fragmente und Navigationskomponente erstellt haben, müssen Sie Fragment und seinen Inhalt in Compose haben.
Wenn Sie die Funktion „Schreiben“ in einem Fragment verwenden möchten, geben Sie ein ComposeView
im
onCreateView()
für Ihr Fragment. ComposeView
hat einen
setContent()
-Methode, mit der Sie eine zusammensetzbare Funktion bereitstellen können.
class NewFeatureFragment : Fragment() { override fun onCreateView( inflater: LayoutInflater, container: ViewGroup?, savedInstanceState: Bundle? ): View { return ComposeView(requireContext()).apply { setViewCompositionStrategy(ViewCompositionStrategy.DisposeOnViewTreeLifecycleDestroyed) setContent { NewFeatureScreen() } } } }
Weitere Informationen finden Sie unter ComposeView in Fragments.
Neue Funktionen in vorhandenen Bildschirmen hinzufügen
<ph type="x-smartling-placeholder">![Ein vorhandener Bildschirm mit gemischten Ansichten und dem Editorfenster](https://developer.android.google.cn/static/develop/ui/compose/images/interop-existingscreen.png?authuser=8&hl=de)
Sie können die Funktion "Schreiben" auch in einem vorhandenen
ansichtsbasierten Bildschirm verwenden,
eines vorhandenen Bildschirms. Fügen Sie dazu ComposeView
zum
Sehen Sie sich die Hierarchie genau wie in jeder anderen Ansicht an.
Angenommen, Sie möchten einem LinearLayout
eine untergeordnete Ansicht hinzufügen. Sie können Folgendes tun:
in XML:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="match_parent" android:layout_height="match_parent"> <TextView android:id="@+id/text" android:layout_width="wrap_content" android:layout_height="wrap_content" /> <androidx.compose.ui.platform.ComposeView android:id="@+id/compose_view" android:layout_width="match_parent" android:layout_height="match_parent" /> </LinearLayout>
Sobald die Ansicht aufgebläht wurde, können Sie später auf die ComposeView
verweisen:
und rufen Sie setContent()
auf.
Weitere Informationen zu ComposeView
finden Sie unter Interoperabilitäts-APIs.
Bibliothek mit gängigen UI-Komponenten erstellen
Wenn Sie mit der Funktion „Schreiben“ neue Funktionen erstellen, werden Sie schnell feststellen, einer Komponentenbibliothek erstellen. Bibliothek mit gängigen UI-Komponenten erstellen ermöglicht es Ihnen, diese Komponenten in Ihrer App über eine zentrale Datenquelle Wiederverwendbarkeit fördern. Von Ihnen erstellte Funktionen können dann von dieser Bibliothek abhängen. Dieses Technik ist besonders nützlich, wenn Sie ein benutzerdefiniertes Designsystem in Schreiben:
Je nach Größe Ihrer App kann diese Bibliothek ein separates Paket, Modul, oder Bibliotheksmodul. Weitere Informationen zum Organisieren von Modulen in Ihrer App finden Sie unter finden Sie im Leitfaden zur Modularisierung von Android-Apps.
Vorhandene Funktionen durch „Schreiben“ ersetzen
Neben der Verwendung von „Schreiben“ zur Entwicklung neuer Funktionen Migrieren Sie vorhandene Funktionen in Ihrer App, um die Funktion „Compose“ nutzen zu können.
Wenn Sie für Ihre App nur Text erstellen, können Sie die Entwicklung beschleunigen und Reduzieren Sie die APK-Größe und die Build-Dauer Ihrer App. Weitere Informationen finden Sie unter „Schreiben“ und „Ansicht“ im Vergleich finden Sie weitere Informationen.
Einfache Bildschirme
Wenn Sie bestehende Funktionen zu „Compose“ migrieren möchten, sollten Sie vor allem auf einfache Bildschirmen. Einfache Bildschirme können ein Begrüßungsbildschirm, ein Bestätigungsbildschirm oder ein Bildschirm, bei dem die in der Benutzeroberfläche angezeigten Daten relativ statisch sind.
Verwenden Sie die folgende XML-Datei:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="match_parent" android:layout_height="match_parent"> <TextView android:id="@+id/title_text" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/title" android:textAppearance="?attr/textAppearanceHeadline2" /> <TextView android:id="@+id/subtitle_text" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/subtitle" android:textAppearance="?attr/textAppearanceHeadline6" /> <TextView android:id="@+id/body_text" android:layout_width="wrap_content" android:layout_height="0dp" android:layout_weight="1" android:text="@string/body" android:textAppearance="?attr/textAppearanceBody1" /> <Button android:id="@+id/confirm_button" android:layout_width="match_parent" android:layout_height="wrap_content" android:text="@string/confirm"/> </LinearLayout>
Die XML-Datei kann in „Compose“ in wenigen Zeilen neu geschrieben werden:
@Composable fun SimpleScreen() { Column(Modifier.fillMaxSize()) { Text( text = stringResource(R.string.title), style = MaterialTheme.typography.headlineMedium ) Text( text = stringResource(R.string.subtitle), style = MaterialTheme.typography.headlineSmall ) Text( text = stringResource(R.string.body), style = MaterialTheme.typography.bodyMedium ) Spacer(modifier = Modifier.weight(1f)) Button(onClick = { /* Handle click */ }, Modifier.fillMaxWidth()) { Text(text = stringResource(R.string.confirm)) } } }
Gemischte Ansicht und Erstellungsbildschirm
Ein Bildschirm, der bereits Texterstellungscode enthält, eignet sich ebenfalls gut. , um vollständig zu Compose zu migrieren. Je nach Komplexität des Bildschirms können Sie sie entweder komplett zu „Compose“ migrieren oder einzeln erstellen. Wenn die in einer Unterstruktur der UI-Hierarchie gestartet wurde, würden Sie fortfahren. Migration von UI-Elementen, bis sich der gesamte Bildschirm im Editorfenster befindet. Dieser Ansatz ist auch als Bottom-up-Ansatz bezeichnet.
<ph type="x-smartling-placeholder">![Bottom-up-Ansatz zur Migration von gemischten Ansichten und der Benutzeroberfläche zum Schreiben zu „Compose“](https://developer.android.google.cn/static/develop/ui/compose/images/interop-animation.gif?authuser=8&hl=de)
Fragmente und Navigationskomponente entfernen
Sie können zu Navigation Compose migrieren, sobald Sie alle Ihre Fragmente und ersetzen Sie sie durch entsprechende zusammensetzbare Funktionen auf Bildschirmebene. Bildschirmebene Zusammensetzbare Funktionen können eine Mischung aus "Verfassen" und "Inhalt ansehen" enthalten, aber alle Navigationsziele müssen zusammensetzbar sein, damit „Navigation Compose“ aktiviert werden kann Migration. Bis dahin sollten Sie Komponente „Fragmentbasierte Navigation“ in der gemischten Komponente „Ansehen“ und „Schreiben“ Codebasis. Siehe Jetpack Navigation zu Navigation Compose migrieren für erhalten Sie weitere Informationen.
Weitere Informationen
In den folgenden zusätzlichen Ressourcen erfahren Sie mehr über die Migration Ihres eine bestehende ansichtsbasierte App auf „Compose“ verwenden:
- Codelab
<ph type="x-smartling-placeholder">
- </ph>
- Zu Jetpack Compose migrieren: Informationen zum Migrieren von Teilen von Sunflower die App „Compose“ in diesem Codelab nutzen.
- Blog posts
<ph type="x-smartling-placeholder">
- </ph>
- Sunflower zu Jetpack Compose migrieren: Weitere Informationen Sunflower wurde mit der auf dieser Seite beschriebenen Strategie zu Compose migriert.
- Jetpack Compose Interop: Compose in einer RecyclerView verwenden:
Hier erfahren Sie, wie Sie die Funktion „Schreiben“ effektiv in einem
RecyclerView
verwenden.
Nächste Schritte
Sie kennen nun die Strategie zur Migration Ihrer ansichtsbasierten App verwenden, finden Sie unter Interoperabilitäts-APIs weitere Informationen.
Empfehlungen für dich
- Hinweis: Der Linktext wird angezeigt, wenn JavaScript deaktiviert ist.
- Die Funktion „Schreiben“ in Views verwenden
- Scrollen
RecyclerView
zur Lazy-Liste migrieren