Xcode 6 สตอรีบอร์ดผิดขนาดหรือไม่


139

สร้างโครงการใหม่ตั้งแต่เริ่มต้นใน Swift ใน Xcode 6 (Beta 1) และได้เห็นพฤติกรรมแปลก ๆ กับสตอรีบอร์ดและผลลัพธ์ที่ฉันกำลังดู

ฉันได้สร้างส่วนต่อประสานที่เรียบง่าย (ดังแสดงด้านล่าง) - ด้วยคุณสมบัติของ View Controller ที่รวมอยู่ เมื่อฉันเรียกใช้ตัวจำลองนี้ฉันคาดว่า 'Hello, World' จะเป็นศูนย์กลางในส่วนติดต่อผู้ใช้ - อย่างไรก็ตามดูเหมือนว่า 'Square' นี้เข้ากับหน้าจอ iPhone ได้ง่ายและทำให้มองเห็นสิ่งที่ผิด (ดูด้านล่าง )

คำถามของฉันคือ: มีคนอื่นเห็นพฤติกรรมนี้และพวกเขาแก้ไขได้อย่างไร

ขอบคุณ!

ดูจาก Storyboard Editor

คุณสมบัติของผู้ตรวจสอบ

สารวัตรขนาด

เอาท์พุทจำลอง


เพิ่มข้อ จำกัด เลย์เอาต์อัตโนมัติที่ควรแก้ไข คุณกำลังออกแบบเลย์เอาต์ทั้งหมดดังนั้นเลย์เอาต์อัตโนมัติจะช่วยให้คุณแสดงเนื้อหาในตำแหน่ง "ถูกต้อง"
Raz

8
เคล็ดลับ: การใช้ผู้ช่วยแก้ไข> อัตโนมัติ> ดูตัวอย่างคุณจะสามารถดูตัวอย่างหน้าจอได้ทุกขนาดหน้าจอ
Francescu

คำตอบ:


81

ในขณะที่คำตอบของ Asif Bilal นั้นเป็นวิธีที่ง่ายกว่าและไม่เกี่ยวข้องกับ Size Classes (ซึ่งเปิดตัวใน iOS 8) ขอแนะนำอย่างยิ่งให้คุณคุ้นเคยกับขนาดของชั้นเรียนในอนาคต จุด."


คุณอาจยังไม่ได้เพิ่มข้อ จำกัด โครงร่าง

เลือกป้ายกำกับของคุณแล้วแตะปุ่ม จำกัด การจัดวางที่ด้านล่าง

ป้อนคำอธิบายรูปภาพที่นี่

ในเมนูนั้นให้เพิ่มความกว้างและความสูง (ไม่ควรเหมือนกับของฉัน) โดยทำเครื่องหมายที่ช่องทำเครื่องหมายแล้วคลิกเพิ่มข้อ จำกัด จากนั้นควบคุมการลากป้ายกำกับของคุณไปยังมุมมองหลักของคุณและเมื่อคุณยกเลิกการคลิกคุณควรมีตัวเลือกให้จัดกึ่งกลางแนวนอนและแนวตั้งในคอนเทนเนอร์ เพิ่มทั้งคู่และคุณควรตั้งค่า


1
ยอดเยี่ยม - มันใช้งานได้ดีสำหรับฉัน - ขอบคุณสำหรับความช่วยเหลือของคุณ (จะยอมรับคำตอบของคุณเมื่อตัวจับเวลาถูกยกขึ้น)
Candyfloss

1
ยินดี. นี่คือพฤติกรรมเริ่มต้นกับการชำระอัตโนมัติซึ่งเปิดใช้งานโดยค่าเริ่มต้นแล้ว โปรดจำไว้ว่าเนื่องจากขนาด / เลย์เอาต์ของหน้าจอที่แตกต่างกันที่เป็นไปได้ควรมีวิธีการคำนวณว่ามุมมองจะวางตำแหน่งอย่างไรเมื่อเทียบกับพาเรนต์และการแก้ไขอัตโนมัติจะแก้ไขปัญหานี้ เมื่อคุณไม่เพิ่มข้อ จำกัด เหล่านี้มุมมองจะสร้างข้อ จำกัด เหล่านั้นโดยอัตโนมัติในขณะทำงาน แต่สัมพันธ์กับมุมบนซ้าย หากคุณต้องการสิ่งอื่นนอกเหนือจากนั้น (คุณต้องการสิ่งอื่นเสมอ) คุณต้องระบุข้อ จำกัด อย่างชัดเจน
สามารถPoyrazoğlu

4
โปรดทราบว่าไม่จำเป็นต้องลากตัวควบคุม (ซึ่งอาจอึดอัดใจ) ปุ่มทางด้านซ้ายของปุ่มที่เลือกในภาพนี้จะเปิดเมนูที่ช่วยให้คุณสามารถปักหมุดกลางแนวนอนและแนวตั้ง
jrturton

คุณพูดถูก .. ฉันแค่คุ้นเคยกับการควบคุมการลากนั่นคือสาเหตุที่ฉันบอกอย่างนั้น
Can Poyrazoğlu

@ CanPoyrazoğlu - คุณพูดถึง "เลือกป้ายกำกับของคุณ" ฉลากอะไร ฉันมีปัญหาเดียวกันกับโครงการ iPhone ใหม่ที่ฉันไม่มีป้ายกำกับหรือองค์ประกอบ UI อื่น ๆ โครงการแรกของฉันใน Xcode 6 โดยใช้ Objective C.
rattletrap99

253

ทำตามขั้นตอนต่อไปนี้เพื่อแก้ไขปัญหา

ใน Storyboard เลือกมุมมองใด ๆ จากนั้นไปที่ตัวตรวจสอบไฟล์ ยกเลิกการเลือก "Use Size Classes" คุณจะต้องเก็บข้อมูลขนาดคลาสไว้สำหรับ: iPhone / iPad จากนั้นคลิกปุ่ม "ปิดขนาดชั้นเรียน" การทำเช่นนี้จะทำให้ขนาดมุมมองของกระดานเรื่องราวด้วยอุปกรณ์ที่เลือก


8
นี่คือคำตอบที่ถูกต้องหากคุณได้รับตัวควบคุมมุมมอง 600x600 เมื่อคุณต้องการตัวควบคุมมุมมองขนาด iPhone มาตรฐานเช่น
Fraggle

5
นี่ควรเป็นคำตอบที่ถูกต้อง (อย่างน้อยสำหรับผู้ที่ทำงานบนแพลตฟอร์มที่ไม่ใช่สากลเท่านั้น)
Raptor

36
ฉันไม่รู้ว่าทำไมคนถึงทำเครื่องหมายว่าเป็นคำตอบที่ถูกต้อง ... คนแรกเป็นวิธีที่ควรทำ ... ถ้าคุณไม่ชอบข้อ จำกัด ของรูปแบบมากกว่าที่คุณไปในทิศทางตรงกันข้าม ... Apple กำลังใช้ประโยชน์ วิธีที่ดีในการพัฒนาสำหรับ iPhone และ iPad ทุกขนาดและคุณแค่ต้องการย้อนกลับไปยังสิ่งเก่า ๆ เพราะคุณไม่สามารถอัปเดตตัวเองได้? ไม่เคยลงคะแนน แต่ดูเหมือนว่าคำตอบนี้สร้างความสับสนให้ผู้คนและทำให้ใช้วิธีเดิม (ซึ่งจะเลิกใช้) แทนการให้กำลังใจแล้วใช้สิ่งใหม่ ...
Raphael Ayres

3
คำตอบยอดนิยมสำหรับทุกคนที่คุ้นเคยกับกระดานเรื่องราวของ iPhone / iPad
mamarx

3
ใช้ข้อ จำกัด เลย์เอาต์ ... Apple กำลังทำสิ่งนี้ในลักษณะเดียวกับที่ Android ใช้งาน มุมมองไม่มีรูปแบบ ... บางครั้งมันอาจจะเจ็บปวด แต่ถ้าคุณบังคับขนาดแอพของคุณจะดูไม่ดีกับขนาดของอุปกรณ์ต่าง ๆ หากคุณต้องการให้ปุ่มปรากฏที่มุมล่างขวาเพียงแค่สร้างข้อ จำกัด 2 ข้อและห้าม ... ไม่มีการเลือก X หรือ Y ทั้งหมดจะถูกกำหนดโดยเครื่องยนต์ ใช้ขนาดที่แท้จริง ใช้จินตนาการของคุณ. ใช้ข้อ จำกัด เชิงสัมพันธ์ เรียนรู้สิ่งนี้
Raphael Ayres

18

หากคุณใช้ Xcode 6 และออกแบบมาสำหรับ iOS 8 จะไม่มีวิธีแก้ไขใด ๆ ที่ถูกต้อง เพื่อให้มุมมอง iPhone ของคุณมีขนาดที่ถูกต้องอย่าปิดคลาสขนาดอย่าปิดการวัดที่อนุมานและไม่ได้ตั้งข้อ จำกัด (ยัง) ให้ใช้การควบคุมระดับขนาดซึ่งเป็นปุ่มข้อความที่พลาดง่ายที่ด้านล่างของตัวสร้างส่วนติดต่อที่อ่าน "wAny hAny" ในตอนแรก

คลิกที่ปุ่มและเลือกความกว้างกะทัดรัดความสูงปกติ นี่เป็นการปรับขนาดมุมมองของคุณและครอบคลุมการหมุนแนวตั้งของ iPhone ทั้งหมด เอกสารของ Apple ที่นี่: https://developer.apple.com/library/ios/recipes/xcode_help-IB_adaptive_sizes/chapters/SelectingASizeClass.htmlหรือค้นหาใน "การเลือกขนาดชั้นเรียนในตัวสร้างส่วนต่อประสาน"


ฉันรู้สึกเหมือนว่ามันจะเป็นประโยชน์ในการอ่านผ่านทั้งชั้นเรียนขนาดการออกแบบความช่วยเหลือในการเชื่อมโยงเช่นของคุณจากการเกี่ยวกับการออกแบบการเรียนหลายขนาดเพื่อปรับใช้กับการเรียนการสอน App ขนาดบน iOS รุ่นก่อนหน้านี้
Franklin Yu

นี่เป็นทางออกที่ยอดเยี่ยมหากคุณต้องการให้เลย์เอาต์อัตโนมัติ แต่ต้องการให้มุมมองสตอรีบอร์ดปรากฏเป็นแนวนอนหรือแนวตั้งแทนที่จะเป็นสี่เหลี่ยมจัตุรัส
stephenspann

5

ใน Storyboard เลือก ViewController ของคุณและไปที่ Atribute Inspector ที่ด้านบนสุดภายใต้เมตริกจำลองคุณมีคุณสมบัติขนาดและการวางแนวซึ่งตั้งค่าเป็นอนุมาน เปลี่ยนเป็นค่าที่ต้องการ

เพื่อให้แอปพลิเคชันแสดงอย่างถูกต้องบนขนาดหน้าจออื่นคุณต้องตั้งค่าข้อ จำกัด ตามที่อธิบายโดย Can Poyrazoğluในโพสต์แรก


5

ฉันมีปัญหานี้ใน xcode 6 และมีวิธีการแก้ไขข้อขัดแย้งการปรับขนาด หากคุณเลือกมุมมองของคุณที่ด้านล่างคุณจะเห็นไอคอนที่ดูเหมือน |-|- | หากคุณคลิกที่ภาพโครงการของคุณจะปรับขนาดสำหรับอุปกรณ์ต่าง ๆ


ใช่และหลังจากที่คุณเลือกสัญลักษณ์รูปสามเหลี่ยมคลิกที่เพิ่มข้อ จำกัด ที่หายไปและความเจริญที่คุณทำเสร็จแล้วการดูจะปรับขนาดตามขนาดอุปกรณ์หากแอปสากลของมัน
vishal dharankar

3

ไปที่ตัวตรวจสอบคุณสมบัติ (มุมบนขวา) ในตัวชี้วัดจำลองซึ่งมีขนาด, การวางแนว, แถบสถานะ, แถบด้านบน, คุณสมบัติของแถบด้านล่าง สำหรับ SIZE ให้เปลี่ยน Inferred -> Freeform


+1 @Rachel ขอบคุณสำหรับเคล็ดลับเล็ก ๆ น้อย ๆ ที่เป็นประโยชน์เกี่ยวกับตัวชี้วัดจำลอง -> ขนาด: "รูปแบบอิสระ" (หรือที่เห็นได้ชัดว่า "เปิดใช้งานขนาดที่กำหนดเองสำหรับ xib ที่นำกลับมาใช้ใหม่ได้
ทุก

3

ในหน้าสตอรี่บอร์ดของคุณให้ไปที่ตัวตรวจสอบไฟล์และยกเลิกการเลือก 'ใช้ขนาดคลาส' สิ่งนี้จะย่อขนาดตัวควบคุมมุมมองของคุณเป็นขนาด IPhone ปกติที่คุณคุ้นเคย โปรดทราบว่าการใช้ 'คลาสขนาด' จะช่วยให้คุณออกแบบโครงการของคุณในอุปกรณ์จำนวนมาก เมื่อคุณยกเลิกการเลือก Xcode นี้จะให้กล่องโต้ตอบคำเตือนดังนี้ สิ่งนี้ควรอธิบายด้วยตนเอง

"การปิดใช้งานคลาสขนาดจะ จำกัด เอกสารนี้เพื่อจัดเก็บข้อมูลสำหรับตระกูลอุปกรณ์เดียวข้อมูลสำหรับคลาสขนาดที่ดีที่สุดที่ใช้แทนอุปกรณ์เป้าหมายจะถูกเก็บไว้และข้อมูลอื่น ๆ ทั้งหมดจะถูกลบออกนอกจากนี้ส่วนย่อยจะถูกแปลงเป็น - การปรับตัวที่เทียบเท่า "


3

สำหรับทุกคนที่ใช้ XCode 7 มันง่ายมากในการออกแบบสำหรับขนาดอุปกรณ์เฉพาะ (แทนที่จะเป็นผืนผ้าใบสี่เหลี่ยมจัตุรัสเริ่มต้น)

ในเครื่องมือสร้างส่วนติดต่อเลือก ViewController หรือฉากของคุณจากเมนูด้านซ้าย จากนั้นภายใต้Show the Attributes Inspectorไปที่Simulated Metricsและเลือกสิ่งที่ต้องการSizeจากเมนูแบบเลื่อนลง


ที่จะให้คุณออกแบบในสตอรีบอร์ดของคุณสำหรับอุปกรณ์นั้น เมื่อคุณเรียกใช้แอพการออกแบบอาจแตกต่างกันไปตามขนาดหน้าจอที่แตกต่างกัน
Joey Tawadrous

@JoeyTawadrous แน่นอน แต่มันตอบคำถามที่ถาม :)
พระสงฆ์

2

คุณอาจจะใช้ "แก้ไขปัญหาเลย์เอาต์อัตโนมัติ" (ไอคอนด้านล่างขวา - สามเหลี่ยมในมุมมองสตอรี่บอร์ด) เพื่อเพิ่ม / รีเซ็ตข้อ จำกัด ที่แนะนำ (Xcode 6.0.1)

โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.