在 UI5 中执行动画

Question

我正在尝试在 ui5 中为图像（id 是 register1）制作动画。我尝试使用 jQuery 的动画功能。但是好像不行。

    var a = this.getView().byId("register1");
    a.animate.css({opacity: 0.0, visibility: "visible"}).animate({opacity: 1.0});
    a.animate.css({opacity: 1.0, visibility: "visible"}).animate({opacity: 0.0});
    a.animate({visible:'true'},"slow");
    a.animate({visible:'false'},"slow");
    a.animate({visible:'true'},"slow");

Answer 1

函数 'byId' 没有给你一个 jQuery 对象，这是使用 'animate'

所必需的

尝试使用

var $a = $(this.getView().byId("register1").getDomRef());
$a.animate.css({opacity: 0.0, visibility: "visible"}).animate({opacity: 1.0});
$a.animate.css({opacity: 1.0, visibility: "visible"}).animate({opacity: 0.0});
$a.animate({visible:'true'},"slow");
$a.animate({visible:'false'},"slow");
$a.animate({visible:'true'},"slow");

Answer 2

正如 herrlock 所写，但不是 getDomRef() 然后获取它的 jQuery 对象，您还可以使用 $() 函数，该函数在所有 UI5 控件上都可用。假设代码在控制器中（this.getView() 对此有提示），您还可以使用 this.byId().

所以不用
$(this.getView().byId("register1").getDomRef());
它是：
this.byId("register1").$()

差别不大，但不那么神秘。 :-)

如果这不起作用，请确保 HTML 元素在执行此代码时确实存在！

在 UI5 中执行动画

Performing animation in UI5

css-animations

sapui5