2014-07-01 78 views
10

我想爲使用Xcode 5.1.1的iOS 7 iPhone應用程序設計視圖。我的目標是iPhone 4和5+視圖端口。這是我的觀點:iOS 7自動佈局Y位置/高度缺失約束

View with problems

這種觀點的目的是作爲應用程序的主菜單。 ImageView是應用程序的標誌,每個按鈕都是一個選項。我遇到的麻煩是試圖對視圖進行正確的限制,以便從iPhone 5到iPhone 4的高度方向都會縮小。無論我嘗試哪種組合,我總是最終得到「需要約束:Y位置或身高。」在Missing Constraints下並且在圖像和所有按鈕的Misplaced Views下的高度不正確。

如果我嘗試使用「添加缺少的約束」,Xcode使所有按鈕的高度與最後一個按鈕的例外相同。最後一個按鈕縮小到文本。

我錯過了什麼讓它正常工作?謝謝!!

編輯:根據反饋,我已經做了以下的限制:

圖片瀏覽:已固定至頂部/底部/前/後的SuperView。固定高度。底部空間到黃色按鈕

所有按鈕:相互高度相等。基於生成的約束,似乎所有其他按鈕都會查看黃色按鈕的高度。

黃色按鈕:頂層空間到圖像查看,尾隨/前導空格,以上海華,底部空間以紅色按鈕

紅色按鈕:頂層空間,以黃色按鈕,尾隨/前導空格,以上海華,底部空間,以綠色按鈕

綠色按鈕:頂層空間,以紅色按鈕,尾隨/前導空格,以上海華,底部空間布朗按鈕

布朗按鈕:頂層空間,以綠色按鈕,尾隨/前導空格,以上海華,底部空間到橙色按鈕

橙色按鈕:頂部空間到棕色按鈕,拖尾/領先/底部空間到超級視圖

如果我這樣做,一切看起來不錯,在視網膜視圖4「。如果我將其切換到3.5英寸視圖,一切看起來都不錯,並且在模擬器中運行良好,如果將其切換回4英寸視圖,則所有按鈕(而不是黃色)都會以較小的高度錯位放置:

Messed up heights

不知道是什麼原因引起的。如果有幫助,我也可以上傳我的Xcode項目的副本。

+1

到ImageView的,底部添加上到最後一個按鈕,然後選擇你想縮小與「等高」添加到他們每個人的看法。 –

+0

我通常會避免添加缺少的約束按鈕,它會執行它認爲最好的操作,大約一半的時間出錯或增加了超出需要的時間。最好的辦法是刪除所有約束編輯器 - >解決自動佈局問題 - >刪除所有約束並重新開始。如果/當Xcode抱怨決定是否希望Xcode更新幀或更新約束。閱讀錯誤,它會告訴你它認爲錯過了什麼,然後自己添加它。 – Brandon

回答

8

它看起來像所有按鈕的高度相同,它也看起來像imageview也有一個已知的高度。這應該適合你:

1:將所有元素從頂部,左側,右側和底部的視圖旁邊釘住。對於按鈕,它將是y軸上方和下方的按鈕,以及x軸上的超級視圖。
2:指定imageView的高度。
3:命令單擊並選擇所有的彩色按鈕並平均地固定其高度。編輯器 - >針 - >高度平等。

因爲autolayout知道imageview開始的位置(從superview頂部開始是0px)並且它知道高度,所以它會知道在哪裏放置黃色按鈕的頂部。在底部它知道橙色按鈕應該固定在底部。 Autolayout唯一需要弄清楚的是每個按鈕的高度應該是多少,基於相同的高度限制。

編輯 - >針 - - >再一次一個添加一個領先的(通常是左邊的大多數語言),後,頂配的截圖

第1步選擇頂部的ImageView並選擇編輯更詳細的說明,和底部。如下所示,或者您可以使用底部的按鈕,或者您可以使用底部的針按鈕(右側6)批量添加它們。我建議使用pin按鈕,速度更快。點擊小點線來選擇要添加的約束。

enter image description here enter image description here

第3步是同樣腳的高度,從而選擇所有顏色的意見和針的高度相等。由於頂部元素(Imageview)被拉到頂部並且具有已知高度,並且底部被固定到屏幕的底部,其餘的視圖變得像手風琴的褶皺,伸展和收縮以填充其餘部分的可用空間。等寬度約束確保它看起來是正確的。如果沒有它,他們可能會有多種解決方案,以確定每個視圖應該有多大,因此您可能會得到一些小的,一些大的,以及一些可能不可見的。

enter image description here

+0

你能更詳細地描述第1步嗎?這一步之後我很難過。 – Joshua

+0

更新了圖片和更多描述 – Brandon

+0

感謝您的照片和幫助。我已經更新了原始問題和後續問題。 – Joshua