Tworzenie pierwszej aplikacji AIR dla systemu iOS

AIR 2.6 lub nowsza wersja, iOS 4.2 lub nowsza wersja

Korzystając wyłącznie z narzędzi firmy Adobe, można pisać kod podstawowych funkcji aplikacji dla systemu iOS oraz tworzyć i testować te funkcje. Aby było możliwe zainstalowanie na urządzeniu aplikacji dla systemu iOS i rozpowszechnienie jej, należy zostać uczestnikiem programu Apple iOS Developer (który jest usługą płatną). Po zostaniu członkiem programu iOS Developer można uzyskiwać dostęp do witryny iOS Provisioning Portal, gdzie można uzyskać od firmy Apple wymienione poniżej elementy oraz pliki, które są wymagane do zainstalowania aplikacji na telefonie w celu jej przetestowania i późniejszego rozpowszechnienia. Tymi elementami i plikami są między innymi:

  • certyfikaty programistów i rozpowszechniania,

  • identyfikatory aplikacji,

  • pliki informacyjne dotyczące programowania i rozpowszechniania.

Tworzenie zawartości aplikacji

Utwórz plik SWF, który spowoduje wyświetlenie tekstu Hello world! (Witaj świecie!). To zadanie można wykonać przy użyciu środowiska Flash Professional, Flash Builder lub innego środowiska programistycznego. W tym przykładzie użyto edytora tekstu i kompilatora SWF wiersza poleceń, który jest częścią zestawu SDK środowiska Flex.

  1. Utwórz w wygodnym miejscu katalog przeznaczony do przechowywania plików aplikacji. Utwórz plik o nazwie HelloWorld.as i przeprowadź edycję tego pliku w ulubionym edytorze kodu.

  2. Dodaj następujący kod:

    package{ 
         
        import flash.display.Sprite; 
        import flash.text.TextField; 
        import flash.text.TextFormat; 
        import flash.text.TextFieldAutoSize; 
         
        public class HelloWorld extends Sprite 
        { 
            public function HelloWorld():void 
            { 
                var textField:TextField = new TextField(); 
                textField.text = "Hello World!"; 
                textField.autoSize = TextFieldAutoSize.LEFT; 
                     
                var format:TextFormat = new TextFormat(); 
                format.size = 48; 
                 
                textField.setTextFormat ( format ); 
                this.addChild( textField ); 
            } 
        } 
    }
  3. Skompiluj klasę za pomocą kompilatora amxmlc.

    amxmlc HelloWorld.as

    W tym samym folderze zostanie utworzony plik SWF o nazwie HelloWorld.swf .

    Uwaga: W tym przykładzie założono, że zmienna środowiskowa ścieżki została skonfigurowana w taki sposób, aby zawierała katalog, w którym znajduje się kompilator amxmlc. Więcej informacji na temat ustawiania ścieżki można znaleźć w sekcji Zmienne środowiskowe ścieżek . Można również wpisać pełną ścieżkę do kompilatora amxmlc i innych narzędzi wiersza poleceń użytych w tym przykładzie.

Tworzenie grafiki ikony i ekranu początkowego aplikacji

Wszystkie aplikacje dla systemu iOS mają ikony pojawiające się w interfejsie użytkownika aplikacji iTunes oraz na wyświetlaczu urządzenia.

  1. Utwórz katalog w katalogu projektu i nadaj mu nazwę icons.

  2. Utwórz trzy pliki PNG w katalogu icons. Nadaj im nazwy: Icon_29.png, Icon_57.png i Icon_512.png.

  3. Zmodyfikuj pliki PNG, aby utworzyć odpowiednie grafiki dla aplikacji. Pliki muszą mieć rozmiary 29 na 29 pikseli, 57 na 57 pikseli oraz 512 na 512 pikseli. Na potrzeby tego testu możesz po prostu użyć jako grafiki kwadratów o jednolitym wypełnieniu.

    Uwaga: Przesyłając aplikację do sklepu Apple App Store, korzysta się z wersji JPG (nie zaś wersji PNG) pliku 512 pikseli. Do testowania wersji roboczych aplikacji używa się wersji PNG.

W trakcie ładowania każdej aplikacji w telefonie iPhone wyświetlany jest ekran początkowy zawierający obraz. Aby zdefiniować obraz powitalny w pliku PNG.

  1. W głównym katalogu na komputerze służącym do programowania utwórz plik PNG o nazwie Default.png. ( Nie należy umieszczać tego pliku w podkatalogu icons. Należy koniecznie nazwać ten plik Default.png; nazwa powinna rozpoczynać się od wielkiej litery.)

  2. Dokonaj edycji pliku, tak aby miał on szerokość 320 pikseli i wysokość 480 pikseli. Tymczasowo treść może stanowić zwykły biały prostokąt. (Zostanie to zmienione później.)

Szczegółowe informacje na temat tych elementów graficznych zawiera sekcja Ikony aplikacji .

Tworzenie pliku deskryptora aplikacji

Utwórz plik deskryptora aplikacji, który określa podstawowe właściwości aplikacji. To zadanie można wykonać przy użyciu edytora tekstu lub środowiska programistycznego takiego jak program Flash Builder.

  1. W folderze projektu zawierającym plik HelloWorld.as utwórz plik XML o nazwie HelloWorld-app.xml . Przeprowadź edycję tego pliku w ulubionym edytorze XML.

  2. Dodaj następujący kod XML:

    <?xml version="1.0" encoding="utf-8" ?> 
    <application xmlns="http://ns.adobe.com/air/application/2.7" minimumPatchLevel="0"> 
        <id>change_to_your_id</id> 
        <name>Hello World iOS</name> 
        <versionNumber>0.0.1</versionNumber> 
        <filename>HelloWorld</filename> 
        <supportedProfiles>mobileDevice</supportedProfiles> 
        <initialWindow> 
            <content>HelloWorld.swf</content> 
            <title>Hello World!</title> 
        </initialWindow> 
        <icon> 
            <image29x29>icons/AIRApp_29.png</image29x29> 
            <image57x57>icons/AIRApp_57.png</image57x57> 
            <image512x512>icons/AIRApp_512.png</image512x512> 
        </icon> 
    </application>

    Ze względu na przejrzystość w tym przykładzie jest ustawianych tylko kilka z dostępnych opcji.

    Uwaga: W przypadku korzystania ze środowiska AIR 2 lub starszego należy użyć elementu <version> zamiast elementu <versionNumber> .
  3. Zmień identyfikator aplikacji w taki sposób, aby był zgodny z identyfikatorem aplikacji określonym w witrynie iOS Provisioning Portal. (Na początku identyfikatora nie należy umieszczać losowej wartości zarodkowej).

  4. Przeprowadź test aplikacji za pomocą narzędzia ADL:

    adl HelloWorld-app.xml -screensize iPhone

    Narzędzie ADL powinno spowodować otwarcie na komputerze okna, w którym zostanie wyświetlony komunikat Hello World! Jeśli tak się nie stanie, poszukaj błędów w kodzie źródłowym i w deskryptorze aplikacji.

Kompilowanie pliku IPA

Teraz można skompilować plik instalatora IPA za pomocą narzędzia ADT. W tym celu należy mieć certyfikat programisty Apple i klucz prywatny w formacie pliku P12, a także programistyczny profil informacyjny Apple.

Należy uruchomić narzędzie ADT przy użyciu poniższych opcji, zastępując wartości keystore, storepass i provisioning-profile własnymi wartościami.

adt -package -target ipa-debug 
    -keystore iosPrivateKey.p12 -storetype pkcs12 -storepass qwerty12 
    -provisioning-profile ios.mobileprovision 
    HelloWorld.ipa 
    HelloWorld-app.xml 
    HelloWorld.swf icons Default.png

(Należy użyć pojedynczego wiersza z poleceniem. Podziały wierszy zostały dodane w tym przykładzie wyłącznie w celu zwiększenia jego czytelności).

Narzędzie ADT wygeneruje w katalogu projektu plik instalatora aplikacji dla systemu iOS, HelloWorld.ipa . Kompilowanie pliku IPA może zająć kilka minut.

Instalowanie aplikacji na urządzeniu

Aby zainstalować aplikację dla systemu iOS w celu przeprowadzenia testów:

  1. Otwórz aplikację iTunes.

  2. Jeśli wcześniej nie wykonano tej czynności, dodaj plik informacyjny na potrzeby tej aplikacji do programu iTunes. W programie iTunes wybierz kolejno opcje Plik > Dodaj do biblioteki. Następnie wybierz plik profilu informacyjnego (dla którego jako typ pliku wybrano mobileprovision).

    Do testowania aplikacji na urządzeniu programisty użyj programistycznego profilu informacyjnego.

    W dalszej części, podczas przekazywania aplikacji do sklepu iTunes Store, użyj profilu dystrybucyjnego. W celu dystrybucji aplikacji ad-hoc (na wiele urządzeń, z wyłączeniem pośrednictwa sklepu iTunes Store), należy użyć profilu informacyjnego ad-hoc.

    Więcej informacji na temat profilów informacyjnych zawiera sekcja Konfiguracja w systemie iOS .

  3. Niektóre wersje iTunes nie dopuszczają do zastępowania aplikacji w sytuacji, gdy ta sama jej wersja jest już zainstalowana. W takim przypadku należy usunąć aplikację z urządzenia oraz z listy aplikacji w iTunes.

  4. Kliknij dwukrotnie plik IPA dla swojej aplikacji. Powinien on pojawić się na liście aplikacji w programie iTunes.

  5. Podłącz urządzenie do portu USB komputera.

  6. W iTunes sprawdź kartę Aplikacja dla urządzenia i upewnij się, że aplikacja została wybrana z listy aplikacji do zainstalowania.

  7. Wybierz urządzenie z listy po lewej stronie aplikacji iTunes. Następnie kliknij przycisk Synchronizacja. Po zakończeniu synchronizacji aplikacja Hello World pojawi się na telefonie iPhone.

Jeśli nowa wersja nie została zainstalowana, usuń ją z urządzenia i z listy aplikacji w programie iTunes, a następnie wykonaj tę procedurę ponownie. Może mieć to miejsce, jeśli obecnie zainstalowana wersja ma ten sam identyfikator aplikacji i numer wersji.

Edycja grafiki ekranu początkowego

Przed skompilowaniem aplikacji utworzony został plik Default.png (patrz Tworzenie grafiki ikony i ekranu początkowego aplikacji ). Obraz zawarty w tym pliku PNG jest wyświetlany w trakcie ładowania aplikacji. Podczas testowania aplikacji na telefonie iPhone można było zaobserwować pusty ekran — to właśnie był obraz początkowy.

Należy teraz zmienić go odpowiednio do potrzeb tworzonej aplikacji („Hello World!”):

  1. Otwórz aplikację na urządzeniu. Po pojawieniu się po raz pierwszy napisu „Hello World” naciśnij i przytrzymaj przycisk Home (poniżej ekranu). Przytrzymując przycisk Home, naciśnij przycisk Power/Sleep (w górnej części telefonu iPhone). Zrzut ekranu zostanie przesłany do folderu Rolka z aparatu.

  2. Prześlij obraz na komputer programisty, wysyłając zdjęcia z programu iPhoto lub innej aplikacji do transferu zdjęć. (W systemie Mac OS można również skorzystać z aplikacji Pobieranie obrazu.)

    Zdjęcie można także przesłać na komputer programisty za pomocą poczty elektronicznej.

    • Otwórz aplikację Zdjęcia.

    • Otwórz Rolkę z aparatu.

    • Otwórz obraz zrzutu ekranu.

    • Stuknij obraz, a następnie przycisk (strzałkę) „dalej” w dolnym lewym rogu. Następnie kliknij przycisk Wyślij zdjęcie (email), aby wysłać obraz do siebie.

  3. Zastąp plik Default.png (w katalogu programistycznym) wersją PNG obrazu zrzutu ekranowego.

  4. Ponownie skompiluj aplikację (zobacz Kompilowanie pliku IPA ) i jeszcze raz zainstaluj ją na urządzeniu.

Podczas ładowania aplikacji jest teraz wyświetlany nowy ekran powitalny.

Uwaga: Możliwe jest utworzenie dowolnej grafiki do zapisania w pliku Default.png; jedynym warunkiem są prawidłowe wymiary (320 na 480 pikseli). Najlepiej jednak by treść pliku Default.png odpowiadała początkowemu stanowi aplikacji.