2013-07-06 51 views
19

Tôi muốn thêm thả bóngđột quỵ bóng trên UIView Đây là những gì nhà thiết kế của tôi cho tôi xin cái bóng,iOS: Cách thêm bóng đổ và bóng đổ nét trên UIView?

  • Đối với hiệu ứng bóng đổ, ông nói với tôi để sử dụng RGB (176.199.226) với 90% độ mờ, khoảng cách-3 và kích thước-5

  • Đối với bóng đổ, ông nói để áp dụng, RGB (209,217,226) kích thước-1 và 100% độ mờ đục.

Đây là photoshop áp dụng các hiệu ứng màn hình,

enter image description hereenter image description here

Quan điểm với bóng theo yêu cầu (sản lượng dự kiến)

enter image description here

Tôi đã thử các sau đây để có được t ông thả bóng

viewCheck.layer.masksToBounds = NO; 
viewCheck.layer.cornerRadius = 5.f; 
viewCheck.layer.shadowOffset = CGSizeMake(.0f,2.5f); 
viewCheck.layer.shadowRadius = 1.5f; 
viewCheck.layer.shadowOpacity = .9f; 
viewCheck.layer.shadowColor = [UIColor colorWithRed:176.f/255.f green:199.f/255.f blue:226.f/255.f alpha:1.f].CGColor; 
viewCheck.layer.shadowPath = [UIBezierPath bezierPathWithRect:viewCheck.bounds].CGPath; 

Và đây là kết quả của nó,

enter image description here

Tôi đang gặp vấn đề trong việc tìm hiểu làm thế nào tôi có thể áp dụng đột quỵ và thả bóng như thể hiện vào ảnh chụp màn hình photoshop (I đã được thêm ở trên). Làm cách nào để áp dụng Khoảng cách, Lây lan, Kích thước, Vị trí?

Ai đó có thể chỉ cho tôi hướng dẫn áp dụng các loại bóng này không? Có rất nhiều hiệu ứng đổ bóng sắp ra và tôi muốn tìm hiểu làm thế nào nó có thể được thay vì hỏi từng câu hỏi ở đây!

Cảm ơn :)

Trả lời

22

Tôi tin rằng hầu hết cấu hình bạn tìm kiếm có thể đạt được bằng cách sử dụng các shadowPath tài sản.

viewCheck.layer.shadowRadius = 1.5f; 
viewCheck.layer.shadowColor = [UIColor colorWithRed:176.f/255.f green:199.f/255.f blue:226.f/255.f alpha:1.f].CGColor; 
viewCheck.layer.shadowOffset = CGSizeMake(0.0f, 0.0f); 
viewCheck.layer.shadowOpacity = 0.9f; 
viewCheck.layer.masksToBounds = NO; 

UIEdgeInsets shadowInsets  = UIEdgeInsetsMake(0, 0, -1.5f, 0); 
UIBezierPath *shadowPath  = [UIBezierPath bezierPathWithRect:UIEdgeInsetsInsetRect(viewCheck.bounds, shadowInsets)]; 
viewCheck.layer.shadowPath = shadowPath.CGPath; 

ví dụ, bằng cách thiết lập shadowInsets cách này

UIEdgeInsets shadowInsets = UIEdgeInsetsMake(0, 0, -1.5f, 0); 

bạn sẽ nhận được một cái bóng mong muốn tốt đẹp:

enter image description here

Bạn có thể quyết định hiện nay như thế nào bạn muốn hình chữ nhật bóng là được xây dựng bằng cách kiểm soát inset hình chữ nhật đường dẫn bóng tối.

6

Đối với cho Border Trong UIView.

Thêm #import "QuartzCore/QuartzCore.h" fram work.

myView.layer.cornerRadius = 15.0; // set as you want. 
myView.layer.borderColor = [UIColor lightGrayColor].CGColor; // set color as you want. 
myView.layer.borderWidth = 1.0; // set as you want. 
+0

myView.layer.shadowColor = ...; – mnl

+0

myView.layer.shadowOffset = ...; – mnl

8

Sau đây là các bước cho User Defined Runtime Attribute.

  1. Mở bảng phân cảnh hoặc tệp xib trong Trình tạo giao diện.
  2. Trong Trình tạo giao diện, chọn đối tượng để thêm thuộc tính vào.
  3. Chọn Xem> Tiện ích> Hiển thị thanh tra danh tính.

Trình kiểm tra nhận dạng xuất hiện trong khu vực tiện ích. Như được hiển thị bên dưới, trình chỉnh sửa thuộc tính thời gian chạy do người dùng xác định là một trong các mục trong trình kiểm tra.

enter image description here

  1. Nhấp vào nút Add (+) ở phía dưới bên trái của người sử dụng định nghĩa các thuộc tính thời gian chạy biên tập.

enter image description here

2

Tôi xin lỗi, tôi chỉ có giải pháp Swift nhưng heres mở rộng UIView của tôi mà tôi sử dụng để làm nhiệm vụ này:

// MARK: Layer Extensions 
extension UIView { 

    func setCornerRadius(#radius: CGFloat) { 
     self.layer.cornerRadius = radius 
     self.layer.masksToBounds = true 
    } 

    func addShadow(#offset: CGSize, radius: CGFloat, color: UIColor, opacity: Float, cornerRadius: CGFloat? = nil) { 
     self.layer.shadowOffset = offset 
     self.layer.shadowRadius = radius 
     self.layer.shadowOpacity = opacity 
     self.layer.shadowColor = color.CGColor 
     if let r = cornerRadius { 
      self.layer.shadowPath = UIBezierPath(roundedRect: bounds, cornerRadius: r).CGPath 
     } 
    } 

    func addBorder(#width: CGFloat, color: UIColor) { 
     self.layer.borderWidth = width 
     self.layer.borderColor = color.CGColor 
     self.layer.masksToBounds = true 
    } 

    func drawStroke(#width: CGFloat, color: UIColor) { 
     let path = UIBezierPath(roundedRect: CGRect(x: 0, y: 0, width: self.w, height: self.w), cornerRadius: self.w/2) 
     let shapeLayer = CAShapeLayer() 
     shapeLayer.path = path.CGPath 
     shapeLayer.fillColor = UIColor.clearColor().CGColor 
     shapeLayer.strokeColor = color.CGColor 
     shapeLayer.lineWidth = width 
     self.layer.addSublayer(shapeLayer) 
    } 

} 

Tôi chưa bao giờ thử nó, nhưng bạn chỉ có thể dán mã này cho bất kỳ tệp Swift nào và có thể gọi chúng từ mã Obj-C.

Các vấn đề liên quan