2013-07-06 32 views
19

Voglio aggiungere ombra e ictus ombra su UIView Questo è ciò che il mio stilista mi ha dato per applicare l'ombra,iOS: come aggiungere ombra esterna e ombreggiatura su UIView?

  • Per ombra, lui mi ha detto di usare RGB (176.199.226) con 90% di opacità, distanza 3 e dimensione 5

  • Per l'ombra del tratto, ha detto di applicare, RGB (209,217,226) di dimensione 1 e 100% di opacità.

Questo è photoshop schermo effetti applicata,

enter image description hereenter image description here

La vista con l'ombra desiderata (output previsto)

enter image description here

ho provato il seguente per ottenere t egli ombra

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; 

E questo è il risultato di essa,

enter image description here

Sto avendo problemi a capire come posso applicare ictus e ombra a mostrare in immagini di Photoshop (I ho aggiunto sopra). Come applicare distanza, diffusione, dimensioni, posizione?

Qualcuno può indicarmi una guida per applicare questo tipo di ombre? Ci sono molti effetti ombra che emergono e voglio sapere come può essere possibile, invece di porre ognuna delle domande qui!

Grazie :)

risposta

22

credo che la maggior parte di configurazione si cerca può essere raggiunto utilizzando la proprietà 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; 

ad esempio, impostando shadowInsets questo modo

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

avrete una bella ombra desiderabile:

enter image description here

Si può decidere ora come si desidera che il rettangolo di ombra per essere costruito controllando i riquadri del rettangolo del percorso shadow.

6

Per dare Border Di UIView.

Aggiungi #import "QuartzCore/QuartzCore.h" lavoro 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

Di seguito sono riportati i passaggi per User Defined Runtime Attribute.

  1. Aprire uno storyboard o un file xib in Interface Builder.
  2. In Interface Builder, selezionare l'oggetto a cui aggiungere l'attributo.
  3. Scegliete Visualizza> Utilità> Mostra Identità.

L'ispettore di identità viene visualizzato nell'area di utilità. Come mostrato di seguito, l'editor degli attributi di runtime definito dall'utente è uno degli elementi nell'ispettore.

enter image description here

  1. clic sul pulsante Aggiungi (+) in basso a sinistra del runtime definiti dall'utente attributi editore.

enter image description here

2

Mi dispiace, ho solo la soluzione di Swift, ma heres mie estensioni UIView che io uso per fare questo compito:

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

} 

ho mai provato, ma si può solo incollare questo codice per qualsiasi file Swift e probabilmente li chiamano dal codice Obj-C.

Problemi correlati