Jak utworzyć system niezależny od rozdzielczości?

Mam na myśli to. Mogę oczywiście zakotwiczyć rzeczy na krawędziach, co uczyniłoby moją rozdzielczość interfejsu niezależną ... dopóki nie zmieni się tak bardzo, że grafika będzie zbyt mała. Jak odpowiednio skalować w razie potrzeby? Jak utrzymywać odpowiednią grafikę podczas skalowania? Nie chcę ich rozciągać, jeśli rozdzielczość ma inną proporcję, jak 16:10, w przeciwieństwie do czegokolwiek innego.

Czy istnieje prawdziwe i sprawdzone podejście do tego? Odtwarzacze wideo pokazują czarne obramowania z powodu tego problemu, czy nie można tego właściwie rozwiązać?

Po pierwsze należy pamiętać, że przy rasteryzacji technicznie nie ma czegoś takiego jak prawdziwa niezależność od rozdzielczości. Przy wystarczającym powiększeniu poszczególne tekstury zaczną być widoczne. Jedynym rozwiązaniem tego jest napisanie systemu grafiki wektorowej.

Biorąc to pod uwagę, istnieje kilka kroków do stworzenia solidnego systemu niezależnego od rozdzielczości opartego na rastrze: wymiarowanie, układy współrzędnych i układ.

Do wymiarowania i pozycjonowania musimy użyć zestawu jednostek, które utrzymują stosunek do rzeczywistej rozdzielczości aplikacji. W tym przypadku użyjmy cali, ponieważ jestem Amerykaninem i można skalować elementy za pomocą DPI (kropek na cal). Załóżmy na przykład, że aplikacja działa w rozdzielczości 800 x 600. Domyślne DPI systemu Windows to 96, co oznacza, że ​​aplikacja ma rozdzielczość (800/96) x (600/96) cali lub 8,33 x 6,25 cali.

Ponieważ musisz obsługiwać przynajmniej proporcje 4: 3 i 16: 9, sposób obsługi układu współrzędnych ekranu staje się nieco trudny. To, co zalecam, to umieszczenie (0,0) na środku obszaru wyświetlania (a także okien i kontrolek). Działa to dobrze, ponieważ jeśli umieścisz (0,0) w rogu, to gdy ten róg przesunie się w oparciu o rozdzielczość i współczynnik proporcji, przełoży się on na wszystkie duszki, podczas gdy środek ekranu zawsze będzie środkiem ekranu nie ważne urządzenie. Kontynuując nasz przykład z rozdzielczością 800 x 600, dałoby to układ współrzędnych, który wynosi (od lewej do prawej) od -4,145 cali do 4,165 cali i (od góry do dołu) od 3,125 cala do -3,125 cali.

W tej chwili masz niezależny od DPI system interfejsu użytkownika z elementami, które zawsze będą w tym samym miejscu względem środka ekranu - niezupełnie niezależne od rozdzielczości. Na szczęście niezależność DPI pozwala na skalowanie interfejsu użytkownika poprzez skalowanie DPI w oparciu o heurystykę. Na przykład możemy skalować DPI przy użyciu rozdzielczości pionowej jako naszej heurystyki. Jeśli 800x600 to 96 DPI, użyjemy 123 DPI dla 1024x768 lub 115 DPI dla 1280x720.

Na koniec musisz zbudować system układu, który obsługuje zarówno pozycjonowanie absolutne, jak i pozycjonowanie względne. Doskonałymi tego przykładami są WPF i sieć. Możesz określić, aby formanty / pola wypełniały część% elementu nadrzędnego podczas zadokowania go do krawędzi wraz z wieloma innymi przydatnymi opcjami automatycznego układu. Wszystko to razem spowoduje, że system interfejsu użytkownika będzie wyglądał prawie identycznie w wielu różnych rozdzielczościach i proporcjach.

Podsumowując, gorąco polecam przestudiowanie WPF, ponieważ robi to prawie wszystko, z wyjątkiem tego, że zachowuje pochodzenie w lewym górnym rogu układu współrzędnych i nie skaluje DPI automatycznie na podstawie rozdzielczości pionowej.

Zasadniczo to, co chcesz zrobić, zależy od gry.

Jedną z opcji jest posiadanie czarnych ramek, jeśli proporcje (proporcje) są różne (prawdopodobnie najłatwiejsze, po prostu renderuj do tekstury, a następnie renderuj do ekranu, zmieniając odpowiednio rozmiar).

Inną opcją jest posiadanie różnych ścieżek renderowania dla różnych współczynników proporcji. Możesz mieć jeden dla panoramicznego, jeden dla „normalnego”.

Jeszcze inną opcją jest osobne skalowanie, np. Powiększenie lub zmniejszenie okna komunikatu interfejsu użytkownika w zależności od rozdzielczości. Ilekroć musisz dowiedzieć się, gdzie rysować, zamiast używać dokładnych pikseli, rób rzeczy takie jak 0,2 w dół, 0,8 w poprzek, szerokość 0,1, wysokość 0,3. Przesadnie w tym przypadku będziesz miał rozciąganie rzeczy, chociaż w zależności od tego, jak rysujesz rzeczy, które mogą być w porządku (tj. Rozciągnij tło interfejsu użytkownika, ale nie tekst).

Jeśli chodzi o 3D, o ile poprawnie ustawisz rzutnię, powinieneś skończyć z odtwarzaczami szerokoekranowymi, którzy będą mogli zobaczyć nieco więcej niż ustawienia niepanoramiczne. (alternatywnie narysuj czarne obramowanie / lub rozciągnij widok).