diff --git a/README.md b/README.md index 75d185e..f46cb46 100644 --- a/README.md +++ b/README.md @@ -76,6 +76,7 @@ PieChart( ), // gradientList: ---To add gradient colors--- // emptyColorGradient: ---Empty Color gradient--- + // textureList: ---To add image textures---- ) ``` @@ -135,6 +136,57 @@ emptyColorGradient: [ PieChart +### Image Texures + +Pie Chart supports image textures as colors. Just pass `textureList` instead of `colorList` or `gradientList` to add textures to each section. + +```dart +Future _loadImage(String path) async { + final image = await rootBundle.load(path); + return await decodeImageFromList(image.buffer.asUint8List()); +} + +Future> _loadImageShaders(List paths) async { + List images = []; + for (String path in paths) { + ui.Image img = await _loadImage(path); + images.add(ImageShader(img, TileMode.mirror, TileMode.mirror, Matrix4.identity().storage)); + } + return images; +} + +FutureBuilder>( + future: _loadImageShaders([ + 'textures/tile.jpg', + 'textures/tile4.jpg', + 'textures/tile2.jpg', + 'textures/tile3.jpg', + ]), + builder: (context, textures) => textures.hasData ? SizedBox( + height: 300, + width: 300, + child: PieChart( + dataMap: { + "Flutter": 5, + "React": 2, + "Xamarin": 2, + "Ionic": 3, + }, + textureList: textures.data, + legendOptions: LegendOptions( + showLegends: false + ), + chartValuesOptions: ChartValuesOptions( + showChartValuesInPercentage: true, + ), + ), + ) : Text('loading'), +), +``` + +PieChart + + ### Base Chart Color Add a base pie-chart color via: diff --git a/lib/src/chart_painter.dart b/lib/src/chart_painter.dart index c02a365..0e14e3f 100644 --- a/lib/src/chart_painter.dart +++ b/lib/src/chart_painter.dart @@ -26,6 +26,7 @@ class PieChartPainter extends CustomPainter { final Color? emptyColor; final List>? gradientList; final List? emptyColorGradient; + final List? textureList; final DegreeOptions degreeOptions; final Color baseChartColor; final double? totalValue; @@ -54,6 +55,7 @@ class PieChartPainter extends CustomPainter { this.emptyColor, this.gradientList, this.emptyColorGradient, + this.textureList, this.degreeOptions = const DegreeOptions(), required this.baseChartColor, this.totalValue, @@ -65,7 +67,7 @@ class PieChartPainter extends CustomPainter { _total = totalValue!; } - if (gradientList?.isEmpty ?? true) { + if ((gradientList?.isEmpty ?? true) && (textureList?.isEmpty ?? true)) { for (int i = 0; i < values.length; i++) { final paint = Paint()..color = getColor(colorList, i); setPaintProps(paint); @@ -73,6 +75,8 @@ class PieChartPainter extends CustomPainter { } } + + _totalAngle = angleFactor * doublePi * drawPercentage; _subParts = values; _prevAngle = degreeToRadian(degreeOptions.initialAngle); @@ -136,6 +140,7 @@ class PieChartPainter extends CustomPainter { final isGradientPresent = gradientList?.isNotEmpty ?? false; final isNonGradientElementPresent = (_subParts.length - (gradientList?.length ?? 0)) > 0; + final isTexturePresent = textureList?.isNotEmpty ?? false; for (int i = 0; i < _subParts.length; i++) { if (isGradientPresent) { @@ -152,6 +157,22 @@ class PieChartPainter extends CustomPainter { emptyColorGradient: emptyColorGradient!), ); paint.shader = gradient.createShader(boundingSquare); + if (chartType == ChartType.ring) { + paint.style = PaintingStyle.stroke; + paint.strokeWidth = strokeWidth!; + paint.strokeCap = StrokeCap.butt; + } + canvas.drawArc( + boundingSquare, + _prevAngle, + endAngle, + useCenter, + paint, + ); + } else if (isTexturePresent) { + final endAngle = (((_totalAngle) / _total) * _subParts[i]); + final paint = Paint()..shader = textureList![i]; + if (chartType == ChartType.ring) { paint.style = PaintingStyle.stroke; paint.strokeWidth = strokeWidth!; diff --git a/lib/src/pie_chart.dart b/lib/src/pie_chart.dart index 46a89a8..aa81587 100644 --- a/lib/src/pie_chart.dart +++ b/lib/src/pie_chart.dart @@ -27,6 +27,7 @@ class PieChart extends StatefulWidget { this.emptyColor = Colors.grey, this.gradientList, this.emptyColorGradient = const [Colors.black26, Colors.black54], + this.textureList, this.legendLabels = const {}, Key? key, this.degreeOptions = const DegreeOptions(), @@ -41,6 +42,7 @@ class PieChart extends StatefulWidget { final double chartLegendSpacing; final List colorList; final List>? gradientList; + final List? textureList; @Deprecated('use degreeOptions. instead') final double? initialAngleInDegree; final Function? formatChartValues; @@ -146,6 +148,7 @@ class _PieChartState extends State emptyColor: widget.emptyColor, gradientList: widget.gradientList, emptyColorGradient: widget.emptyColorGradient, + textureList: widget.textureList, degreeOptions: widget.degreeOptions.copyWith( // because we've deprecated initialAngleInDegree, // we want the old value to be used if it's not null diff --git a/res/s13.jpg b/res/s13.jpg new file mode 100644 index 0000000..5518892 Binary files /dev/null and b/res/s13.jpg differ