iOS实现简单的头部缩放功能

2020-01-21 07:11:47刘景俊

本文通过实例代码给大家介绍了iOS实现简单的头部缩放功能。实现思路有头部视图,滚动视图,控制头部动画等多个示例代码块,大家可以参考下本文。

简单实现并集成一个头部缩放的功能,适用于UIScrollView以及其子类。

头部伴随模糊效果放大缩小,并在一定位置时悬停充当导航栏。这里提供实现思路,如有符合可直接使用。

效果如下图。

iOS,头部缩放

实现:

首先分解为两部分,一部分为头部视图,一部分为滚动视图。头部视图负责展示,滚动视图负责控制头部视图如何展示,比如放大和缩小。

一:头部视图

头部视图拆解为负责展示图片的UIImageView,负责模糊效果的UIVisualEffectView,负责标题显示的UILabel,以及返回等功能按钮的UIButton。

进一步分析,模糊效果的视图应该和展示图片的视图做同样的处理,同样的缩放,为了更好的控制将其包装到一containView中。跟据滚动的位置改变containView的大小,模糊视图根据滚动的位置改变模糊的程度。标题视图在滚动视图到达一定位置时出现并停在那里。这里利用UIImageView的特性,改变它的contentMode为UIViewContentModeScaleAspectFill,这样只用简单的改变图片视图的高度时就能营造放大缩小的效果了。