activity - status bar ios

Controlador de vista modal translúcido iOS 7

Question

La aplicación App Store en iOS 7 usa un efecto de vidrio esmerilado donde es posible ver la vista detrás. ¿Esto está usando una API integrada en iOS 7 o es un código personalizado? Esperaba que fuera el primero, pero no veo ninguna referencia obvia en la documentación. Las cosas obvias como (como establecer la propiedad alfa en la vista modal) no parecen tener ningún efecto.

Para ver un ejemplo, abra la aplicación App Store y presione el botón en la esquina superior derecha.

Answer 1

Acabo de volver a implementar la solución de Sebastian Hojas en Swift:

1. Cree una extensión UIView y agregue el siguiente método:

extension UIView {
    func convertViewToImage() -> UIImage{
        UIGraphicsBeginImageContext(self.bounds.size);
        self.drawViewHierarchyInRect(self.bounds, afterScreenUpdates: true)
        let image = UIGraphicsGetImageFromCurrentImageContext()
        UIGraphicsEndImageContext();

        return image;
    }
}

2. Haz una imagen de la vista actual y difumina usando el efecto de imagen de Apple (encontré una reimplementación de esto en Swift aquí: SwiftUIImageEffects

var imageOfUnderlyingView = self.view.convertViewToImage()
imageOfUnderlyingView = imageOfUnderlyingView.applyBlurWithRadius(2, tintColor: UIColor(white: 0.0, alpha: 0.5), saturationDeltaFactor: 1.0, maskImage: nil)!

3. Establecerlo como fondo de su superposición.

let backView = UIImageView(frame: self.view.frame)
backView.image = imageOfUnderlyingView
backView.backgroundColor = UIColor.blackColor().colorWithAlphaComponent(0.5)
view.addSubview(backView)

Answer 2

Apple lanzó la categoría UIImageEffect para esos efectos. Esa categoría se debe agregar manualmente al proyecto y es compatible con iOS7.

Answer 3

Como dijo @rckoenes, no existe un marco provisto por Apple para obtener ese efecto. Pero algunas personas ya construyeron buenas alternativas, como esta, por ejemplo:

https://github.com/JagCesar/iOS-blur/

Answer 4

Con el lanzamiento de iOS 8.0, ya no hay necesidad de obtener una imagen y volverla borrosa. Como señaló Andrew Plummer , puede usar UIVisualEffectView con UIBlurEffect .

UIViewController * contributeViewController = [[UIViewController alloc] init];
UIBlurEffect * blurEffect = [UIBlurEffect effectWithStyle:UIBlurEffectStyleLight];
UIVisualEffectView *beView = [[UIVisualEffectView alloc] initWithEffect:blurEffect];
beView.frame = self.view.bounds;

contributeViewController.view.frame = self.view.bounds;
contributeViewController.view.backgroundColor = [UIColor clearColor];
[contributeViewController.view insertSubview:beView atIndex:0];
contributeViewController.modalPresentationStyle = UIModalPresentationOverCurrentContext;

[self presentViewController:contributeViewController animated:YES completion:nil];

Solución que funciona antes de iOS 8

Me gustaría extender la respuesta de Rckoenes:

Como se destacó, puede crear este efecto de la siguiente manera:

1. Convierte el UIView subyacente en un UIImage
2. Desenfocar el UIImage
3. Establezca el UIImage como fondo de su vista.

Suena como un montón de trabajo, pero en realidad se hace bastante sencillo:

1. Cree una categoría de UIView y agregue el siguiente método:

-(UIImage *)convertViewToImage
{
    UIGraphicsBeginImageContext(self.bounds.size);
    [self drawViewHierarchyInRect:self.bounds afterScreenUpdates:YES];
    UIImage *image = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();

    return image;
}

2. Haz una imagen de la vista actual y difumina usando la categoría Efecto de la imagen de Apple ( download )

UIImage* imageOfUnderlyingView = [self.view convertViewToImage];
imageOfUnderlyingView = [imageOfUnderlyingView applyBlurWithRadius:20
                             tintColor:[UIColor colorWithWhite:1.0 alpha:0.2]
                 saturationDeltaFactor:1.3
                             maskImage:nil];

3. Establecerlo como fondo de su superposición.

-(void)viewDidLoad
{
   self.view.backgroundColor = [UIColor clearColor];
   UIImageView* backView = [[UIImageView alloc] initWithFrame:self.view.frame];
   backView.image = imageOfUnderlyingView;
   backView.backgroundColor = [[UIColor blackColor] colorWithAlphaComponent:0.6];
   [self.view addSubview:backView];
}

Answer 5

Creo que esta es la solución más fácil para un controlador de vista modal que se superpone a todo con un bonito desenfoque (iOS8)

    UIViewController * contributeViewController = [[UIViewController alloc] init];

    UIBlurEffect * blurEffect = [UIBlurEffect effectWithStyle:UIBlurEffectStyleLight];
    UIVisualEffectView *beView = [[UIVisualEffectView alloc] initWithEffect:blurEffect];
    beView.frame = self.view.bounds;

    contributeViewController.view.frame = self.view.bounds;
    contributeViewController.view.backgroundColor = [UIColor clearColor];
    [contributeViewController.view insertSubview:beView atIndex:0];
    contributeViewController.modalPresentationStyle = UIModalPresentationOverCurrentContext;

    [self presentViewController:contributeViewController animated:YES completion:nil];

Answer 6

Desde iOS 8, esto funciona:

        let vc = UIViewController()
        vc.view = UIVisualEffectView(effect: UIBlurEffect(style: .Light))
        vc.modalPresentationStyle = .OverFullScreen

        let nc = UINavigationController(rootViewController: vc)
        nc.modalPresentationStyle = .OverFullScreen

        presentViewController(nc, animated: true, completion: nil)

La clave es el indicador .OverFullScreen y garantiza que viewControllers tenga un desenfoque UIVisualEffectView que es la primera vista visible.

Answer 7

En lugar de presentar viewController como modalView, puede agregarlo como un niño viewController y crear una animación personalizada. Entonces, solo necesitaría cambiar la vista predeterminada de viewController a una UIToolBar en viewDidLoad .

Esto le permitirá imitar la vista modal borrosa de la aplicación lo más cerca posible.

Answer 8

He subido mi toma del controlador de vista borrosa a [GitHub] [1]. También viene con una subclase segue para que pueda usarla en sus guiones gráficos.

Repositorio: https://github.com/datinc/DATBlurSegue

Answer 9

No hay una API disponible en el SDK de iOS 7 que le permitirá "congelar" el controlador de vista subyacente.

Lo que he hecho es renderizar la vista subyacente de una imagen, que he esmerilado y configurar como fondo la vista que se está presentando.

Apple proporciona un buen ejemplo para esto: https://developer.apple.com/downloads/index.action?name=WWDC%202013

El proyecto que desea se llama, iOS_RunningWithASnap

Answer 10

Puede usar UIToolbar como fondo. Por defecto, UIToolbar tiene una altura de 50px. Agregue restricciones de diseño automático en UIToolbar. Luego seleccione la restricción de altura y modifíquela.

La jerarquía se verá así:

UIView -> clear colour for background.
- UIToolbar
- Other contents.

Answer 11

Solución rápida y fácil con soporte XIB que puede usar para los chicos de la vieja escuela https://github.com/cezarywojcik/CWPopup

Answer 12

Un par de enfoques alternativos que también funcionan en iOS 5 y 6:

FXBlurView: https://github.com/nicklockwood/FXBlurView

iOS RealtimeBlur: https://github.com/alexdrone/ios-realtimeblur

Answer 13

Una forma más simple de lograr esto (basada en la respuesta de Andrew Plummer) con Interface Builder (también elimina los efectos secundarios que aparecen en la respuesta de Andrews):

• En IB agregue la Vista de Efectos Visuales a su Controlador de Vista en sus otras vistas;
• Haga las restricciones superior, inferior, izquierda, derecha desde la Vista de efectos visuales a la vista superior (principal), establezca todas ellas en 0;
• Establecer el estilo de desenfoque;
• Agregue el código donde presenta su nuevo Controlador de vista elegante:

UIViewController *fancyViewController = [self.storyboard instantiateViewControllerWithIdentifier:@"yourStoryboardIDFOrViewController"];

fancyViewController.view.backgroundColor = [UIColor clearColor];
fancyViewController.modalPresentationStyle = UIModalPresentationOverCurrentContext;

[self presentViewController:fancyViewController
                   animated:YES
                 completion:nil];

En realidad, las líneas segunda y tercera son MUY importantes; de lo contrario, el controlador parpadeará y luego se volverá negro.