In iOS 26, how can I group multiple Liquid Glass buttons into a single pill view instead of separate buttons that my code currently does.

Note that I need to use UIKit, not SwiftUI.

Below code:

import UIKit import SnapKit class ViewController: UIViewController { override func viewDidLoad() { super.viewDidLoad() let container = UIVisualEffectView() let effect = UIGlassContainerEffect() effect.spacing = 10 container.effect = effect let uIStackView = UIStackView() uIStackView.axis = .horizontal uIStackView.addArrangedSubview(button(systemName: "arrow.uturn.backward")) uIStackView.addArrangedSubview(button(systemName: "arrow.trianglehead.2.clockwise.rotate.90")) uIStackView.addArrangedSubview(button(systemName: "speaker.wave.3.fill")) uIStackView.addArrangedSubview(button(systemName: "star.fill")) container.contentView.addSubview(uIStackView) uIStackView.snp.makeConstraints { make in make.edges.equalToSuperview() } view.addSubview(container) container.snp.makeConstraints { make in make.center.equalToSuperview() } } func button(systemName : String) -> UIButton { let config = UIImage.SymbolConfiguration(pointSize: 14) let button = UIButton() button.setImage(UIImage(systemName: systemName, withConfiguration: config), for: .normal) button.configuration = .glass() let padding = 15.0 button.configuration?.contentInsets = NSDirectionalEdgeInsets(top: padding, leading: padding, bottom: padding, trailing: padding) return button } }

Gives:

enter image description here

As you can see, each button is being rendered as separate instead of a single pill like view.

This article uses glassEffectUnion to achieve it in SwiftUI. How can this be done in Swift instead of SwiftUI?

shim's user avatar

shim

10.3k13 gold badges79 silver badges121 bronze badges

sudoExclamationExclamation's user avatar

2

Instead of a UIGlassContainerEffect, you should just use a simple UIGlassEffect with isInteractive = true.

let container = UIVisualEffectView() let effect = UIGlassEffect(style: .regular) effect.isInteractive = true container.effect = effect container.cornerConfiguration = .capsule() // the rest of the code is the same as in your question

The buttons should not have the .glass() configuration. Use the .borderless() configuration instead.

func button(systemName : String) -> UIButton { let config = UIImage.SymbolConfiguration(pointSize: 14) let button = UIButton() button.configuration = .borderless() button.configuration?.baseForegroundColor = .label button.configuration?.image = UIImage(systemName: systemName, withConfiguration: config) let padding = 15.0 button.configuration?.contentInsets = NSDirectionalEdgeInsets(top: padding, leading: padding, bottom: padding, trailing: padding) return button }

enter image description here

Sweeper's user avatar

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.