From bff2ea9c7727240af7f4113479a9150f21b82434 Mon Sep 17 00:00:00 2001 From: apps-transround Date: Thu, 8 Apr 2021 17:46:03 +0200 Subject: [PATCH] RepaintBoundary added --- beta.bat | 7 ++ lib/demo_control.dart | 32 ++++++++++ lib/main.dart | 8 ++- lib/paintEvent.dart | 8 +++ lib/platform.dart | 32 ++++++++-- lib/rainbow_shamer.dart | 137 ++++++++++++++++++++++++++++++++++++++++ lib/rotate.dart | 10 +-- 7 files changed, 223 insertions(+), 11 deletions(-) create mode 100644 beta.bat create mode 100644 lib/demo_control.dart create mode 100644 lib/rainbow_shamer.dart diff --git a/beta.bat b/beta.bat new file mode 100644 index 0000000..d79a1d1 --- /dev/null +++ b/beta.bat @@ -0,0 +1,7 @@ +(echo const String buildTimeStamp = 'STAGE: %date% %time%';) > lib\build_timestamp.dart + +call flutter build web + +call firebase hosting:channel:deploy rot + +time /t diff --git a/lib/demo_control.dart b/lib/demo_control.dart new file mode 100644 index 0000000..3afc851 --- /dev/null +++ b/lib/demo_control.dart @@ -0,0 +1,32 @@ +import 'package:flutter/material.dart'; +import 'package:flutter/rendering.dart'; +import 'package:scroll_test/paintEvent.dart'; + +class DemoControl extends StatefulWidget { + final void Function()? onRecord; + final void Function()? onPlay; + final void Function()? onPause; + final void Function()? onStop; + + const DemoControl({Key? key, this.onRecord, this.onPlay, this.onPause, this.onStop}) : super(key: key); + + @override + _DemoControlState createState() => _DemoControlState(); +} + +class _DemoControlState extends State { + double sliderValue = PaintEventHandler.playbackZeitLuppe; + + @override + Widget build(BuildContext context) { + return Row( + children: [ + TextButton( + child: Text('Show paint info'), + onPressed: () { + debugRepaintRainbowEnabled = !debugRepaintRainbowEnabled; + }), + ], + ); + } +} diff --git a/lib/main.dart b/lib/main.dart index 5adbced..571c168 100644 --- a/lib/main.dart +++ b/lib/main.dart @@ -5,8 +5,12 @@ import 'package:scroll_test/two_way_scroll_widget.dart'; void main() { // debugPaintLayerBordersEnabled = true; runApp( - // MaterialApp(home: ScrollPaintTest()), - MaterialApp(home: RotateTest()), + MaterialApp( + home: RotateTest(), + // home: ScrollPaintTest(), + // home: RainbowShamer(), + debugShowCheckedModeBanner: false, + ), ); } diff --git a/lib/paintEvent.dart b/lib/paintEvent.dart index 2e43bd9..581e9a8 100644 --- a/lib/paintEvent.dart +++ b/lib/paintEvent.dart @@ -15,6 +15,14 @@ const Map colorsMap = { PaintEventType.markPaintRoot: Colors.grey, }; +const Map judgementColorMap = { + 1: Colors.deepOrange, + 3: Colors.deepPurple, + 4: Colors.blue, + 5: Colors.amber, + 9: Colors.green, +}; + class PaintEventHandler { static List paintEvents = []; static Map widgetRenderMap = Map(); diff --git a/lib/platform.dart b/lib/platform.dart index 2e6b3cf..4b767ee 100644 --- a/lib/platform.dart +++ b/lib/platform.dart @@ -2376,10 +2376,10 @@ // } catch (e, stack) { // _debugReportException('paint', e, stack); // } +// if (debugRepaintRainbowEnabled) +// debugPaintPaintInfo(context, offset); // assert(() { // debugPaint(context, offset); -// if (debugRepaintRainbowEnabled) -// debugPaintPaintInfo(context, offset); // _debugActivePaint = debugLastActivePaint; // _debugDoingThisPaint = false; // return true; @@ -2391,15 +2391,37 @@ // int i = 0; // paintEvents.forEach((element) { // final p1 = Offset(i * 5+ delta, 0 ); -// final p2 = Offset(i * 5+ delta, 20); +// final p2 = Offset(i * 5+ delta, 4); // final paint = Paint() // ..color = colorsMap[element.eventType] ?? Color(0xFFFF0000) // ..strokeWidth = 4; // context.canvas.drawLine(offset + p1, offset + p2, paint); // i++; // }); -// if (this is RenderRepaintBoundary) -// print ((this as RenderRepaintBoundary).debugAsymmetricPaintCount); +// if (this is RenderRepaintBoundary) { +// int asymPC = (this as RenderRepaintBoundary).debugAsymmetricPaintCount +1; +// int symPC = (this as RenderRepaintBoundary).debugSymmetricPaintCount+1; +// int fraction = (asymPC / (asymPC + symPC) * 8).round() + 1; +// final textStyle = TextStyle( +// color: judgementColorMap[fraction] ?? Color(0xFFFF0000), +// fontSize: 16, +// ); +// final textSpan = TextSpan( +// text: '$asymPC / $symPC', +// style: textStyle, +// ); +// final textPainter = TextPainter( +// text: textSpan, +// textDirection: TextDirection.ltr, +// ); +// textPainter.layout( +// minWidth: 0, +// maxWidth: 80, +// ); +// textPainter.paint(context.canvas, this.paintBounds.topRight +// ); +// +// } // // i = 0; // // eventssMap.forEach((key, value) { // // final textStyle = TextStyle( diff --git a/lib/rainbow_shamer.dart b/lib/rainbow_shamer.dart new file mode 100644 index 0000000..57c51be --- /dev/null +++ b/lib/rainbow_shamer.dart @@ -0,0 +1,137 @@ +/// Flutter code sample for RotationTransition +import 'package:flutter/material.dart'; +import 'package:flutter/rendering.dart'; +import 'package:scroll_test/paintEvent.dart'; + +void main() => runApp(const MyApp()); + +/// This is the main application widget. +class MyApp extends StatelessWidget { + const MyApp({Key? key}) : super(key: key); + + @override + Widget build(BuildContext context) { + return const MaterialApp( + title: 'Paint recorder', + home: RainbowShamer(), + ); + } +} + +/// This is the stateful widget that the main application instantiates. +class RainbowShamer extends StatefulWidget { + const RainbowShamer({Key? key}) : super(key: key); + + @override + _RainbowShamerState createState() => _RainbowShamerState(); +} + +/// This is the private State class that goes with MyStatefulWidget. +/// AnimationControllers can be created with `vsync: this` because of TickerProviderStateMixin. +class _RainbowShamerState extends State with TickerProviderStateMixin { + late final AnimationController _controller = AnimationController( + duration: const Duration(milliseconds: 300), + vsync: this, + ); + + // ..repeat(reverse: true); + late final Animation _animation = CurvedAnimation( + parent: _controller, + curve: Curves.easeIn, + ); + late final AnimationController _controller2 = AnimationController( + duration: const Duration(milliseconds: 300), + vsync: this, + ); + + // ..repeat(reverse: true); + late final Animation _animation2 = CurvedAnimation( + parent: _controller2, + curve: Curves.easeIn, + ); + + @override + void dispose() { + _controller.dispose(); + super.dispose(); + } + + @override + Widget build(BuildContext context) { + return Scaffold( + body: Column( + children: [ + // Row( + // children: [ + // PlaybackControl( + // onRecord: () { + // setState(() {}); + // iterate(); + // }, + // onPlay: () { + // setState(() {}); + // }, + // ), + // ], + // ), + Padding( + padding: const EdgeInsets.all(8.0), + child: Text('Rotating animation'), + ), + // Padding( + // padding: const EdgeInsets.all(8.0), + // child: Text('A'), + // ), + Center( + child: GestureDetector( + onTap: () { + _controller.reset(); + _controller.forward(); + }, + child: SizedBox( + width: 100, + height: 100, + child: RotationTransition( + turns: _animation, + child: const Padding( + padding: EdgeInsets.all(8.0), + child: FlutterLogo(size: 100.0), + ), + ), + ), + ), + ), + Center( + child: SizedBox( + width: 100, + height: 100, + child: GestureDetector( + onTap: () { + _controller2.reset(); + _controller2.forward(); + }, + child: RotationTransition( + turns: _animation2, + child: const Padding( + padding: EdgeInsets.all(8.0), + child: FlutterLogo(size: 100.0), + ), + ), + ), + ), + ), + ], + ), + ); + } + + Future iterate() async { + PaintEventHandler.reset(); + _controller.reset(); + await _controller.forward(); + print('REEEEADY'); + PaintEventHandler.eventMode = EventMode.none; + // PaintEventHandler.playBack(); + // PaintEventHandler.dump(); + } +} diff --git a/lib/rotate.dart b/lib/rotate.dart index 71cfcc3..0585881 100644 --- a/lib/rotate.dart +++ b/lib/rotate.dart @@ -1,6 +1,7 @@ /// Flutter code sample for RotationTransition import 'package:flutter/material.dart'; import 'package:flutter/rendering.dart'; +import 'package:scroll_test/demo_control.dart'; import 'package:scroll_test/paintEvent.dart'; void main() => runApp(const MyApp()); @@ -74,6 +75,7 @@ class _RotateTestState extends State with TickerProviderStateMixin { // ), // ], // ), + DemoControl(), RepaintBoundary(child: Text('A')), Padding( padding: const EdgeInsets.all(8.0), @@ -91,8 +93,8 @@ class _RotateTestState extends State with TickerProviderStateMixin { _controller.forward(); }, child: SizedBox( - width: 300, - height: 300, + width: 100, + height: 100, child: RotationTransition( turns: _animation, child: const Padding( @@ -106,8 +108,8 @@ class _RotateTestState extends State with TickerProviderStateMixin { ), Center( child: SizedBox( - width: 300, - height: 300, + width: 100, + height: 100, child: GestureDetector( onTap: () { _controller2.reset();