簡體   English   中英

在ib中布置應用時,格式與模擬器中的格式不同

[英]Formatting is different when laying out app in ib than in simulator

我只是在學習如何制作應用程序,而我注意到的第一件事是,當我在界面生成器中以圖形方式對應用程序進行布局時,當我在模擬器或自己的設備上運行該應用程序時,情況有所不同。 我有兩個正在發生的屏幕截圖。

在界面構建器中

在模擬器上

注意段和開關之間的空間...它們是不同的,當我想向上移動開關時會引起問題...

我怎樣才能解決這個問題? 看起來可能與更新的iPhone的更大屏幕尺寸有關,而這並不是我的模擬器中正在運行的內容...如果是這樣,那么在設計兩部手機上看起來都不錯的應用程序時我應該知道些什么?

正如我認為您所診斷的,問題是Interface Builder向您顯示4“屏幕,而您的模擬器向您顯示3.5”屏幕。 在Interface Builder中,您可以單擊主面板右下角的以下按鈕在4“和3.5”的顯示之間切換:

切換iPhone屏幕尺寸

您也可以在模擬器中,從“硬件”菜單中將“設備”選擇為3.5英寸屏幕或4英寸屏幕,以便可以模擬在兩個大小的應用程序屏幕上運行應用程序。 順便說一句,當您進入“視網膜”模擬器時,它將在屏幕上顯示兩倍大(因為屏幕的分辨率是原來的兩倍)。 但是您可以通過在模擬器的“窗口”菜單上使用“縮放”選項來控制模擬器窗口的大小。 這只是改變了Mac屏幕上模擬器對模擬設備的再現大小。 但是,如果您使用的是較小的Mac屏幕,有時您會發現此“縮放”選項也很有用。

但是您確實想確保您的應用程序運行良好,而不管屏幕的大小如何,因此您確實應該針對這兩種尺寸測試應用程序。 您希望您的應用程序在iPhone 4設備和iPhone 5設備上都能很好地呈現。 幸運的是,您可以使用單個情節提要板實現此目的。

在決定在兩種尺寸的屏幕上控件布局的因素方面,這取決於您是否使用自動布局。 您可以通過單擊最右側面板的第一個選項卡,然后選中或取消選中“使用自動布局”復選框來控制它:

自動布局

如果不使用自動布局(例如,如果您的應用程序要在iOS 5上運行,則這很重要),則可以轉到“自動調整大小的蒙版”選項卡,並控制決定布局的“彈簧和支柱”。 例如,如果您單擊場景中的一個控件,則可以通過查看“尺寸檢查器”選項卡來控制邊距是否應隨尺寸的變化而變化,或者布局是否應隨尺寸的變化而變化:

弦和支柱

如果將鼠標懸停在該“示例”窗口上,它將動畫化其大小隨其超級視圖的大小變化的方式(例如,iPhone是具有3.5英寸的屏幕還是4英寸的屏幕)。

另一方面,如果您使用的是自動布局(僅適用於運行iOS 6及更高版本的設備),則屏幕上的布局取決於您為視圖定義的“約束”(請參見后半部分)。下圖):

自動布局

如果要完全控制布局,則應該有2種不同的XIB,一種用於標准屏幕(320 x 480),另一種用於新iPhone 5屏幕(320 x 568)。 這樣,您可以准確指定每個元素的顯示位置,並且在屏幕尺寸不同的情況下也不會感到驚訝。

但是無論如何,您都應該始終將放置在配置良好的XIB中的每個元素的錨定和自動調整大小。

以下是本教程的內容

當屏幕在iOS設備上旋轉時,您可以管理UI對象如何更改其位置或它們是否伸展以填充新窗口。 所有這些都可以通過Interface Builder中的這個簡單的小工具進行管理。

在此處輸入圖片說明

左邊的框是您決定對象縮放比例的地方,右邊的框是動畫視圖,顯示了修改布局框架時對象將如何執行。 左側的外框是您設置“錨”或對象將鎖定在哪一側的位置。 屏幕尺寸更改時,所選的任何一側都會使對象粘附到該側。 內部正方形具有用於拉伸的控件。 當對象鎖定在兩側時,屏幕會改變其寬度,然后可以告知對象與屏幕一起拉伸。 值得一試的是這些設置,並查看不同配置的結果。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM