Push ViewController with transparent background

I want to have a blurred image as a fixed background in my app. My ViewController structure is like this:

HostViewController (with background image and VisualEffectView)
– NavigationController (modally presented over the HostViewController)
–– ViewController (with clear background color)

  • How to pop from one view controller to another view controller
  • Stop reloading of web app launched from iPhone Home Screen
  • ios uitextfield like notes
  • A complete solution to LOCALLY validate an in-app receipts and bundle receipts on iOS 7
  • Passing array through segue in swift
  • “Unknown class BarChartView in Interface Builder file” error when using a custom framework
  • When I want to push to another ViewController (which has also clear background color) from the NavigationController, the new ViewController overlaps the first ViewController which is visible through the new ViewController. That looks quite strange and ugly. My question is how I could achieve a push animation with a fixed background without the ViewControllers overlaying each other?

    You can see a sample of this effect in the app “TuneShell” which can be found in the App Store.

    Thanks in advance, Fabian.


    EDIT:
    To clarify my problem I added this gif:

    As you can see in the gif, when I push to the Playlist-ViewController, the rootViewController is visible through the new Playlist-ViewController while it’s animating. I want to fix that.

    WHAT I WANT TO ACHIEVE:

    http://fabian-thies.tk/demo.gif

    Solutions Collect From Internet About “Push ViewController with transparent background”

    I have a solution for this way back, but I don’t think this is the best one and keep in mind that this is just a workaround.

    First thing to do is set your global background like:

    - (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
    
        ..
        self.window.backgroundColor = [UIColor colorWithPatternImage:[UIImage imageNamed:@"blur.jpeg"]];
    
        return YES;
    }
    

    blur.jpeg is a clear(not blurred) image I’m using this for example (got it from google)

    enter image description here

    Next is subclassing UIViewController for global use, but its up to you how to implement it globally.

    //BGBlurViewController.h
    //
    @interface BGBlurViewController : UIViewController
    
    @end
    
    //BGBlurViewController.m
    //
    @implementation BGBlurViewController
    
    - (void)viewDidLoad {
        [super viewDidLoad];
        // Do any additional setup after loading the view.
    
        UIToolbar *background = [[UIToolbar alloc] initWithFrame:CGRectMake(0, 0, self.view.frame.size.width, self.view.frame.size.height)];
        [background setBarStyle:UIBarStyleBlackTranslucent];
        [self.view addSubview:background];
        [self.view sendSubviewToBack:background];
    }
    
    @end
    

    I’m using UIToolbar as a background of UIViewController and achieve blur effect.


    This is how to use the subclassed UIViewController(BGBlurViewController)

    //RootViewController
    //
    #import "BGBlurViewController.h"
    
    @interface ViewController : BGBlurViewController
    
    @end
    

    and another:

    //View next to rootViewController
    //
    #import "BGBlurViewController.h"
    
    @interface ViewController2 : BGBlurViewController
    
    @end
    

    NOTE:
    I’m setting the backgroundColor of the UIViewControllers (ViewController and ViewController2) to Default/none in storyboard, again this is just a workaround…


    Here is the sample output in runtime:

    enter image description here

    Hope this would help you.. Cheers..