關於大屏項目中分辨率和高寬比的總結

大屏項目中分辨率和高寬比的總結

本文出自博客

前言:

最近做第一次大屏項目,雖然我是寫後端,但是前端和整個項目也是緊密相連的,項目組因爲客戶顯示的大屏分辨率和設計圖的一些問題浪費了一些不必要的時間。所以在這裏記錄一下;

問題:

情況說明:客戶現場的大屏幕是由一般二十幾寸的1920 * 1080分辨率的小屏幕,由5 x 3拼接成的一個大屏幕,我們錯誤的是按照1920 * 5 / 1080 * 3 這樣的分辨率去設計了第一版UI,發現連內容都顯示不完整,大小比例都嚴重不協調。導致前端UI重做,浪費的大量的人力物力。

屏幕高寬比非常重要

分析:

去詳細瞭解了關於拼接的大屏幕分辨率,高寬比一些基本的常識,原來15個1920 * 1080 的顯示器拼接的大屏最後顯示的還是1920 * 1080 的分辨率顯示,只是高寬比原來更大了,高寬比也變成了80:27,單個的小顯示器是16:9的寬高比。從理論上講,是可以實現1920 * 5 : 1080 * 3的分辨率的,這樣電腦的顯卡也不支持啊,是不是?這個是由大屏的拼接技術決定的,而目前的大屏還是邏輯分辨率(1920 * 1080 ),在大屏幕上只是同比例放大了而已,由於拼接後的大屏高寬比和電腦顯示器的不一致,會導致投放到大屏上的頁面一定的拉伸和壓縮;

處理方案:

解決辦法:目前只能以1920 * 1080的分辨率去設計頁面,頁面的大小按照客戶現場的大屏高寬比(16 * 5 :9 * 3)去設計,這樣能達到最好的顯示效果;

最後強調: 屏幕高寬比非常重要屏幕高寬比非常重要屏幕高寬比非常重要

參考博客

http://www.woshipm.com/ucd/198774.html
https://blog.csdn.net/qq_42061692/article/details/85566174

本文出自博客

發佈了10 篇原創文章 · 獲贊 2 · 訪問量 9406
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章