UIView从下到上依次出现,反之亦然(核心动画)

XTL*_*XTL 9 core-animation uiview xamarin.ios ios xamarin

我的目标是通过Core Animation了解和实现功能.
我认为这不是很难,但不幸的是我不知道swift/Obj C并且很难理解本机的例子.


视觉实现

那么究竟我想做什么(图中显示的步骤很少):
1.资源
2. 在此输入图像描述
3. 在此输入图像描述
4. 在此输入图像描述

和隐藏视图相同的步骤(反之亦然,从上到下)直到这个:

在此输入图像描述

此外,我想让这个UIView更通用,我的意思是把这个UIView放在我的StoryBoard上并对AutoLayout施加如此限制(以支持不同的设备屏幕).

有任何想法吗?谢谢!

Gow*_*raj 13

你可以像这个扩展名一样使用

extension UIView{
    func animShow(){
        UIView.animate(withDuration: 2, delay: 0, options: [.curveEaseIn],
                       animations: {
                        self.center.y -= self.bounds.height
                        self.layoutIfNeeded()
        }, completion: nil)
        self.isHidden = false
    }
    func animHide(){
        UIView.animate(withDuration: 2, delay: 0, options: [.curveLinear],
                       animations: {
                        self.center.y += self.bounds.height
                        self.layoutIfNeeded()

        },  completion: {(_ completed: Bool) -> Void in
        self.isHidden = true
            })
    }
}
Run Code Online (Sandbox Code Playgroud)


Sus*_*ver 9

假设原始视图是这样的:

var view = new UIView(new CGRect(View.Frame.Left, View.Frame.Height - 200, View.Frame.Right, 0));
view.BackgroundColor = UIColor.Clear;
Run Code Online (Sandbox Code Playgroud)

节目:

UIView.Animate(2.0, 0.0,
    UIViewAnimationOptions.CurveLinear,
    () =>
        {
            view.BackgroundColor = UIColor.Blue;
            var height = 100;
            view.Frame = new CGRect(View.Frame.Left, view.Frame.Y - height , view.Superview.Frame.Right, height);
        },
    () =>
        {
            // anim done
        }                                  
);
Run Code Online (Sandbox Code Playgroud)

隐藏:

UIView.Animate(2.0, 0.0,
    UIViewAnimationOptions.CurveLinear,
    () =>
        {
            view.BackgroundColor = UIColor.Clear;
            var height = 100;
            view.Frame = new CGRect(View.Frame.Left, view.Frame.Y + height, view.Superview.Frame.Right, 0);

        },
    () =>
        {
            view.Hidden = true;
        }
);
Run Code Online (Sandbox Code Playgroud)

在此输入图像描述