Programowanie iteracyjne

Deweloperzy aplikacji mobilnych często tworzą interfejs aplikacji krok po kroku, a nie wszystko naraz. Android Studio wykorzystuje to podejście w Jetpack Compose, udostępniając narzędzia, które nie wymagają pełnej kompilacji do sprawdzania, modyfikowania wartości i weryfikowania ostatecznego wyniku.

Iteracja interfejsu wspomagana przez AI

Możesz używać agenta AI w Android Studio, aby iteracyjnie ulepszać i przekształcać interfejs Compose bezpośrednio z poziomu podglądu projektu. Kliknij prawym przyciskiem podgląd funkcji Compose i wybierz jedną z tych czynności AI:

• Dopasuj interfejs do obrazu docelowego: wybierz, aby przesłać makietę projektu referencyjnego. Następnie agent sugeruje zmiany w kodzie, aby implementacja była jak najbardziej zbliżona do projektu.

• Przekształcanie interfejsu: używaj promptów w języku naturalnym (np. „zmień kolor przycisku na niebieski”), aby opisać konkretne modyfikacje, które chcesz wprowadzić w interfejsie.

Edycja na żywo

Edycja na żywo to funkcja, która umożliwia aktualizowanie funkcji kompozycyjnych w emulatorach i na urządzeniach fizycznych w czasie rzeczywistym. Ta funkcja minimalizuje przełączanie kontekstu między pisaniem a tworzeniem aplikacji, dzięki czemu możesz dłużej skupić się na pisaniu kodu bez przerw.

Edytowanie na żywo ma 3 tryby:

• Ręcznie: zmiany w kodzie są stosowane, gdy zostaną ręcznie przesłane za pomocą skrótu Control+' (Command+' na macOS).
• Ręcznie przy zapisywaniu: zmiany w kodzie są stosowane, gdy zostaną ręcznie zapisane za pomocą skrótu Ctrl + S (Command + S w systemie macOS).
• Automatycznie: zmiany są stosowane na urządzeniu lub w emulatorze po zaktualizowaniu funkcji typu „composable”.

Edycja na żywo skupia się na zmianach kodu związanych z interfejsem i wrażeniami użytkownika. Edytowanie na żywo nie obsługuje zmian takich jak aktualizacje sygnatur metod, dodawanie nowych metod czy zmiany hierarchii klas. Więcej informacji znajdziesz na liście ograniczeń edycji na żywo.

Ta funkcja nie zastępuje kompilowania i uruchamiania aplikacji ani funkcji Apply Changes. Zamiast tego ma on na celu optymalizację przepływu pracy podczas tworzenia, wdrażania i iteracji interfejsu Compose.

Sprawdzony przepływ pracy wygląda tak:

1. Skonfiguruj aplikację, aby można było ją uruchomić.
2. Korzystaj z funkcji Live Edit tak często, jak to możliwe, dopóki nie będziesz potrzebować zmiany, której ona nie obsługuje, np. dodania nowych metod podczas działania aplikacji.
3. Po wprowadzeniu nieobsługiwanej zmiany kliknij Uruchom , aby ponownie uruchomić aplikację i wznowić edycję na żywo.

Pierwsze kroki z funkcją edycji na żywo

Aby rozpocząć, wykonaj te czynności: utwórz pustą aktywność Compose, włącz w projekcie edycję na żywo i wprowadź zmiany za pomocą tej funkcji.

Konfigurowanie nowego projektu

1. Zanim zaczniesz, upewnij się, że masz zainstalowane Android Studio Giraffe lub nowszą wersję oraz że poziom interfejsu API urządzenia fizycznego lub emulatora wynosi co najmniej 30.

2. Otwórz Android Studio i w oknie Witamy w Android Studio wybierz Nowy projekt. Jeśli masz już otwarty projekt, możesz utworzyć nowy, klikając File (Plik) > New (Nowy) > New Project (Nowy projekt).

3. Wybierz szablon Empty Compose Activity (Pusta aktywność tworzenia) dla opcji Phone and Tablet (Telefon i tablet), a następnie kliknij Next (Dalej).

   

4. W oknie Nowy projekt podaj wymagane informacje: nazwę, nazwę pakietu, lokalizację zapisu, minimalną wersję pakietu SDK i język konfiguracji kompilacji.

   

5. Kliknij Zakończ.

Włączanie edycji na żywo

1. Otwórz ustawienia, aby włączyć edytowanie na żywo.

   • W systemie Windows lub Linux kliknij File (Plik) > Settings (Ustawienia) > Editor (Edytor) > Live Edit (Edycja na żywo).
   • W systemie macOS kliknij Android Studio > Ustawienia > Edytor > Edycja na żywo.

2. W ustawieniach wybierz opcję Edytowanie na żywo i tryb, który chcesz uruchomić.

   W trybie ręcznym zmiany kodu są przesyłane za każdym razem, gdy naciśniesz Control+' (Command+' na macOS). W trybie ręcznym przy zapisywaniu zmiany w kodzie są stosowane za każdym razem, gdy ręcznie zapiszesz plik, używając skrótu Control+S (Command+S w systemie macOS). W trybie automatycznym zmiany kodu są stosowane na urządzeniu lub w emulatorze w miarę ich wprowadzania.

   

3. W edytorze otwórz plik MainActivity, który jest punktem wejścia aplikacji.

4. Kliknij Uruchom , aby wdrożyć aplikację.

5. Po włączeniu edycji na żywo w prawym górnym rogu okna narzędzia Uruchomione urządzenia pojawi się zielona ikona potwierdzenia Aktualne:

   

Wprowadzanie i sprawdzanie zmian

Gdy wprowadzasz obsługiwane zmiany w edytorze, wirtualne lub fizyczne urządzenie testowe aktualizuje się automatycznie.

Na przykład zmień istniejącą metodę Greeting w pliku MainActivity na:

@Composable
fun Greeting(name: String) {
    Text(
        text = "Hello $name!",
        Modifier
            .padding(80.dp) // Outer padding; outside background
            .background(color = Color.Cyan) // Solid element background color
            .padding(16.dp) // Inner padding; inside background, around text)
    )
}
IterativeDevelopmentSnippets.kt

Zmiany pojawią się natychmiast na urządzeniu testowym, jak pokazano na rysunku 6.

Rozwiązywanie problemów z edytowaniem na żywo

Jeśli nie widzisz zmian na urządzeniu testowym, Android Studio mogło nie zaktualizować zmian. Sprawdź, czy wskaźnik edycji na żywo ma stan Nieaktualne, jak na rysunku 7, co oznacza błąd kompilacji. Aby uzyskać informacje o błędzie i sugestie, jak go rozwiązać, kliknij wskaźnik.

Ograniczenia edycji na żywo

Poniżej znajdziesz listę aktualnych ograniczeń.

• [Dotyczy tylko Android Studio Giraffe i nowszych wersji] Edycja Live wymaga Compose Runtime w wersji 1.3.0 lub nowszej. Jeśli Twój projekt używa niższej wersji Compose, funkcja Live Edit jest wyłączona.

• [Dotyczy tylko Android Studio Giraffe i nowszych wersji] Edycja na żywo wymaga wtyczki Androida do obsługi Gradle w wersji 8.1.0-alpha05 lub nowszej. Jeśli Twój projekt używa niższej wersji AGP, edycja na żywo jest wyłączona.

• Edytowanie na żywo wymaga urządzenia fizycznego lub emulatora z interfejsem API na poziomie 30 lub wyższym.

• Edycja na żywo obsługuje tylko edytowanie treści funkcji, co oznacza, że nie można zmienić nazwy funkcji ani sygnatury, dodać ani usunąć funkcji ani zmienić pól, które nie są funkcjami.

• Edytowanie na żywo resetuje stan aplikacji przy pierwszej zmianie funkcji Compose w pliku. Dzieje się tak tylko po pierwszej zmianie kodu – stan aplikacji nie jest resetowany przez kolejne zmiany kodu, które wprowadzasz w funkcjach Compose w tym pliku.

• Klasy zmodyfikowane za pomocą edycji na żywo mogą powodować pewne obniżenie wydajności. Uruchom aplikację i użyj czystej kompilacji do publikacji, jeśli oceniasz jej wydajność.

• Aby debuger działał na klasach zmodyfikowanych za pomocą funkcji Live Edit, musisz wykonać pełne uruchomienie.

• Uruchomiona aplikacja może ulec awarii, gdy edytujesz ją za pomocą edycji na żywo. Jeśli tak się stanie, możesz ponownie wdrożyć aplikację za pomocą przycisku Uruchom .

• Edytowanie na żywo nie wykonuje żadnych operacji na kodzie bajtowym zdefiniowanych w pliku kompilacji projektu – na przykład operacji, które zostałyby zastosowane, gdyby projekt został skompilowany za pomocą opcji w menu Kompilacja lub przez kliknięcie przycisku Kompilacja lub Uruchom.

• Funkcje inne niż funkcja typu „composable” są aktualizowane na żywo na urządzeniu lub w emulatorze i wywoływana jest pełna rekompozycja. Pełna rekompozycja może nie wywołać zaktualizowanej funkcji. W przypadku funkcji, które nie są typu „composable”, musisz uruchomić nowo zaktualizowane funkcje lub ponownie uruchomić aplikację.

• Edytowanie na żywo nie jest wznawiane po ponownym uruchomieniu aplikacji. Musisz ponownie uruchomić aplikację.

• Edytowanie na żywo obsługuje tylko procesy z możliwością debugowania.

• Edytowanie na żywo nie obsługuje projektów, które używają niestandardowych wartości moduleName w sekcji kotlinOptions w konfiguracji kompilacji.

• Edytowanie na żywo nie działa w przypadku wdrożeń z wieloma wdrożeniami. Oznacza to, że nie możesz wdrożyć go na jednym urządzeniu, a potem na innym. Edytowanie na żywo jest aktywne tylko na ostatnim zestawie urządzeń, na których wdrożono aplikację.

• Edytowanie na żywo działa w przypadku wdrażania na wielu urządzeniach (wdrożeń na wielu urządzeniach utworzonych za pomocą opcji Wybierz wiele urządzeń w menu urządzenia docelowego). Nie jest to jednak oficjalnie obsługiwane i mogą wystąpić problemy. Jeśli napotkasz problemy, zgłoś je.

• Funkcje Apply Changes i Apply Code Changes nie są zgodne z edytowaniem na żywo i wymagają ponownego uruchomienia działającej aplikacji.

• Edytowanie na żywo nie obsługuje obecnie projektów Android Automotive.

Najczęstsze pytania dotyczące edycji na żywo

• Jaki jest obecny stan funkcji edycji na żywo?

  Funkcja Live Edit jest dostępna w Android Studio Giraffe. Aby ją włączyć, kliknij Plik > Ustawienia > Edytor > Edycja na żywo (Android Studio > Ustawienia > Edytor > Edycja na żywo w systemie macOS).

• Kiedy należy używać edycji na żywo?

  Używaj funkcji Live Edit, gdy chcesz szybko zobaczyć, jak aktualizacje elementów UX (takie jak aktualizacje modyfikatorów i animacje) wpływają na ogólne wrażenia użytkownika aplikacji.

• Kiedy nie należy używać edycji na żywo?

  Edycja na żywo skupia się na zmianach kodu związanych z interfejsem i wrażeniami użytkownika. Nie obsługuje zmian takich jak aktualizacje sygnatur metod, dodawanie nowych metod czy zmiany hierarchii klas. Więcej informacji znajdziesz w sekcji Ograniczenia edycji na żywo.

• Kiedy należy używać funkcji Podgląd tworzenia wiadomości?

  Podczas tworzenia poszczególnych funkcji kompozycyjnych używaj podglądu w Compose. Podgląd wizualizuje elementy Compose i automatycznie odświeża się, aby wyświetlić efekt zmian w kodzie. Podgląd obsługuje też wyświetlanie elementów interfejsu w różnych konfiguracjach i stanach, takich jak ciemny motyw, ustawienia regionalne i skala czcionki.

Iteracyjne tworzenie kodu za pomocą Compose

Edycja na żywo i gorące przeładowanie w Compose Multiplatform to funkcje, które mogą zaoszczędzić czas i zwiększyć produktywność podczas programowania za pomocą Compose. Służą jednak do różnych rodzajów programowania:

• Edytowanie na żywo obsługuje iteracyjne programowanie za pomocą Jetpack Compose w aplikacjach na Androida. Umożliwia aktualizowanie funkcji kompozycyjnych w emulatorach i na urządzeniach fizycznych w czasie rzeczywistym. Ta funkcja minimalizuje przełączanie kontekstu między pisaniem a tworzeniem aplikacji, dzięki czemu możesz dłużej skupić się na pisaniu kodu bez przerw.

• Gorące przeładowanie Compose spełnia tę samą potrzebę, ale obsługuje aplikacje na komputery utworzone za pomocą Compose Multiplatform. Umożliwia wprowadzanie zmian w kodzie interfejsu w aplikacji Compose Multiplatform i wyświetlanie wyników w czasie rzeczywistym dzięki inteligentnemu ponownemu wczytywaniu kodu po każdej zmianie.

Chociaż te 2 funkcje korzystają z wielu technologii w silniku Compose i obsługują wiele podobnych przypadków użycia, nie mają takich samych możliwości, ponieważ dotyczą różnych typów programowania w Compose.

Jeśli tworzysz aplikację na Androida, użyj edycji na żywo, aby przyspieszyć proces programowania. Jeśli tworzysz aplikację na komputery za pomocą Compose Multiplatform, użyj funkcji gorącego przeładowania Compose.

Edycja literałów na żywo (wycofana)

Android Studio może aktualizować w czasie rzeczywistym niektóre stałe literały używane w komponentach kompozycyjnych w podglądach, emulatorze i na urządzeniu fizycznym. Oto kilka obsługiwanych typów:

• Int
• String
• Color
• Dp
• Boolean

Możesz wyświetlać stałe literały, które wywołują aktualizacje w czasie rzeczywistym bez etapu kompilacji, włączając dekoracje literałów za pomocą wskaźnika interfejsu Edycja literałów na żywo:

Apply Changes

Funkcja Apply Changes umożliwia aktualizowanie kodu i zasobów bez konieczności ponownego wdrażania aplikacji w emulatorze lub na urządzeniu fizycznym (z pewnymi ograniczeniami).

Za każdym razem, gdy dodajesz, modyfikujesz lub usuwasz elementy kompozycyjne, możesz zaktualizować aplikację bez konieczności jej ponownego wdrażania, klikając przycisk Zastosuj zmiany w kodzie: