2013-07-06 9 views
19

chcę dodać Cień i skoku cień na UIView To właśnie mój projektant dał mi zastosować cień,iOS: Jak dodać cień cienia i cieniowania na UIView?

  • Dla cień, kazał mi używać RGB (176,199,226) z 90% krycia, odległość-3 i rozmiar-5

  • Aby uzyskać cień do obrysu, polecił zastosować RGB (209,217,226) o rozmiarze 1 i 100% nieprzezroczystości.

to Photoshop stosować ekran efekty,

enter image description hereenter image description here

Widok z wymaganym cienia (oczekiwany wynik)

enter image description here

Próbowałem następujących zdobyć t on cień

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; 

I to jest wynikiem tego,

enter image description here

Mam problem w zrozumieniu w jaki sposób można zastosować obrys i cień, jak pokazano na screeny photoshop (I "powyżej"). Jak zastosować odległość, rozkład, rozmiar, położenie?

Czy ktoś może wskazać mi przewodnik dotyczący stosowania tego rodzaju cieni? Pojawia się wiele efektów cienia i chcę się dowiedzieć, jak to możliwe, zamiast zadawać każde z pytań tutaj!

Dzięki :)

Odpowiedz

22

wierzę większość konfiguracji Państwo szukać można osiągnąć stosując właściwość shadowPath.

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; 

przykład poprzez ustawienie shadowInsets ten sposób

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

dostaniesz piękny pożądany cień:

enter image description here

Możesz teraz zdecydować, jak chcesz prostokąt cień się skonstruowane przez kontrolowanie wstawek prostokąta ścieżki cienia.

6

Dla dają granicy Of UIView.

Dodaj pracę #import "QuartzCore/QuartzCore.h" fram.

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

Poniżej przedstawiono kroki dla User Defined Runtime Attribute.

  1. Otwórz scenorys lub plik xib w programie Interface Builder.
  2. W programie Interface Builder wybierz obiekt, do którego chcesz dodać atrybut.
  3. Wybierz polecenie Widok> Narzędzia> Pokaż inspektora tożsamości.

Inspektor tożsamości pojawia się w obszarze narzędziowym. Jak pokazano poniżej, edytor atrybutów środowiska wykonawczego zdefiniowany przez użytkownika jest jednym z elementów inspektora.

enter image description here

  1. Kliknij przycisk Dodaj (+) w lewym dolnym rogu wykonywania atrybuty zdefiniowane przez użytkownika edytor.

enter image description here

2

przykro mi, mam tylko Swift rozwiązanie, ale heres moje rozszerzenia UIView które używam do wykonania tego zadania:

// 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) 
    } 

} 

Nigdy nie próbowałem, ale może po prostu wkleić ten kod do dowolnego pliku Swift i prawdopodobnie wywołaj go z kodu Obj-C.