用於手機和平板電腦的Codenameone中的樣式佈局

我完成了我的應用程序的開發，使用完全適合模擬器中iphone 6的表單組件佈局。我使用了主題樣式（總是基本資源）和一些編碼的外觀和感覺調整的組合。用於手機和平板電腦的Codenameone中的樣式佈局

當我對iPhone 5運行這個操作時，我曾經天真地期望顯示器縮小以適應你的瀏覽器應用程序，但是我的組件（很大程度上是標籤）離開了它們的容器邊緣。恐慌。

我最終不得不測量顯示器高度並從那裏判斷設備，並編寫不同大小的組件以獲得正確的配置。這花了一些時間。

在AppStore中的TestFlight旁邊。作爲更廣泛的測試的一部分，我決定在我的iPad 3上進行安裝，只是發現佈局組件的渲染都非常小。恐慌。

我現在已經花了幾天時間解決了這個問題。我基本上使用該方法來確定設備「類別」的類型，然後應用字體或fontimage等

public static ScreenSizeEnum getScreenSize() { 
    if (Display.getInstance().isTablet() && Display.getInstance().getDisplayHeight() > 2000) { 
     return ScreenSizeEnum.TABLET; 
    } 
    else if (Display.getInstance().getDisplayHeight() < 950) { 
     return ScreenSizeEnum.SMALL; 
    } else if (Display.getInstance().getDisplayHeight() > 949 && Display.getInstance().getDisplayHeight() < 1200) { 
     return ScreenSizeEnum.MEDIUM; 
    } else { 
     return ScreenSizeEnum.LARGE; 
    } 
}

的大小這是勿庸置疑並非萬無一失。 Ipad 6 plus不被識別爲平板電腦，但具有較大的顯示屏高度，但其中一個Nexus是平板電腦，但顯示屏高度較小。

我的問題是，你究竟如何解決這個問題？

平板電腦和手機有不同的尺寸，但重要的是，無論外形尺寸如何，您仍然可以獲得高質量的組件。 CN1 KitchenSink演示沒有真正解決它。提前謝謝了。

來源

2017-04-18 Think.Smart

如果你可以分享一些截圖來證明您遇到的問題，我可以提供關於如何提高佈局工作跨平臺的一些指點。 –

嗨史蒂夫，我們沒有截圖了。基本上，在基本層面上，問題是我有一個屏幕顯示頂部的標題，中心的核心文本和南部的頁腳文本。所有的文字都是2至5毫米之間的主題字體。這適合iPhone 6的尺寸。在我們進行更改之前，當在ipnone 5上呈現時，文本從頁面的邊緣移開。在iPad上，頁面上有很多冗餘空間，所以看起來並不平衡。因此我的解決方案是讀取屏幕大小並減少\增加字體。這是最好的/唯一的方法嗎？ –

要添加，對於圖像也是一樣，因爲您必須在屏幕上設置它們的大小。所以在ipad上，你可能會得到很多空的空間，而在較小的手機上，它可能看起來侷促。所以再次是以編程方式調整大小到屏幕大小的唯一方法？ –

從這個問題的描述看來，你似乎在考慮把平板電腦看作是一個「大手機」，這是一種錯誤的方式來看待它。平板電腦具有與手機類似的密度，但以英寸爲單位的空間更多，這意味着您需要設計應用程序，以便更有效地使用更多的空間。

下面是在iPad中運行的另一個Kitchen Sink演示程序的一個屏幕截圖，另一個在iPhone中運行。注意UI的外觀非常不同，因爲我們調整了UI以使用額外的空間。圖像的（例如多圖像）和字體由密度決定而不是像素數量，因爲目標是使用額外的空間不用較大的圖像/文本填滿屏幕。

來源

2017-05-05 06:19:41

用於手機和平板電腦的Codenameone中的樣式佈局

回答

相關問題