First commit of my simple app. Just practice getting a draggable button.
diff --git a/.gitignore b/.gitignore
new file mode 100644
index 0000000..e6f35f9
--- /dev/null
+++ b/.gitignore
@@ -0,0 +1,3 @@
+packages
+.packages
+pubspec.lock
diff --git a/lib/main.dart b/lib/main.dart
new file mode 100644
index 0000000..18790b9
--- /dev/null
+++ b/lib/main.dart
@@ -0,0 +1,124 @@
+import 'package:sky/widgets/basic.dart';
+
+import 'my_button.dart';
+import 'dart:sky' as sky;
+import 'package:vector_math/vector_math.dart' as vector_math;
+
+class HelloWorldApp extends App {
+ int counter = 0;
+ String debug = '';
+ int counter2 = 0;
+ // String debug2 = '';
+ // Accumulators for the current scroll.
+ double dx = 0.0;
+ double dy = 0.0;
+
+ Transform makeTransform() {
+ return new Transform(
+ child: new MyButton(
+ child: new Text('Engage'),
+ onPressed: _handleOnPressedCallback,
+ onScrollStart: _handleOnScrollStartCallback,
+ onScrollUpdate: _handleOnScrollUpdateCallback
+ ),
+ transform: new vector_math.Matrix4.identity().translate(-dx, dy)
+ );
+ }
+
+ void _handleOnPressedCallback(sky.Event e) {
+ setState(() {
+ counter++;
+ sky.GestureEvent ge = e as sky.GestureEvent;
+ debug = '(${ge.x.toStringAsFixed(3)}, ${ge.y.toStringAsFixed(3)})';//ge.toString();
+ });
+ }
+
+ void _handleOnScrollStartCallback(sky.Event e) {
+ setState(() {
+ counter2++;
+ //dx = 0.0;
+ //dy = 0.0;
+ //sky.GestureEvent ge = e as sky.GestureEvent;
+ //debug2 = '${ge.x} ${ge.y}';
+ // The field names were found from here: https://github.com/domokit/sky_engine/blob/01ff5c383fc88647c08f11a0d3392238b8bc99de/sky/engine/core/events/GestureEvent.h
+ //'${ge.x} ${ge.y}';
+ //'${ge.dx} ${ge.dy}'; I didn't see this on scroll either though... T_T
+ //'${ge.velocityX} ${ge.velocityY}'; Is this for fling?
+ });
+ }
+
+ void _handleOnScrollUpdateCallback(sky.Event e) {
+ setState(() {
+ sky.GestureEvent ge = e as sky.GestureEvent;
+ dx += ge.dx;
+ dy += ge.dy;
+ // debug3 = '${ge.dx} ${ge.dy}'; // Was this one for scroll update then?
+ // The field names were found from here: https://github.com/domokit/sky_engine/blob/01ff5c383fc88647c08f11a0d3392238b8bc99de/sky/engine/core/events/GestureEvent.h
+ //'${ge.x} ${ge.y}';
+ //'${ge.dx} ${ge.dy}'; I didn't see this on scroll either though... T_T
+ //'${ge.velocityX} ${ge.velocityY}'; Is this for fling?
+
+ //this.rt.transform.translate(ge.dx, ge.dy);
+ //this.rt.setIdentity();
+ //this.translate(dx, dy);
+ });
+ }
+
+ Widget build() {
+ return new Center(child: new Block([
+ new Center(child: new Text('Hello, world!')),
+ new Center(child: new Text('Tap #${counter}: ${debug}')),
+ new Center(child: new Text('Scroll #${counter2}: (${dx.toStringAsFixed(3)}, ${dy.toStringAsFixed(3)})')),
+ new Center(child: new Text('We did it!')),
+ new Center(child: new MyToolBar()),
+ makeTransform()
+ ]));
+ }
+}
+
+void main() {
+ runApp(new HelloWorldApp());
+}
+
+/*import 'package:sky/widgets/basic.dart';
+
+
+class DemoApp extends App {
+ Widget build() {
+ return new Center(child: new MyToolBar());
+ }
+}
+
+void main() {
+ runApp(new DemoApp());
+}*/
+
+class MyToolBar extends Component {
+ Widget build() {
+ return new Container(
+ decoration: const BoxDecoration(
+ backgroundColor: const Color(0xFF00FFFF)
+ ),
+ height: 56.0,
+ padding: const EdgeDims.symmetric(horizontal: 8.0),
+ child: new Flex([
+ new NetworkImage(src: 'menu.png', width: 25.0, height: 25.0),
+ new Flexible(child: new Text('My awesome toolbar')),
+ new NetworkImage(src: 'search.png', width: 25.0, height: 25.0),
+ ])
+ );
+ }
+}
+
+// A component must build its widget in order to be a Widget.
+// Widgets, however, just are what they are.
+// Everything extends off Widget, but some are Component and some aren't, like
+// the RenderObjectWrapper's. How do they manage to draw themselves? syncChild is the thing that is generally called.
+
+// sky/widgets/basic.dart has all of these...
+// So if I want to position something on my own... I could use Padding/Center in terms of widgets.
+// But which one takes a Point or Offset?
+// Hm... So I think we want to just position, we could use a Container or Transform
+// Transform uses a matrix4 which is really inconvenient...
+// new Matrix4.identity().scale? .rotate? .translate?
+// RenderTransform works too instead of Transform. I guess.
\ No newline at end of file
diff --git a/lib/menu.png b/lib/menu.png
new file mode 100644
index 0000000..38ee213
--- /dev/null
+++ b/lib/menu.png
Binary files differ
diff --git a/lib/my_button.dart b/lib/my_button.dart
new file mode 100644
index 0000000..132a141
--- /dev/null
+++ b/lib/my_button.dart
@@ -0,0 +1,56 @@
+import 'package:sky/widgets/basic.dart';
+
+final BoxDecoration _decoration = new BoxDecoration(
+ backgroundColor: const Color(0xFFFF00FF),
+ borderRadius: 5.0/*,
+ gradient: new LinearGradient(
+ endPoints: [ Point.origin, const Point(0.0, 36.0) ],
+ colors: [ const Color(0xFFEEEEEE), const Color(0xFFCCCCCC) ]
+ )*/
+);
+
+class MyButton extends Component {
+ final Widget child;
+ final Function onPressed;
+ final Function onScrollStart;
+ final Function onScrollUpdate;
+
+ MyButton({this.child, this.onPressed, this.onScrollStart, this.onScrollUpdate});
+
+ Container makeContainer() {
+ return new Container(
+ height: 36.0,
+ padding: const EdgeDims.all(8.0),
+ margin: const EdgeDims.symmetric(horizontal: 8.0),
+ decoration: _decoration,
+ child: new Center(
+ child: this.child
+ )
+ );
+ }
+
+ Widget build() {
+ return new Listener(
+ // Listeners have these possibly fields https://github.com/domokit/sky_engine/blob/2e8843893b9c1cef0f0f9d9e00d384fca7a70d23/sky/packages/sky/lib/widgets/framework.dart
+ onGestureTap: (e) {
+ print('MyButton was tapped!');
+ if (this.onPressed != null) {
+ this.onPressed(e);
+ }
+ },
+ onGestureScrollStart: (e) {
+ print('MyButton was scrolled!');
+ if (this.onScrollStart != null) {
+ this.onScrollStart(e);
+ }
+ },
+ onGestureScrollUpdate: (e) {
+ print('MyButton continues to be scrolled!');
+ if (this.onScrollUpdate != null) {
+ this.onScrollUpdate(e);
+ }
+ },
+ child: makeContainer()
+ );
+ }
+}
\ No newline at end of file
diff --git a/lib/search.png b/lib/search.png
new file mode 100644
index 0000000..9c81036
--- /dev/null
+++ b/lib/search.png
Binary files differ
diff --git a/pubspec.yaml b/pubspec.yaml
new file mode 100644
index 0000000..ef1200b
--- /dev/null
+++ b/pubspec.yaml
@@ -0,0 +1,4 @@
+name: your_app_name
+dependencies:
+ sky: any
+ sky_tools: any
