Swift-圆角与阴影

iOS中圆角实现非常容易,对比而言,设置阴影则需要设置颜色,偏移位置,阴影透明度,阴影半径:
<pre><code>` /* The color of the shadow. Defaults to opaque black. Colors created
* from patterns are currently NOT supported. Animatable. */

/** Shadow properties. **/
open var shadowColor: CGColor?


/* The opacity of the shadow. Defaults to 0. Specifying a value outside the
 * [0,1] range will give undefined results. Animatable. */

open var shadowOpacity: Float


/* The shadow offset. Defaults to (0, -3). Animatable. */

open var shadowOffset: CGSize


/* The blur radius used to create the shadow. Defaults to 3. Animatable. */

open var shadowRadius: CGFloat`</code></pre>
FlyElephant.png

图一实现的代码非常原始,简单设置了阴影颜色:
<pre><code>` let view:UIView = UIView.init(frame: CGRect(x: 50, y: 200, width: 50, height: 50))

    view.backgroundColor = UIColor.blue
    
    view.layer.shadowColor = UIColor.red.cgColor
    view.layer.shadowOpacity = 1.0
    
    self.view.addSubview(view)`</code></pre>

对比图一阴影分步的更加均匀,shadowOffset都设置了0:
<pre><code>` let view1:UIView = UIView.init(frame: CGRect(x: 150, y: 200, width: 50, height: 50))

    view1.backgroundColor = UIColor.blue
    
    view1.layer.shadowColor = UIColor.red.cgColor
    view1.layer.shadowOpacity = 1.0
    view1.layer.shadowOffset = CGSize(width: 0, height: 0)
    view1.layer.shadowRadius = 4
    
    self.view.addSubview(view1)`</code></pre>

图三是设置阴影,同时设置圆角,阴影不显示:
<pre><code>` let view2:UIView = UIView.init(frame: CGRect(x: 250, y: 200, width: 50, height: 50))

    view2.backgroundColor = UIColor.blue
    view2.layer.masksToBounds = true
    view2.layer.cornerRadius = 25
    
    view2.layer.shadowColor = UIColor.red.cgColor
    view2.layer.shadowOpacity = 1.0
    view2.layer.shadowOffset = CGSize(width: 0, height: 0)
    view2.layer.shadowRadius = 4
    
    self.view.addSubview(view2)`</code></pre>

图四既设置圆角同时设置阴影:

<pre><code>` let view2:UIView = UIView.init(frame: CGRect(x: 260, y: 200, width: 50, height: 50))

    view2.backgroundColor = UIColor.blue
    view2.layer.cornerRadius = 25
    
    view2.layer.shadowColor = UIColor.red.cgColor
    view2.layer.shadowOpacity = 1.0
    view2.layer.shadowOffset = CGSize(width: 0, height: 0)
    view2.layer.shadowRadius = 4
    view2.layer.masksToBounds = false
    
    self.view.addSubview(view2)`</code></pre>

<pre><code>` let shadowView:UIView = UIView(frame: CGRect(x: 50, y: 300, width: 50, height: 50))
shadowView.backgroundColor = UIColor.white
shadowView.layer.shadowColor = UIColor.red.cgColor
shadowView.layer.shadowOpacity = 1.0
shadowView.layer.shadowOffset = CGSize(width: 0, height: 0)
shadowView.layer.shadowRadius = 4
shadowView.clipsToBounds = false
shadowView.layer.cornerRadius = 25.0

    let innerView:UIView = UIView.init(frame: CGRect(x: 0, y: 0, width: 50, height: 50))
    
    innerView.backgroundColor = UIColor.yellow
    innerView.clipsToBounds = true
    innerView.layer.cornerRadius = 25
    
    shadowView.addSubview(innerView)
    
    self.view.addSubview(shadowView)`</code></pre>
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • text-shadow是给文本添加阴影效果,box-shadow是给元素块添加周边阴影效果。随着HTML5和CSS...
    arlene112阅读 2,290评论 0 1
  • 好吧,圆和椭圆是很好的,但圆角矩形如何?我们现在也可以那样做吧?——Steve Jobs 我们在第3章“图层几何”...
    liril阅读 2,193评论 4 6
  • 在iOS中随处都可以看到绚丽的动画效果,实现这些动画的过程并不复杂,今天将带大家一窥iOS动画全貌。在这里你可以看...
    F麦子阅读 5,141评论 5 13
  • 在iOS中随处都可以看到绚丽的动画效果,实现这些动画的过程并不复杂,今天将带大家一窥ios动画全貌。在这里你可以看...
    每天刷两次牙阅读 8,566评论 6 30
  • 1、属性选择器:id选择器 # 通过id 来选择类名选择器 . 通过类名来选择属性选择器 ...
    Yuann阅读 1,656评论 0 7