Close Menu
  • Home
  • AI
  • Big Data
  • Cloud Computing
  • iOS Development
  • IoT
  • IT/ Cybersecurity
  • Tech
    • Nanotechnology
    • Green Technology
    • Apple
    • Software Development
    • Software Engineering

Subscribe to Updates

Get the latest technology news from Bigteetechhub about IT, Cybersecurity and Big Data.

    What's Hot

    The Download: supercharged scams and studying AI healthcare

    April 26, 2026

    How Viasat is providing a blueprint for the industrial edge

    April 26, 2026

    Hampshire College to close: Why colleges are going out of business

    April 26, 2026
    Facebook X (Twitter) Instagram
    Facebook X (Twitter) Instagram
    Big Tee Tech Hub
    • Home
    • AI
    • Big Data
    • Cloud Computing
    • iOS Development
    • IoT
    • IT/ Cybersecurity
    • Tech
      • Nanotechnology
      • Green Technology
      • Apple
      • Software Development
      • Software Engineering
    Big Tee Tech Hub
    Home»iOS Development»swift – How would you add this iOS 26 “liquidy” droplet background and animation to your own views or custom tab bar from scratch?
    iOS Development

    swift – How would you add this iOS 26 “liquidy” droplet background and animation to your own views or custom tab bar from scratch?

    big tee tech hubBy big tee tech hubOctober 19, 2025002 Mins Read
    Share Facebook Twitter Pinterest Copy Link LinkedIn Tumblr Email Telegram WhatsApp
    Follow Us
    Google News Flipboard
    swift – How would you add this iOS 26 “liquidy” droplet background and animation to your own views or custom tab bar from scratch?
    Share
    Facebook Twitter LinkedIn Pinterest Email Copy Link


    For various reasons, people create their own tab bar from scratch. Previously, it was fairly simple by adding a horizontal stack with the buttons for each tab and a UIVisualEffectView with UIBlurEffect in the back.

    The iOS 26 tab bar is fairly similar to recreate from scratch too by using a UIGlassEffect instead of the UIBlurEffect . However, I am unable to recreate that “liquidy” droplet background effect behind the selected tab which animates and interacts as you move the selected tab:

    enter image description here

    I believe this “liquid” is also what’s used by Apple in other controls such as the knob of a UISwitch, knob of the UISlider, the droplet when placing the cursor when typing etc.

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

    EDIT 2: This tweet mentions using segmented pickers for this. I am currently investigating this way. I am not sure how to use images in a segment picker.

    EDIT:

    Currently, I have the tab bar recreated as such:

    import UIKit
    import SnapKit
    
    class ViewController: UIViewController {
        
        private let blur = UIVisualEffectView()
        
        override func viewDidLoad() {
            super.viewDidLoad()
            
            let stackView = UIStackView()
            stackView.spacing = 0
            stackView.axis = .horizontal
            
            ["person.2.fill","person.fill","bell.fill"].forEach { name in
                let button = UIButton()
                let config = UIImage.SymbolConfiguration(pointSize: 18, weight: .medium, scale: .large)
                let img = UIImage(systemName: name, withConfiguration: config)?.withTintColor(.label, renderingMode: .alwaysOriginal)
                button.setImage(img, for: .normal)
                button.snp.makeConstraints { make in
                    make.size.equalTo(CGSize(width: 94, height: 54))
                }
                stackView.addArrangedSubview(button)
            }
            
            blur.layer.cornerCurve = .continuous
            if #available(iOS 26.0, *) {
                let effect = UIGlassEffect(style: .regular)
                effect.isInteractive = true
                blur.effect = effect
            } else {
                blur.effect = UIBlurEffect(style: .regular)
            }
            
            blur.contentView.addSubview(stackView)
            stackView.snp.makeConstraints { make in
                make.edges.equalToSuperview().inset(4)
            }
            
            view.addSubview(blur)
            blur.snp.makeConstraints { (make) in
                make.center.equalToSuperview()
            }
            
            
        }
        
        override func viewDidLayoutSubviews() {
            super.viewDidLayoutSubviews()
            blur.layer.cornerRadius = blur.frame.height / 2
        }
    
    
    }
    



    Source link

    Add Animation background bar Custom droplet iOS liquidy scratch Swift tab views
    Follow on Google News Follow on Flipboard
    Share. Facebook Twitter Pinterest LinkedIn Tumblr Email Copy Link
    tonirufai
    big tee tech hub
    • Website

    Related Posts

    ios – Apply shadow only outside of a SwifUI transparent button?

    April 26, 2026

    ios – How to add pictures after keynote update with iPadOS 26.3.1?

    April 25, 2026

    ios – AVCaptureDevice.exposurePointOfInterest readback does not match set value on iPad Pro M4 / M3(UltraWide)and Gen2,3,4(TrueDepth) using resizeAspectFill

    April 25, 2026
    Add A Comment
    Leave A Reply Cancel Reply

    Editors Picks

    The Download: supercharged scams and studying AI healthcare

    April 26, 2026

    How Viasat is providing a blueprint for the industrial edge

    April 26, 2026

    Hampshire College to close: Why colleges are going out of business

    April 26, 2026

    Bringing Professional-Level Skills to Cisco Networking Academy

    April 26, 2026
    Timer Code
    15 Second Timer for Articles
    20
    About Us
    About Us

    Welcome To big tee tech hub. Big tee tech hub is a Professional seo tools Platform. Here we will provide you only interesting content, which you will like very much. We’re dedicated to providing you the best of seo tools, with a focus on dependability and tools. We’re working to turn our passion for seo tools into a booming online website. We hope you enjoy our seo tools as much as we enjoy offering them to you.

    Don't Miss!

    The Download: supercharged scams and studying AI healthcare

    April 26, 2026

    How Viasat is providing a blueprint for the industrial edge

    April 26, 2026

    Subscribe to Updates

    Get the latest technology news from Bigteetechhub about IT, Cybersecurity and Big Data.

      • About Us
      • Contact Us
      • Disclaimer
      • Privacy Policy
      • Terms and Conditions
      © 2026 bigteetechhub.All Right Reserved

      Type above and press Enter to search. Press Esc to cancel.