Spersonalizowany pionowy i poziomy interfejs w aplikacji na Androida

Zmorą wielu projektantów interfejsów jest z pewnością notoryczny brak miejsca. Ekrany telefonów nie są przecież tak wielkie jak te od komputerów stacjonarnych, laptopów czy też tabletów. Do tego dochodzi również drugi kłopot, bowiem co mianowicie zrobić w przypadku obrócenia przez użytkownika telefonu i zmianie orientacji wyświetlania?Zostawienie mnóstwo niewykorzystanego miejsca, nie prezentuje się zbyt fajnie, a nienaturalne rozciągnięte elementy ciasno ułożone w pionowym widoku mogą zepsuć całą estetykę aplikacji. Pewnym rozwiązaniem tego problemu może więc być osobny spersonalizowany widok dla orientacji poziomej i pionowej. Przyjrzyjmy się więc jak osiągnąć taki efekt w systemie Android.

Fot: JD Hancock, CC BY 2.0.

Fot: JD Hancock, CC BY 2.0.

Dodawanie spersonalizowanego poziomego layoutu w Android Studio

Aby dodać poziomy layout w Android studio należy otworzyć plik z domyślnym layoutem, który chcemy mieć osobno spersonalizowany dla poziomego widoku, a następnie w prawym górym roku kliknąć ikonę telefonu i z rozwiniętego menu wybrać opcję „Create Landscape Variation„:

android-studio-create-lanspace-view

Jak widać utworzyły nam się teraz dwa te same pliki activity_main.xml z tym, że jeden ma dodaną informację iż jest to widok poziomy (ang. land).

android-studio-landspace-view-explorer

Jak to wygląda w strukturze projektu?

Przechodząc do katalogu res (nazwaAplikacji/app/src/main/res) możemy teraz ujrzeć dwa foldery layout oraz layout-land:

lanspace-view-folder

Jak widać oba przechowują pliki o tych samych nazwach z tym, że katalog layout jest odpowiedzialny za wersję layoutu dla orientacji pionowej, a layout-land dla orientacji poziomej:

landspace-view-fileTeraz kiedy uruchomimy aplikację i obrócimy ekran poziomo, ujrzymy inny układ interfejsu niż ten który był wyświetlany kiedy telefon znajdował się w pionowej pozycji.

, , , , , , , ,