美文网首页iOS学习开发
巧用阴影实现模糊字体的UILabel

巧用阴影实现模糊字体的UILabel

作者: 移动开发_ziank | 来源:发表于2018-02-26 16:09 被阅读47次

    最近,PM提出了一个新的需求,就是要把一个句子中的某些单词给模糊掉,实现提示用户的效果。要求如下图所示:


    需求图片

    我一下子能够想到的办法,就是利用UIVisualEffectView进行模糊,或者使用图片进行替换。
    首先说使用图片的方式,也就是把要模糊的单词做成图片,然后使用NSAttributedString进行显示,乍一看好像可行,实际做的时候发现,由于图片的大小是固定的,在不同分辨率的iPhone上,显示效果并不一样,在IPhone Plus系列中不能够正确的进行显示,而且每个单词都需要生成一次图片,工作量很大,所以该方案不可取;
    再说使用UIVisualEffectView的方式,这种方式的主要问题在于查找要屏蔽单词的坐标;由于Apple没有提供对应的接口,我们就必须把UILabel的绘制也给接管才能够实现这种方案,实现起来比较复杂;不建议使用该方案,当然如果不赶时间的话,也是可以这么做的。
    由于上面两种方法都不太好,所以就只能继续寻找其他实现发的方式。
    后来想到了利用阴影的方式来进行显示,因为我们知道,字体的阴影本身就是模糊的,如果我们把字体本身隐藏,只显示阴影的话,就会看到模糊的内容,也就是我们的需求。具体代码如下:

    //生成正则表达式,查找要模糊的关键字
    let regex = try NSRegularExpression(pattern: "\(keyword)")
    regex.enumerateMatches(in: text, options: NSRegularExpression.MatchingOptions.reportCompletion, range: NSMakeRange(0, text.count)) { checkingResult, flags, pointer in
        if let range = checkingResult?.range {
            // 设置文本阴影,实现模糊字体的显示
            let shadow = NSShadow()
            shadow.shadowBlurRadius = 3
            shadow.shadowOffset = CGSize(width: 0, height: 0)
            shadow.shadowColor = ColorUtils.blackColor.withAlphaComponent(0.8)
            
            // 设置字体颜色和背景相同,隐藏文本本身
            attrResult.addAttributes([
                NSAttributedStringKey.backgroundColor: ColorUtils.whiteColor, 
                NSAttributedStringKey.foregroundColor: ColorUtils.whiteColor, 
                NSAttributedStringKey.shadow: shadow], 
                    range: range)
        }
    }             
    

    这个样子就利用阴影实现了文本内容的模糊,而不需要使用复杂的实现的。

    相关文章

      网友评论

        本文标题:巧用阴影实现模糊字体的UILabel

        本文链接:https://www.haomeiwen.com/subject/etuyxftx.html