Jak napisać wielozadniową aplikację dla systemu Android z bardzo głęboką nawigacją?

Question

TL; DR: Jak powinny wyglądać i działać aplikacje na wielowarstwowe aplikacje z głęboką nawigacją podobną do aplikacji Spotify na Androida i jak ją wdrożyć?

Długa wersja: pracuję nad aplikacją, w którym użytkownik widzi listę elementów i może wniknąć głębiej w tych elementach. Te strony szczegółów przedmiotów mogą ponownie otwierać listy powiązanych elementów, które z kolei mają strony szczegółowe i tak dalej. W aplikacji na telefonie, to byłoby odrębne działania, które może wyglądać i połączyć ze sobą tak:

W tych makiet, użytkownik widzi wstępny przegląd, a następnie wybiera „Item # 2” z pierwsza lista. Otworzy się nowe działanie, pokazujące mu szczegóły dotyczące przedmiotu nr 2. Tutaj wybiera listę rzeczy związanych z pozycją # 2. Nowo otwarta aktywność na trzecim obrazku pokazuje tę listę, a kliknięcie otwiera szczegóły dotyczące tej rzeczy. Potrafi poruszać się tak głęboko w treści, jak mu się podoba.

Działa to całkiem dobrze w zwykłych działaniach Android. Pracuję nad przeniesieniem aplikacji na tablety i zastanawiam się, jak najlepiej to wdrożyć. Plan polega na utworzeniu układu wielopanowego z tą samą koncepcją. Jest bardzo podobny do sposobu działania aplikacji Spotify na iPada (ciekawe będzie, jak wprowadzą ją na Androida po utworzeniu układów przeznaczonych dla tabletów).

W układzie tabletu każde kliknięcie nazwy elementu lub listy otwiera odpowiedni element potomny jako nowy panel, który wyświetla się z prawej strony. To samo workflow jak w powyższym przykładzie będzie wyglądać następująco:

jestem pewien, jak najlepiej wdrożyć ten schemat nawigacyjny. Aplikacje wielopanelowe o ograniczonej głębokości nawigacji, takie jak GMail, mogą być budowane za pomocą statycznej ViewGroup (LinearLayout byłoby ok) zawierającej wszystkie fragmenty, a zagłębianie się w nawigacji zastępuje zawartość następnego kontenera po prawej stronie i animuje do tego (zobacz CommonWares implementation of this on SO).

Sugeruje to, że niestandardowy ViewGroup będzie do zrobienia. Jeśli ma wyświetlić podstronę (np. "Lista rzeczy"), tworzy nowe dziecko w grupie View, która jest o połowę szersza od ekranu z fragmentem, a następnie przewija widoczny obszar tak, aby okienko, które właśnie wchodziło w interakcję i nowe dziecko jest widoczne. W tym celu odwołuje się prawidłowo do FragmentTransaction, tak że tylna stos działa poprawnie, to myślę, że byłoby coś takiego:

View newPane = container.addChild(); 
FragmentTransaction ft = getSupportFragmentManager().beginTransaction(); 
ft.add(newPane, new ListOfThingsFragment(2)); 
ft.remove(paneOnRight, fragmentOnRight); 
ft.commit(); 
container.animateToRight(); 

nie widzę sposób to zrobić animację wewnątrz FragmentTransaction.

Informacje zwrotne są mile widziane. Mój pracodawca jest ogólnie przychylny w odniesieniu do otwartych struktur zaopatrzenia, które rozwijamy, więc jeśli jest to coś, co jest bardziej interesujące i jeśli mogę wymyślić rozwiązanie wielokrotnego użytku, chętnie podzielę się tym.

Answer 1

Wystąpił ten sam problem z naszą aplikacją.Ograniczenia daliśmy sobie pytanie:

• dynamiczne numery szyb
• Każda szyba może być różnej wielkości
• Fragmenty wewnątrz szyby muszą być prawidłowo przechowywane na zmiany orientacji.

W świetle tych ograniczeń stworzyliśmy nowy układ, który nazywamy PanesLayout. Można to sprawdzić tutaj:

https://github.com/cricklet/Android-PanesLibrary

zasadzie To pozwala łatwo dodawać dowolną liczbę szyb dynamicznie wielkości i dołączyć do tych fragmentów szyb. Mam nadzieję, że okaże się to przydatne! :)

Answer 2

Częściowa odpowiedź na część animacji: Ty może zrobić animacje z FragmentTransaction:

ft.setCustomAnimations(android.R.anim.slide_in_left, 
    android.R.anim.slide_out_right); 

UPDATE: zobacz tę odpowiedź od samego Reto Meier o animacji fragment: https://stackoverflow.com/a/4819665/1007169

Answer 3

miałem pewne czasu badawczego i znalazłem rozwiązanie tego problemu (pytanie, na które chciałem zobaczyć rozwiązanie na DŁUGI czas, zanim go o to poprosiłeś). Nie mogę pokazać całego kodu, ponieważ są granice IP, ale tutaj umieszczę główne części tej animacji.

Dostępne są dwa kluczowe narzędzia: setCustomAnimations i LayoutTransition Tak, na tyle, na ile byłem w stanie to zrobić, musisz rozdzielić animacje ustawione tak, aby działały.

Przejdźmy do jakiegoś kodu, zdefiniujesz swój XML za pomocą poziomego LinearLayout i upewnij się, że zawiera on następujący wiersz.

android:animateLayoutChanges="true" 

ten zostanie automatycznie generuje standardowe LayoutTransition które nie przekłada Fragment /, że zatrzymuje się w tym układzie i alfa (lub poza) fragment/widoku, który jest dołączony do lub usunięty z układu. Spróbuj.

Więc po to układ jest zawyżona zrobimy uchwycić to LayoutTransition i nakłonić go do naszych potrzeb:

LayoutTransition lt = myLinearLayout.getLayoutTransition(); 
lt.setAnimator(LayoutTransition.APPEARING, null); 
lt.setAnimator(LayoutTransition.DISAPPEARING, null); 
lt.setStartDelay(LayoutTransition.CHANGE_APPEARING, 0); 
lt.setStartDelay(LayoutTransition.CHANGE_DISAPPEARING, 0); 

z tym kodem, jesteśmy usunięcie animacji alfa i usuwając wszelkie opóźnienia z przejścia (bo chcemy, aby wszystkie tłumaczenia były uruchamiane razem).

A teraz to tylko kilka prostych transakcji fragment, aby pracować, podczas inicjalizacji my nadmuchać ten układ i umieścić kilka fragmentów na nim:

setContentView(R.layout.main); // the layout with that Linear Layout 
FragmentTransaction ft = getSupportFragmentManager().beginTransaction(); 
ft.add(R.id.main, frag1, FRAG_1_TAG); // it's good to have tags so you can find them later 
ft.add(R.id.main, frag2, FRAG_2_TAG); 
ft.add(R.id.main, frag3, FRAG_3_TAG); 
ft.hide(frag3); 
ft.commit(); 

teraz na transakcji jest prosta:

FragmentTransaction ft = getSupportFragmentManager().beginTransaction(); 
ft.setCustomAnimations(R.anim.push_left_in, R.anim.push_left_out, R.anim.push_right_in, R.anim.push_right_out); 
Fragment left = getFragmentManager().findFragmentByTag(FRAG_1_TAG); 
Fragment right = getFragmentManager().findFragmentByTag(FRAG_3_TAG); 

ft.hide(left); 
ft.show(right); 

ft.addToBackStack(null); 
ft.commit(); 

końcowe uwagi:

dokonać głębszej nawigacji to tylko kwestia wypalania FragmentTransactions dodać fragmenty do LinearLayout i hide lub detach fragment lewej strony.

także, aby fragmenty pracować w układzie liniowym ważne jest, aby ich LinearLayout.LayoutParams.weight podczas wykonywania, coś podobnego do następującego kodu stosowanego do widoku fragmentu

((LinearLayout.LayoutParams) view.getLayoutParams()).weight = 1; 

aby pracować na telefony i to tylko kwestia stosowania wspólnych wzorów multiple screen support.

ostatnia uwaga, należy zachować ostrożność przy prawidłowym zarządzaniu stanem układu podczas obracania urządzenia, ponieważ nie jest on obsługiwany w całości przez system.

Szczęśliwe kodowanie!