diff --git a/Flutter/Release-notes/v19.2.0.49.md b/Flutter/Release-notes/v19.2.0.49.md new file mode 100644 index 0000000..0e0086a --- /dev/null +++ b/Flutter/Release-notes/v19.2.0.49.md @@ -0,0 +1,18 @@ +--- +title: Essential Studio for Flutter Weekly Nuget Release Release Notes +description: Essential Studio for Flutter Weekly Nuget Release Release Notes +platform: flutter +documentation: ug +--- + +# Essential Studio for Flutter Release Notes + +{% include release-info.html date="July 27, 2021" version="v19.2.0.49" %} + + +{% directory path: _includes/release-notes/v19.2.0.49 + %} + +{% include {{file.url}} %} + +{% enddirectory %} \ No newline at end of file diff --git a/Flutter/radial-gauge/export-radial-gauge.md b/Flutter/radial-gauge/export-radial-gauge.md index 1c4568b..eef4fcb 100644 --- a/Flutter/radial-gauge/export-radial-gauge.md +++ b/Flutter/radial-gauge/export-radial-gauge.md @@ -17,54 +17,176 @@ To export the Radial Gauge as a PNG image, we can get the image by calling [`toI {% highlight dart %} - Future _renderRadialGaugeImage() async { - dart_ui.Image data = await _RadialGaugeKey.currentState!.toImage(pixelRatio: 3.0); - final bytes = await data.toByteData(format: dart_ui.ImageByteFormat.png); - if (data != null) { - await Navigator.of(context).push( - MaterialPageRoute( - builder: (BuildContext context) { - return Scaffold( - appBar: AppBar(), - body: Center( - child: Container( - color: Colors.white, - child: Image.memory(bytes!.buffer.asUint8List()), - ), - ), - ); - }, - ), - ); - } - } +GlobalKey _globalKey = GlobalKey(); - {% endhighlight %} + @override + Widget build(BuildContext context) { + return Scaffold( + body: Column( + children: [ + Container( + height: 400, + width: 400, + child: RepaintBoundary( + key: _globalKey, + child: SfRadialGauge( + axes: [ + RadialAxis( + minimum: 0, + maximum: 150, + ranges: [ + GaugeRange( + startValue: 0, + endValue: 50, + color: Colors.green, + startWidth: 10, + endWidth: 10), + GaugeRange( + startValue: 50, + endValue: 100, + color: Colors.orange, + startWidth: 10, + endWidth: 10), + GaugeRange( + startValue: 100, + endValue: 150, + color: Colors.red, + startWidth: 10, + endWidth: 10) + ], + pointers: [NeedlePointer(value: 90)], + ) + ], + ), + ), + ), + Padding( + padding: const EdgeInsets.only(top: 5.0), + child: ElevatedButton( + onPressed: _renderGaugeImage, + child: Text('Gauge to image'), + ), + ), + ], + ), + ); + } + + Future _renderGaugeImage() async { + final RenderRepaintBoundary boundary = + _globalKey.currentContext?.findRenderObject() as RenderRepaintBoundary; + final ui.Image data = await boundary.toImage(pixelRatio: 3.0); + final bytes = await data.toByteData(format: ui.ImageByteFormat.png); + if (data != null) { + await Navigator.of(context).push( + MaterialPageRoute( + builder: (BuildContext context) { + return Scaffold( + appBar: AppBar(), + body: Center( + child: Container( + color: Colors.white, + child: Image.memory(bytes!.buffer.asUint8List()), + ), + ), + ); + }, + ), + ); + } + } + +{% endhighlight %} + +![image_export](images\export-radial-gauge\export-gauge-image.png) ## Export PDF -Similar to the above way, we can also export the rendered chart as a PDF document. We create the pdf document using pdf component. This can be done in the application level itself and please find the code snippet below. +Similar to the above way, we can also export the rendered chart as a PDF document. We create the pdf document using pdf component. This can be done in the application level itself and please find the code snippet below. Add the below four packages in your pubspec file and import the respective libraries in your main.dart file. -{% highlight dart %} +* syncfusion_flutter_pdf +* syncfusion_flutter_gauges +* path_provider +* open_file - Future _renderRadialGaugePDF() async { - var document = PdfDocument(); - PdfPage page = document.pages.add(); - dart_ui.Image data = await _RadialGaugeKey.currentState!.toImage(pixelRatio: 3.0); - final bytes = await data.toByteData(format: dart_ui.ImageByteFormat.png); - final Uint8List imageBytes = - bytes!.buffer.asUint8List(bytes.offsetInBytes, bytes.lengthInBytes); - page.graphics - .drawImage(PdfBitmap(imageBytes), Rect.fromLTWH(25, 50, 300, 300)); - var byteData = document.save(); - document.dispose(); - Directory directory = await getExternalStorageDirectory(); - String path = directory.path; - File file = File('$path/Output.pdf'); - await file.writeAsBytes(byteData, flush: true); - OpenFile.open('$path/Output.pdf'); - } +{% highlight dart %} - {% endhighlight %} +GlobalKey _globalKey = GlobalKey(); + +@override +Widget build(BuildContext context) { + return Scaffold( + appBar: AppBar(title: Text('RenderGaugePdf')), + body: Column( + children: [ + Container( + height: 400, + width: 400, + child: RepaintBoundary( + key: _globalKey, + child: SfRadialGauge( + axes: [ + RadialAxis( + minimum: 0, + maximum: 150, + ranges: [ + GaugeRange( + startValue: 0, + endValue: 50, + color: Colors.green, + startWidth: 10, + endWidth: 10), + GaugeRange( + startValue: 50, + endValue: 100, + color: Colors.orange, + startWidth: 10, + endWidth: 10), + GaugeRange( + startValue: 100, + endValue: 150, + color: Colors.red, + startWidth: 10, + endWidth: 10) + ], + pointers: [NeedlePointer(value: 90)], + ) + ], + ), + ), + ), + Padding( + padding: const EdgeInsets.only(top: 5.0), + child: ElevatedButton( + onPressed: _renderGaugePDF, + child: Text('Gauges to pdf'), + ), + ), + ], + ), + ); + } + + Future _renderGaugePDF() async { + var document = PdfDocument(); + PdfPage page = document.pages.add(); + final RenderRepaintBoundary boundary = + _globalKey.currentContext?.findRenderObject() as RenderRepaintBoundary; + final ui.Image data = await boundary.toImage(pixelRatio: 3.0); + final bytes = await data.toByteData(format: ui.ImageByteFormat.png); + final Uint8List imageBytes = + bytes!.buffer.asUint8List(bytes.offsetInBytes, bytes.lengthInBytes); + page.graphics + .drawImage(PdfBitmap(imageBytes), Rect.fromLTWH(25, 50, 300, 300)); + var byteData = document.save(); + document.dispose(); + Directory? directory = await getExternalStorageDirectory(); + String path = directory!.path; + File file = File('$path/Output.pdf'); + await file.writeAsBytes(byteData, flush: true); + OpenFile.open('$path/Output.pdf'); + } + + {% endhighlight %} - ![pdf_export](images\export-radial-gauge\export-radial-gauge.jpg) \ No newline at end of file + ![pdf_export](images\export-radial-gauge\export-radial-gauge.png) \ No newline at end of file diff --git a/Flutter/radial-gauge/images/export-radial-gauge/export-gauge-image.png b/Flutter/radial-gauge/images/export-radial-gauge/export-gauge-image.png new file mode 100644 index 0000000..0e8b0d6 Binary files /dev/null and b/Flutter/radial-gauge/images/export-radial-gauge/export-gauge-image.png differ diff --git a/Flutter/radial-gauge/images/export-radial-gauge/export-radial-gauge.jpg b/Flutter/radial-gauge/images/export-radial-gauge/export-radial-gauge.jpg deleted file mode 100644 index 2fad11a..0000000 Binary files a/Flutter/radial-gauge/images/export-radial-gauge/export-radial-gauge.jpg and /dev/null differ diff --git a/Flutter/radial-gauge/images/export-radial-gauge/export-radial-gauge.png b/Flutter/radial-gauge/images/export-radial-gauge/export-radial-gauge.png new file mode 100644 index 0000000..ef661ad Binary files /dev/null and b/Flutter/radial-gauge/images/export-radial-gauge/export-radial-gauge.png differ diff --git a/flutter-toc.html b/flutter-toc.html index 3c4ff19..9911240 100644 Binary files a/flutter-toc.html and b/flutter-toc.html differ