如何模糊分段控件的背景?

本文介绍了如何模糊分段控件的背景?的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！ 问题描述

我正在UITableViewDelegate的 tableView(_:viewForHeaderInSection:)内定义分段控件.由于我使用的是 UITableView.Style.plain ，因此当表格滚动时，带有分段控件的标题将保持在固定位置.

I'm defining a segmented control inside of a UITableViewDelegate's tableView(_:viewForHeaderInSection:). Since I'm using UITableView.Style.plain, when the table scrolls, the header with the segmented control stays in a fixed position.

我想创建一些上下文，以便未选择的分段控件的背景模糊正在其后滚动的表.这是ios 13分段控件的外观:

I'd like to create some context so that the background of the unselected segmented control blurs the table that is scrolling behind it. Here is what an ios 13 segmented control looks like:

是否有一种方法可以模糊分段控件未选择的分段的背景?

Is there a way to blur the background of a segmented control's unselected segments?

我能够创建这样的分段控件

I'm able to created a segmented control like this

let items = ["First", "Second"] let customSC = UISegmentedControl(items: items) customSC.selectedSegmentIndex = 0

并且我可以使用 stackoverflow/a/25706250/784637

let blurEffect = UIBlurEffect(style: .dark) let blurEffectView = UIVisualEffectView(effect: blurEffect) //always fill the view blurEffectView.frame = self.view.bounds blurEffectView.autoresizingMask = [.flexibleWidth, .flexibleHeight]

但我不知道如何将所有内容整合在一起

But I don't know how to bring everything together

推荐答案

这是一种可行的方法...这个想法是将模糊效果视图放在某些包装器视图中的分段控件后面，并将该视图提供为表的标题.

Here is possible approach... the idea is to place blur-effect view behind the segmented control in some wrapper view and provide that view as header for table.

这里是演示(仅使用我的一些设置就可以看到，但是这些都是可配置的)，当然gif对此不是很好，但是可见模糊效果有效.

Here is demo (how it looks with just some my settings, but those are all configurable), of course gif is not very good for this, but it is visible that blur effect works.

方法演示代码:

class HeaderView: UIView { override init(frame: CGRect) { super.init(frame: frame) let blurEffect = UIBlurEffect(style: .dark) // .light looks better as for me, so used in demo let blurEffectView = UIVisualEffectView(effect: blurEffect) blurEffectView.translatesAutoresizingMaskIntoConstraints = false let items = ["First", "Second"] let customSC = UISegmentedControl(items: items) customSC.selectedSegmentIndex = 0 customSC.translatesAutoresizingMaskIntoConstraints = false self.addSubview(customSC) customSC.centerXAnchor.constraint(equalTo: self.centerXAnchor).isActive = true customSC.centerYAnchor.constraint(equalTo: self.centerYAnchor).isActive = true customSC.widthAnchor.constraint(equalToConstant: 200).isActive = true customSC.heightAnchor.constraint(equalToConstant: 60).isActive = true self.insertSubview(blurEffectView, belowSubview: customSC) blurEffectView.leadingAnchor.constraint(equalTo: customSC.leadingAnchor).isActive = true blurEffectView.trailingAnchor.constraint(equalTo: customSC.trailingAnchor).isActive = true blurEffectView.topAnchor.constraint(equalTo: customSC.topAnchor).isActive = true blurEffectView.bottomAnchor.constraint(equalTo: customSC.bottomAnchor).isActive = true blurEffectView.layer.cornerRadius = 8 blurEffectView.layer.masksToBounds = true } required init?(coder: NSCoder) { fatalError("init(coder:) has not been implemented") } }