Open jverkoey opened 7 years ago
import Transitions
import TransitionTween
class FadeInTransitionDirector {
constructor(transition) {
this.transition = transition
}
setUp() {
let fadeIn = TransitionTween("opacity",
transition,
Segment.entire(),
[0, 1])
fadeIn.timingFunction = TimingFunctions.easeInEaseOut()
this.transition.runtime.addPlan(fadeIn, this.transition.fore.element)
}
}
runtime
would be a bridge to the Apple/Android/Web Runtime instance. Any plans added to the runtime would generate native Performers. The end result would be an interaction/transition that is equally as performant as a director expressed in Objective-C/Swift/Java.
Is this explicitly targeting React Native and/or NativeScript?
There's a whole bunch of stuff those platforms provide that would be non-trivial separately (e.g. a way to marshal data between JS and ObjC). It also adds a further layer of common abstraction that must be maintained across platforms (e.g. to know that position
needs to be converted to translate
before the web can understand it).
This is a layer that should be able to target any platform.
Most of the work will be in building out JavaScript APIs that reflect the relevant data types and values we expect to use to express interactions. This is very likely work we'll be undertaking for material-motion-js already.
On Apple the fastest path to a prototype would be to use JavaScript core: http://nshipster.com/javascriptcore/
Use of JSContext in React Native: https://github.com/facebook/react-native/search?utf8=%E2%9C%93&q=JSContext&type=Code
It also adds a further layer of common abstraction that must be maintained across platforms
I see this as the layer we're building for the web anyway. The hardest part is the transferring of information into the native runtimes, which is also a problem we should be solving with regards to passing information to/from design tools.
Goal: create one JavaScript director that can be used to add plans to a native runtime on iOS and Android. This same director could be used on the web as well.