How would you add this iOS 26 "liquidy" droplet background and animation to your personal views or customized tab bar from scratch?

For varied causes, individuals create their very own tab bar from scratch. Beforehand, it was pretty easy by including a horizontal stack with the buttons for every tab and a UIVisualEffectView with UIBlurEffect within the again.

The iOS 26 tab bar is pretty just like recreate from scratch too through the use of a UIGlassEffect as an alternative of the UIBlurEffect . Nonetheless, I’m unable to recreate that "liquidy" droplet background impact behind the chosen tab which animates and interacts as you progress the chosen tab:

I imagine this "liquid" can also be what’s utilized by Apple in different controls such because the knob of a UISwitch, knob of the UISlider, the droplet when inserting the cursor when typing and many others.

How would you recreate that animation in your personal customized views or customized tab bar created from scratch?

EDIT 2: This tweet mentions utilizing segmented pickers for this. I’m presently investigating this fashion. I’m not positive the best way to use photographs in a section picker.

https://x.com/michaeicantcode/standing/1979848758671343784?s=46

EDIT:

Presently, I’ve the tab bar recreated as such:

import UIKit
import SnapKit

class ViewController: UIViewController {
    
    personal let blur = UIVisualEffectView()
    
    override func viewDidLoad() {
        tremendous.viewDidLoad()
        
        let stackView = UIStackView()
        stackView.spacing = 0
        stackView.axis = .horizontal
        
        ["person.2.fill","person.fill","bell.fill"].forEach { title in
            let button = UIButton()
            let config = UIImage.SymbolConfiguration(pointSize: 18, weight: .medium, scale: .giant)
            let img = UIImage(systemName: title, withConfiguration: config)?.withTintColor(.label, renderingMode: .alwaysOriginal)
            button.setImage(img, for: .regular)
            button.snp.makeConstraints { make in
                make.dimension.equalTo(CGSize(width: 94, top: 54))
            }
            stackView.addArrangedSubview(button)
        }
        
        blur.layer.cornerCurve = .steady
        if #accessible(iOS 26.0, *) {
            let impact = UIGlassEffect(type: .common)
            impact.isInteractive = true
            blur.impact = impact
        } else {
            blur.impact = UIBlurEffect(type: .common)
        }
        
        blur.contentView.addSubview(stackView)
        stackView.snp.makeConstraints { make in
            make.edges.equalToSuperview().inset(4)
        }
        
        view.addSubview(blur)
        blur.snp.makeConstraints { (make) in
            make.heart.equalToSuperview()
        }
        
        
    }
    
    override func viewDidLayoutSubviews() {
        tremendous.viewDidLayoutSubviews()
        blur.layer.cornerRadius = blur.body.top / 2
    }


}