Struktura aplikacji Sencha Touch

Question

Jestem nowym użytkownikiem Sencha Touch i próbuję utworzyć prostą aplikację, która ma formularz logowania i wykonuje połączenia oraz pobiera wyniki na listy.

Moje pytanie brzmi, w jaki sposób powinienem stworzyć strukturę aplikacji? Czy wszystko powinno znajdować się w jednym pliku .html? czy powinienem mieć różne strony dla każdej listy i strony logowania? Jeśli tak, jak mogę zmienić widoki z jednej strony na drugą i uzyskać efekty przejścia?

Answer 1

Zacznij od najprostszej rzeczy i późniejszego refaktora. Właśnie zrobiłem aplikację w Sencha Touch i robi się ona dość oszałamiająca, patrząc na przykładowe pliki. Najłatwiej nauczyłem się, jak stworzyć pojedynczy plik HTML i jak tylko coś stało się nieporęczne lub oczywiście potrzebne do refaktoryzacji, zacząłem tworzyć kolejne pliki.

Answer 2

Rozbiłbym go według ważnej funkcji (tj. Celu). W przypadku aplikacji mobilnych możesz uniknąć niepotrzebnych postbacks/wczytywania wielu stron i wyświetleń, jeśli możesz pomóc.

Jeśli twoja aplikacja mobilna ma jeden cel, zatrzymałbym ją na jednej stronie html i rozpakowywałam tylko pliki JavaScript tak, jak potrzebujesz, aby zachować porządek.

Jeśli ma dwa cele (np. 1-aby wprowadzić kilka informacji, a 2 - wyświetlić raporty na temat danych), podzielę go na dwa pliki HTML.

Na przykład, jeśli masz aplikację mobilną, która przeprowadzi Cię przez serię kroków kreatora, aby wykonać wprowadzanie danych (tj. Pojedynczy cel), umieściłbym całego kreatora w środku Ext.Panel (na jednej stronie) i zamienić każdą zawartość Ext.Panel "krok" kreatora, gdy użytkownik przechodzi przez kreatora.

Answer 3

Istnieje właściwie generator, którego można użyć do wygenerowania kanonicznej struktury aplikacji. Od pobrania Sencha, przejdź do katalogu jsbuilder, a następnie uruchomić polecenie podobne do tego:

./sencha.sh generate app MyApp path/to/myapp 

Również ten zestaw slajdów demonstruje strukturę, choć być może trzeba będzie kopać więcej filozofii, dlaczego rzeczy są gdzie:

http://www.sencha.com/conference/sessions/session.php?sid=322

A oto przykład aplikacja mówi się w dyskusji:

http://cl.ly/1d1S282O1Y2c3N1v1j1i

Answer 4

W porządku jest użycie pojedynczego pliku HTML, aby zacząć wszystko, ale na dłuższą metę warto uczynić strukturę aplikacji zgodną z "najlepszymi praktykami", aby inni mogli spojrzeć na kod i zrozumieć go.

Generatory Touch Touch (wchodzące w wersji 1.1) umieszczają logikę uruchamiania w pliku o nazwie app.js, a następnie mają pliki dla każdego modelu, widoku i kontrolera (w odpowiednich katalogach).

Chociaż nie można budować pełnoprawnej aplikacji MVC od samego początku, prawdopodobnie powinieneś nadal używać tych konwencji. Spójrz na aplikacje Twitter i Kiva w SDK (i na stronie http://dev.sencha.com/deploy/touch/examples/), aby znaleźć dobre przykłady.

Plik index.html może łączyć się z każdym plikiem osobno, ale oczywiście do produkcji, należy również zapoznać się z narzędziem JSBuilder, aby je spakować i zminimalizować, tak aby urządzenie mogło je pobrać w jednym żądaniu HTTP .