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.