De App Store-app op iOS 7 gebruikt een matglas-achtig effect waarbij het mogelijk is om het zicht erachter te zien. Gebruikt dit een API die is ingebouwd in iOS 7 of is het aangepaste code. Ik hoopte dat het het eerste zou zijn, maar ik zie geen duidelijke verwijzingen in de documentatie. Voor de hand liggende dingen zoals (zoals het instellen van de alfa-eigenschap in de modale weergave) lijken geen effect te hebben.
Om een voorbeeld te zien, open je de App Store-app en druk je op de knop rechtsboven.
Antwoord 1, autoriteit 100%
Met de release van iOS 8.0 is het niet meer nodig om een afbeelding te maken en deze te vervagen. Zoals Andrew Plummeropmerkte, kun je UIVisualEffectViewmet 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];
Oplossing die werkt vóór iOS 8
Ik wil graag uitbreiden op het antwoord van rckoenes:
Zoals benadrukt, kunt u dit effect creëren door:
- Converteer de onderliggende UIView naar een UIImage
- Vervaag de UIImage
- Stel de UIImage in als achtergrond van uw weergave.
Klinkt als veel werk, maar is eigenlijk vrij eenvoudig gedaan:
1. Maak een categorie van UIView en voeg de volgende methode toe:
-(UIImage *)convertViewToImage
{
UIGraphicsBeginImageContext(self.bounds.size);
[self drawViewHierarchyInRect:self.bounds afterScreenUpdates:YES];
UIImage *image = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
return image;
}
2. Maak een afbeelding van de huidige weergave en vervaag deze met Apple’s categorie Afbeeldingseffect(download)
UIImage* imageOfUnderlyingView = [self.view convertViewToImage];
imageOfUnderlyingView = [imageOfUnderlyingView applyBlurWithRadius:20
tintColor:[UIColor colorWithWhite:1.0 alpha:0.2]
saturationDeltaFactor:1.3
maskImage:nil];
3. Stel het in als achtergrond van je overlay.
-(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];
}
Antwoord 2, autoriteit 19%
Zojuist de oplossing van Sebastian Hojas opnieuw geïmplementeerd in Swift:
1. Maak een UIView-extensie en voeg de volgende methode toe:
extension UIView {
func convertViewToImage() -> UIImage{
UIGraphicsBeginImageContext(self.bounds.size);
self.drawViewHierarchyInRect(self.bounds, afterScreenUpdates: true)
let image = UIGraphicsGetImageFromCurrentImageContext()
UIGraphicsEndImageContext();
return image;
}
}
2. Maak een afbeelding van de huidige weergave en vervaag deze met behulp van Apple’s Image Effect (ik vond hier een herimplementatie hiervan in Swift: SwiftUIImageEffects
var imageOfUnderlyingView = self.view.convertViewToImage()
imageOfUnderlyingView = imageOfUnderlyingView.applyBlurWithRadius(2, tintColor: UIColor(white: 0.0, alpha: 0.5), saturationDeltaFactor: 1.0, maskImage: nil)!
3. Stel het in als achtergrond van je overlay.
let backView = UIImageView(frame: self.view.frame)
backView.image = imageOfUnderlyingView
backView.backgroundColor = UIColor.blackColor().colorWithAlphaComponent(0.5)
view.addSubview(backView)
Antwoord 3, autoriteit 11%
Ik denk dat dit de gemakkelijkste oplossing is voor een modal view-controller die alles met een mooie vervaging bedekt (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];
Antwoord 4, autoriteit 9%
Er is geen API beschikbaar in de iOS 7 SDK waarmee u de onderliggende weergavecontroller kunt “bevriezen”.
Wat ik heb gedaan, is de onderliggende weergave naar een afbeelding renderen, die ik vervolgens mat en die als achtergrond instelde voor de weergave die wordt gepresenteerd.
Apple geeft hier een goed voorbeeld van: https://developer. apple.com/downloads/index.action?name=WWDC%202013
Het gewenste project heet iOS_RunningWithASnap
Antwoord 5, autoriteit 8%
Een iets eenvoudigere manier om dit te bereiken (gebaseerd op het antwoord van Andrew Plummer) met Interface Builder (het verwijdert ook de bijwerking die in het antwoord van Andrew voorkomt):
- Voeg in IB Visual Effect View toe aan uw View Controller onder uw andere views;
- Maak beperkingen voor boven, onder, links, rechts van de visuele effectweergave naar de bovenliggende (bovenliggende) weergave, stel ze allemaal in op 0;
- Vervagingsstijl instellen;
- Voeg de code toe waar je je nieuwe mooie View Controller presenteert:
UIViewController *fancyViewController = [self.storyboard instantiateViewControllerWithIdentifier:@"yourStoryboardIDFOrViewController"];
fancyViewController.view.backgroundColor = [UIColor clearColor];
fancyViewController.modalPresentationStyle = UIModalPresentationOverCurrentContext;
[self presentViewController:fancyViewController
animated:YES
completion:nil];
Eigenlijk zijn de tweede en derde regel ZEER belangrijk – anders knippert de controller en wordt dan zwart.
Antwoord 6, autoriteit 7%
Sinds iOS 8 werkt dit:
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)
De sleutel is de vlag .OverFullScreenen zorgt ervoor dat de viewControllers een wazig UIVisualEffectView hebben dat de eerste zichtbare weergave is.
Antwoord 7, autoriteit 5%
Zoals @rckoenes al zei, is er geen door Apple geleverd raamwerk om dat effect te krijgen. Maar sommige mensen hebben al goede alternatieven gebouwd, zoals deze bijvoorbeeld:
https://github.com/JagCesar/iOS-blur/
Antwoord 8, autoriteit 4%
Een paar alternatieve benaderingen die ook werken op iOS 5 en 6:
FXBlurView: https://github.com/nicklockwood/FXBlurView
iOS RealtimeBlur: https://github.com/alexdrone/ios-realtimeblur
Antwoord 9, autoriteit 4%
Ik heb mijn versie van de wazige weergave-controller geüpload naar [GitHub][1]. Het wordt ook geleverd met een segue-subklasse, zodat je het in je storyboards kunt gebruiken.
Repository: https://github.com/datinc/DATBlurSegue
Antwoord 10, autoriteit 4%
Snel & gemakkelijke oplossing
met XIB-ondersteuning die je kunt gebruiken voor de oude schooljongens
https://github.com/cezarywojcik/CWPopup
Antwoord 11, autoriteit 4%
In plaats van de viewController als een modalView te presenteren, kunt u deze toevoegen als een onderliggende viewController en een aangepaste animatie maken. U hoeft dan alleen de standaardweergave van de viewController te wijzigen in een UIToolBar in viewDidLoad.
Hierdoor kunt u de wazige modale weergave van de appstore zo goed mogelijk nabootsen.
Antwoord 12, autoriteit 2%
Apple heeft de UIImageEffectcategorie voor die effecten. Die categorie moet handmatig aan het project worden toegevoegd en het ondersteunt iOS7.
Antwoord 13
U kunt UIToolbar als achtergrond gebruiken.
Standaard heeft UIToolbar een hoogte van 50px.
Voeg automatische lay-outbeperkingen toe aan de UIToolbar.
Selecteer vervolgens de hoogtebeperking en wijzig deze.
Hiërarchie ziet er als volgt uit:
UIView -> clear colour for background.
- UIToolbar
- Other contents.