To jest stara wersja strony!


Aplikacje hybrydowe

Wstęp -- WebView

Sencha Touch

Powtórka

  1. Zapoznaj się z kuchennym zlewem¹ Senchy.
  2. Zauważ, że aplikacja nie działa na IceWeasel (Firefox/Thunderbird/Seamonkey/Waterfox/dowolne [żywioł]+[zwierzę]). Wyciągnij wniosek na temat rynku przeglądarek w środowiskach mobilnych.
  3. Otwórz aplikację na różnych urządzeniach/w różnych przeglądarkach bazujących na WebKit; czy dostrzegasz różnice w interfejsie?
  4. Przejrzyj dostępne komponenty i porównaj kod potrzebny do ich implementacji (przycisk 'Source') z natywnym kodem Javy.
    • Jakie są przewagi kodu Senchy?
    • Jeżeli jakieś znalazłeś, zastanów się, czemu rynek jest niezmienne zdominowany przez aplikacje natywne.
    • Przejrzyj alternatywne rozwiązania międzyplatformowe Xamarin, RoboVM. phonegap, C/C++². Czy któreś z nich wydaje się być pozbawione wad Senchy?

¹ Kitchen Sink, used in Software development to denote a permanent, ever growing test and demo environment which showcases all the functionalities of a software product en.wikipedia.org

² blame MS

Ćwiczenia

Stworzenie bazowego projektu

  1. Pobrać i zainstalować Seancha Touch 2 i Cmd
    • sudo apt-get install npm nodejs-legacy
    • Because of a conflict with another package, the executable from the Ubuntu repositories is called nodejs instead of node. Keep this in mind as you are running software.
  2. Następnie, korzystając z linii komend, wygenerować przykładową aplikację:
    sencha -sdk <ścieżka_do_sdk_senchy> generate app <nazwa_aplikacji> <katalog_aplikacji>
  3. Przejrzyj wygenerowaną zawartość i porównaj z opisem zawartości aplikacji

Uruchomienie aplikacji

  1. Podgląd na desktopie
    1. Uruchom serwer Senchy
      sencha fs web -p 8888 start -map <path/to/your/application/folder>
    2. Uruchom w przeglądarce http://localhost:8888
    3. Zmodyfkuj zawartość Pliku app/view/Main.js w elemencie html tak aby aplikacja wyświetlała 'Hello World'
    4. Usuń kartę 'Get Started' i zamiast niej wstaw kartę 'News
    5. Zmień ikonę karty News na info
  2. Uruchomienie w emulatorze
    1. Upewnij się że pluginy cordova i phonegap sa zainstalowane:
      sudo npm install -g cordova
    2. Przygotuj plik konfiguracyjny do budowy natywnej aplikacji
      sencha cordova init re.geist.sencha.hello HelloWorld
    3. Obejrzyj plik app.json i zmodyfikuj poniższy fragment, tak aby możliwe było zbudowanie natywnej aplikacji tylko dla Androida:
      "builds": {
              "web": {"default": true},
              "native": {
                  "packager": "cordova",
                  "cordova" : {
                      "config": {
                          // Uncomment the line below and add the platforms you wish to build for
                          //"platforms": "ios android",
       
                          "id": "re.geist.sencha.hello",
                          "name": "HelloWorld"
                      }
                  }
              }
          },
  3. Uruchomienie na urządzeniu fizycznym

Rozbudowa projektu bazowego

pl/dydaktyka/aml/lab7_2016.1480581914.txt.gz · ostatnio zmienione: 2019/06/27 15:51 (edycja zewnętrzna)
www.chimeric.de Valid CSS Driven by DokuWiki do yourself a favour and use a real browser - get firefox!! Recent changes RSS feed Valid XHTML 1.0