UIViewContentModeScaleAspect กรอกไม่ถูกตัด


144

ฉันพยายามที่จะวาดภาพขนาดบางที่มีขนาดคงที่ (100x100) UIImageViewโดยใช้ ฉันได้ตั้งกรอบขนาดของมุมมองภาพของฉันที่จะ 100x100 และตั้งค่าการcontentModeUIViewContentModeScaleAspectFill

ความเข้าใจของฉันคือสิ่งนี้ควรทำให้รูปภาพถูกวาดตามขนาดที่ฉันตั้งไว้และรูปภาพจะเต็มพื้นที่ของรูปภาพและคลิปส่วนใด ๆ ของรูปภาพที่อยู่นอกขนาดที่ฉันตั้งไว้สำหรับมุมมองรูปภาพ อย่างไรก็ตามรูปภาพนั้นยังคงถูกวาดมีขนาดใหญ่กว่าหรือเล็กกว่าขนาด 100x100 ที่ฉันตั้งไว้

ถ้าผมตั้งcontentModeไปUIviewContentModeScaleToFillแล้วภาพที่ถูกวาดที่ตรง 100x100 แต่มันเพี้ยนไปพอดีกับขนาดดังกล่าวนั้น ความคิดใดที่ว่าทำไมการเติมมุมมองไม่ได้ถูกตัดอย่างที่คาดไว้

นี่คือรหัสของฉัน:

_photoView = [[UIImageView alloc] initWithImage:photoImage];
_photoView.contentMode = UIViewContentModeScaleAspectFill;
[self addSubview:_photoView];

CGRect photoFrame = _photoView.frame;
photoFrame.size = CGSizeMake(100, 100);
_photoView.frame = photoFrame;

เพื่ออธิบายให้ดีขึ้นนี่คือภาพหน้าจอของสิ่งที่ฉันเห็น สี่เหลี่ยมสีเขียวคือส่วนUIViewที่UIImageViewฉันกำลังทำงานอยู่ ฉันได้ตั้งค่าสีพื้นหลังเป็นสีเขียวและกรอบของมุมมองเป็น 100x100 จากการทดสอบUIImageViewsจะมีขนาดถึง 50x50 อย่างที่คุณเห็นเมื่อใช้...AspectFillภาพขนาดไม่ถึง 50x50 และในบางกรณีก็มีการชดเชยจากที่ฉันต้องการ เมื่อใช้...ScaleToFillจะมีการปรับขนาดอย่างถูกต้อง แต่ภาพผิดเพี้ยน

ภาพประกอบแสดงปัญหา

คำตอบ:


352

คุณลองตั้งค่าคลิปเป็นขอบเขตได้ไหม

[_photoview setClipsToBounds:YES];

หรือโดยตรงใน Storyboard / Xib ของคุณหากคุณสามารถ:

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


10
นั่นมัน - ขอบคุณ (ผมเพิ่มหน้าจอด้านบนเพื่อแสดงที่ดีกว่าสิ่งที่ฉันได้เห็นมากขึ้นเป็นตัวอย่างว่าใครมาเจอปัญหานี้.)
จอช Buhler

3
ใน InterfaceBuilder เปลี่ยนชื่อ (โดยไม่ช่วยเหลือ) เป็น "คลิปการดูย่อย" (หมายเหตุ: ในกรณีนี้มันไม่ได้คลิก "การสัมภาษณ์" ชื่อไม่ถูกต้อง: มันคลิปตัวเองและการสัมภาษณ์)
อดัม

3
การทำเครื่องหมายที่ตัวเลือก 'คลิปการดูย่อย' ในไฟล์ NIB ก็ทำเช่นเดียวกัน ไชโย
codeburn

แต่ถ้าคุณต้องการเพิ่มเงาโดยใช้คุณสมบัติ CALayer :( เพิ่มมุมมองอื่นด้านหลังมันไม่เหมาะสำหรับฉัน
Rambatino

หากคุณกำลังใช้เลย์เอาต์อัตโนมัติเช่นฉันมีอีกสาเหตุที่เป็นไปได้ซึ่งก็คือ NSLayoutConstraint "UIView-Encapsulated-Layout-Height" ที่ทำลายข้อ จำกัด ขนาด UIImageView
ewiinnnnn

8

หากคุณต้องการที่จะขยายความรู้ของคุณมีเป็นบทความที่ดีจริงๆในวิธีการที่สแต็ค iOS UIView มีการแสดง นอกจากนี้ยังมีบทความเพิ่มเติมในเชิงลึกเกี่ยวกับท่อวาดภาพทั้งหมด

สรุป:

  1. Rasterisation - เนื้อหาทั้งหมดของมุมมองนั้น rasterised (วาดหรือบัฟเฟอร์พิกเซลหน้าจอ) ในการประสานงานพื้นที่ของขอบเขตของมุมมอง นี่อาจเป็นข้อมูลภาพหรือภาพวาดที่กำหนดเอง (เช่นdrawRect:) แต่เนื้อหาย่อย rasterisation นี้คำนึงถึงcontentModeคุณสมบัติ

    สิ่งที่อยู่นอกขอบเขตของมุมมองถูกยกเลิก

  2. องค์ประกอบ - ผลลัพธ์จะถูกรวบรวม (ดึงมาจากด้านบนของกันและกัน) จากมุมมองย่อยไปยังผู้ดูแล ใช้คุณสมบัติเฟรมของมุมมองย่อย

    หากclipsToBoundsสถานที่ให้บริการYESใน SuperView แล้วมันจะทิ้งsubviewนอกเนื้อหาขอบเขตของมัน


2

พบปัญหาเดียวกันและแก้ไขได้ด้วยการทำเครื่องหมายที่ "การสัมภาษณ์คลิป"

ภาพแสดงขึ้นอย่างถูกต้องสำหรับทุกการดู (3.5,4,4.7,5.5, ipad) ในการแสดงตัวอย่างสตอรีบอร์ด แต่ไม่ได้อยู่ในการจำลอง

หลังจากที่ฉันเลือก "คลิปสัมภาษณ์" ปัญหาได้รับการแก้ไข :)


1

การตรวจสอบ "คลิปสัมภาษณ์ย่อย" โดยตรงใน Storyboard / Xib ก็ใช้ได้กับฉันเช่นกัน ป้อนคำอธิบายรูปภาพที่นี่


0

มุมมองย่อยของฉันมีการปรับขนาดและฉันรู้ว่ามันเป็นเพราะ xib มีชุดรูปแบบอัตโนมัติ: ป้อนคำอธิบายรูปภาพที่นี่


0

หากทุกอย่างล้มเหลว

ทำคลิปเพื่อกำหนดขอบเขตใน viewDidLayoutSubviews วิธีการ

ตัวอย่าง:

  override func viewDidLayoutSubviews() {

    imageProfile.layer.cornerRadius = imageProfile.bounds.size.width/2
    imageProfile.clipsToBounds = true
    imageProfile.layer.masksToBounds = true
 }
โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.