将模态视图放在视图上并使背景变灰

Posted 2023-02-23

【中文标题】将模态视图放在视图上并使背景变灰

【英文标题】：Putting a modal view over a view and making the background grey

【发布时间】：2015-09-07 07:50:27

【问题描述】：

在过去的 3 个小时里，我一直在尝试完成此操作，但我不知道如何执行此操作。有人可以帮忙吗？

所以这就是我想要做的。当我按下一个按钮时，比如说一个Sign In 按钮，我希望弹出一个模态视图，使其后面的视图变为灰色且不可点击。在这个模态视图上，我想要几个按钮和静态标签。

我已经阅读并尝试理解了一些资源，例如：Present modal view controller in half size parent controller、http://makeapppie.com/2014/08/30/the-swift-swift-tutorials-adding-modal-views-and-popovers/、How to use modal views in swift? 和其他一些资源。但是，我很难理解代码。

到目前为止，我有这段代码应该让模态视图位于它后面的视图之上：

@IBAction func signIn(sender: AnyObject) 
    self.modalTransitionStyle = UIModalTransitionStyle.CoverVertical
    // Cover Vertical is necessary for CurrentContext
    self.modalPresentationStyle = .CurrentContext
    // Display on top of    current UIView
    self.presentViewController(SignInViewController(), animated: true, completion: nil)

但这并没有产生我想要的效果。有人帮忙吗？

【参考方案1】：

首先，创建灰色的空视图

func makeGrayView() -> UIView 
    var view = UIView(frame:UIScreen.mainScreen().applicationFrame)
    self.view.backgroundColor = UIColor.greyColor()
    return view

其次，将刚刚创建的视图设置为叠加层的背景

var backView = self.makeGrayView()
self.view.addSubview(backView)

【参考方案2】：

你必须使用 Cusotm UIViewControllerAnimation 类来实现这一点。使用上面的代码.CreateTransparentTransition.h and .m File

#import <Foundation/Foundation.h>

@interface TransparentTransition :NSObject<UIViewControllerAnimatedTransitioning,UIViewControllerTransitioningDelegate>   
BOOL isPresenting;

@end

//TransparentTransition.m

#import "TransparentTransition.h"

@implementation TransparentTransition
- (NSTimeInterval)transitionDuration:(id <UIViewControllerContextTransitioning>)transitionContext
return 0.8f;


- (void)animateTransition:(id <UIViewControllerContextTransitioning>)transitionContext

UIViewController *fromVC = [transitionContext viewControllerForKey:UITransitionContextFromViewControllerKey];
UIViewController *toVC = [transitionContext viewControllerForKey:UITransitionContextToViewControllerKey];
UIView *toView = toVC.view;
UIView *fromView = fromVC.view;

UIView* containerView = [transitionContext containerView];


// Position the presented view off the top of the container view

if(isPresenting)
   [containerView addSubview:toView];
    toView.frame = CGRectMake(0, -toView.frame.size.height, toView.frame.size.width, toView.frame.size.height);
    [UIView animateWithDuration:[self transitionDuration:transitionContext]
                          delay:0
         usingSpringWithDamping:.8
          initialSpringVelocity:6.0
                        options:0
                     animations:^
                          toView.backgroundColor=[UIColor colorWithPatternImage:[UIImage imageNamed:@"black_patch.png"]];
                         CGAffineTransform scaleTrans  = CGAffineTransformMakeScale(1.0f, 1.0f);
                         CGAffineTransform lefttorightTrans  = CGAffineTransformMakeTranslation(0.f,+toView.frame.size.height);
                         toView.transform = CGAffineTransformConcat(scaleTrans, lefttorightTrans);


                     
                     completion:^(BOOL finished)
                         [transitionContext completeTransition:YES];

                     ];


else

    [UIView animateWithDuration:[self transitionDuration:transitionContext]
                          delay:0
                        options:0
                     animations:^
                         //                              toView.backgroundColor=[UIColor colorWithPatternImage:[UIImage imageNamed:@"black_patch.png"]];
                         CGAffineTransform scaleTrans  = CGAffineTransformMakeScale(1.0f, 1.0f);
                         CGAffineTransform lefttorightTrans  = CGAffineTransformMakeTranslation(0,-fromView.frame.size.height);
                         fromView.transform = CGAffineTransformConcat(scaleTrans, lefttorightTrans);


                     
                     completion:^(BOOL finished)
                         [transitionContext completeTransition:![transitionContext transitionWasCancelled]];
                     ];


    

   



- (id <UIViewControllerAnimatedTransitioning>)animationControllerForPresentedController:(UIViewController *)presented presentingController:(UIViewController *)presenting sourceController:(UIViewController *)source

isPresenting=YES;
return self;


- (id <UIViewControllerAnimatedTransitioning>)animationControllerForDismissedController:(UIViewController *)dismissed
isPresenting=NO;
return self;


- (UIDynamicAnimator*)animateForTransitionContext:(id<UIViewControllerContextTransitioning>)transitionContext 
// Has to be implemented by subclasses
return nil;

//上面动画的使用

var transitionManager:TransparentTransition
@IBAction func signIn(sender: AnyObject) 

let detail = self.storyboard?.instantiateViewControllerWithIdentifier("detail") as! DetailViewController
    detail.modalPresentationStyle = UIModalPresentationStyle.Custom;
    detail.transitioningDelegate = transitionManager;
self.presentViewControllerdetail, animated: true, completion: nil)

这里还有一个很好的教程，它解释了如何制作如此酷的动画 http://www.appcoda.com/custom-view-controller-transitions-tutorial/

【讨论】：

你可以创建一个单独的动画文件，我提供的代码并将该文件导入objective-C桥头并使用。我已经编辑了关于swift中使用的帖子。它是一个大文件我现在不能快速翻译。

【参考方案3】：

您可以使用情节提要来做到这一点。首先将一个按钮拖到您的第一个 UIViewController 上。

然后将按钮连接到这样的操作

@IBAction func presentForm() 
    self.view.backgroundColor = UIColor.lightGrayColor()

好的，其次，将另一个 UIViewController 拖到情节提要上，然后 Ctrl 将按钮拖到这个控制器上以创建一个转场。使用我在下面的相同设置。以模态和全屏形式呈现。

Ok 接下来是在第二个 ViewController 上创建表单。我在下面添加了一个简单的。下一步是选择第二个视图控制器上的视图。这是为了将背景视图颜色更改为清除颜色。该图像显示了层次结构中的视图和选择为清除的背景颜色。

然后将另一个视图拖到表单元素所在的位置。就像我拥有的​​标签和文本字段一样。当您构建并运行您的项目时，您将看到以下屏幕。

请注意，您必须添加自己的自动布局约束，但它们很简单。你也可以玩弄代码。就像在按钮按下时更改第一个 Viewcontroller 的 Opaque 值等。这应该足以让你开始。