From 4e596642f2311898e8b15bbf57403b582d7d294a Mon Sep 17 00:00:00 2001 From: "pengfei.zhou" Date: Fri, 29 Nov 2019 15:07:32 +0800 Subject: [PATCH] android supports animation --- .../main/java/pub/doric/shader/ViewNode.java | 27 +++- demo/src/AnimatorDemo.ts | 134 +++++++++--------- doric-cli/scripts/command.js | 6 +- 3 files changed, 100 insertions(+), 67 deletions(-) diff --git a/Android/doric/src/main/java/pub/doric/shader/ViewNode.java b/Android/doric/src/main/java/pub/doric/shader/ViewNode.java index 19b5c62d..8cbc1ce3 100644 --- a/Android/doric/src/main/java/pub/doric/shader/ViewNode.java +++ b/Android/doric/src/main/java/pub/doric/shader/ViewNode.java @@ -16,8 +16,11 @@ package pub.doric.shader; import android.animation.Animator; +import android.animation.ArgbEvaluator; import android.animation.ObjectAnimator; import android.content.Context; +import android.graphics.Color; +import android.graphics.drawable.ColorDrawable; import android.view.View; import android.view.ViewGroup; import android.widget.FrameLayout; @@ -169,7 +172,17 @@ public abstract class ViewNode extends DoricContextHolder { } break; case "bgColor": - view.setBackgroundColor(prop.asNumber().toInt()); + if (isAnimating()) { + ObjectAnimator animator = ObjectAnimator.ofInt( + this, + name, + getBgColor(), + prop.asNumber().toInt()); + animator.setEvaluator(new ArgbEvaluator()); + addAnimator(animator); + } else { + setBgColor(prop.asNumber().toInt()); + } break; case "onClick": final String functionId = prop.asString().value(); @@ -425,4 +438,16 @@ public abstract class ViewNode extends DoricContextHolder { return 0; } + @DoricMethod + public int getBgColor() { + if (mView.getBackground() instanceof ColorDrawable) { + return ((ColorDrawable) mView.getBackground()).getColor(); + } + return Color.TRANSPARENT; + } + + @DoricMethod + public void setBgColor(int color) { + mView.setBackgroundColor(color); + } } diff --git a/demo/src/AnimatorDemo.ts b/demo/src/AnimatorDemo.ts index 1acdae9c..c908c0a7 100644 --- a/demo/src/AnimatorDemo.ts +++ b/demo/src/AnimatorDemo.ts @@ -1,75 +1,79 @@ -import { animate, Group, Panel, gravity, Color, LayoutSpec, vlayout, scroller, layoutConfig, IVLayout, modal, IText, network, View, stack } from "doric"; -import { title, label, colors, box } from "./utils"; +import { animate, Group, Panel, gravity, Color, LayoutSpec, vlayout, scroller, layoutConfig, IVLayout, modal, IText, network, View, stack, IHLayout, hlayout, IView, text } from "doric"; +import { title, colors, box } from "./utils"; + +function thisLabel(str: string) { + return text({ + text: str, + width: 100, + height: 50, + bgColor: colors[4], + textSize: 20, + textColor: Color.WHITE, + layoutConfig: layoutConfig().exactly(), + }) +} @Entry class AnimatorDemo extends Panel { build(rootView: Group): void { const view = box(2) + let idx = 0 vlayout([ title("Animator Demo"), - label('Reset').apply({ - width: 100, - height: 50, - bgColor: colors[4], - textSize: 20, - textColor: Color.WHITE, - layoutConfig: layoutConfig().exactly(), - } as IText).also(v => { - v.onClick = () => { - animate(this)({ - animations: () => { - view.width = view.height = 20 - }, - duration: 3000, - }).then(() => { - modal(context).toast('Fininshed') - }, (e: any) => { - modal(context).toast(`${e}`) - }) - } - }), - label('Width').apply({ - width: 100, - height: 50, - bgColor: colors[0], - textSize: 20, - textColor: Color.WHITE, - layoutConfig: layoutConfig().exactly(), - } as IText).also(v => { - v.onClick = () => { - animate(this)({ - animations: () => { - view.width = 300 - }, - duration: 3000, - }).then(() => { - modal(context).toast('Fininshed') - }, (e: any) => { - modal(context).toast(`${e}`) - }) - } - }), - label('Height').apply({ - width: 100, - height: 50, - bgColor: colors[0], - textSize: 20, - textColor: Color.WHITE, - layoutConfig: layoutConfig().exactly(), - } as IText).also(v => { - v.onClick = () => { - animate(this)({ - animations: () => { - view.height = 300 - }, - duration: 3000, - }).then(() => { - modal(context).toast('Fininshed') - }, (e: any) => { - modal(context).toast(`${e}`) - }) - } - }), + vlayout( + [ + hlayout([ + thisLabel('Reset').apply({ + onClick: () => { + animate(this)({ + animations: () => { + view.width = view.height = 20 + }, + duration: 3000, + }).then(() => { + modal(context).toast('Fininshed') + }).catch(e => { + modal(context).toast(`${e}`) + }) + } + }), + ]), + hlayout([ + thisLabel('Width').apply({ + onClick: () => { + animate(this)({ + animations: () => { + view.width = 200 + }, + duration: 3000, + }) + } + }), + thisLabel('Height').apply({ + onClick: () => { + animate(this)({ + animations: () => { + view.height = 200 + }, + duration: 3000, + }) + } + }), + ]).apply({ space: 10 } as IHLayout), + hlayout([ + thisLabel('BgColor').apply({ + onClick: () => { + animate(this)({ + animations: () => { + view.bgColor = colors[(idx++) % colors.length] + }, + duration: 3000, + }); + } + }), + ]).apply({ space: 10 } as IHLayout), + ] + ).apply({ space: 10 } as IVLayout), stack([ view.also(v => { v.left = 20 diff --git a/doric-cli/scripts/command.js b/doric-cli/scripts/command.js index ab18f761..471cfd89 100644 --- a/doric-cli/scripts/command.js +++ b/doric-cli/scripts/command.js @@ -17,7 +17,11 @@ function fromDir(startPath, filter) { fromDir(filename, filter); } else if (filename.indexOf(filter) >= 0) { - doMerge(startPath, files[i]) + try { + doMerge(startPath, files[i]) + } catch (e) { + console.log(e) + } }; }; };