diff --git a/lib/src/chart/line_chart/line_chart_data.dart b/lib/src/chart/line_chart/line_chart_data.dart index 43dfad95a..ba9be7dd8 100644 --- a/lib/src/chart/line_chart/line_chart_data.dart +++ b/lib/src/chart/line_chart/line_chart_data.dart @@ -1035,8 +1035,11 @@ class LineTouchTooltipData with EquatableMixin { /// if [LineTouchData.handleBuiltInTouches] is true, /// [LineChart] shows a tooltip popup on top of spots automatically when touch happens, /// otherwise you can show it manually using [LineChartData.showingTooltipIndicators]. - /// Tooltip shows on top of spots, with [getTooltipColor] as a background color, - /// and you can set corner radius using [tooltipRoundedRadius]. + /// Tooltip shows on top of rods, with [getTooltipColor] as a background color. + /// You can set the corner radius using [tooltipRoundedRadius], + /// or if you need a custom border, you can use [tooltipBorderRadius]. + /// Note that if both [tooltipRoundedRadius] and [tooltipBorderRadius] are set, + /// the value from [tooltipBorderRadius] will be used. /// If you want to have a padding inside the tooltip, fill [tooltipPadding], /// or If you want to have a bottom margin, set [tooltipMargin]. /// Content of the tooltip will provide using [getTooltipItems] callback, you can override it @@ -1046,7 +1049,8 @@ class LineTouchTooltipData with EquatableMixin { /// you can set [fitInsideHorizontally] true to force it to shift inside the chart horizontally, /// also you can set [fitInsideVertically] true to force it to shift inside the chart vertically. const LineTouchTooltipData({ - this.tooltipRoundedRadius = 4, + double? tooltipRoundedRadius = 4, + BorderRadius? tooltipBorderRadius, this.tooltipPadding = const EdgeInsets.symmetric(horizontal: 16, vertical: 8), this.tooltipMargin = 16, @@ -1060,11 +1064,19 @@ class LineTouchTooltipData with EquatableMixin { this.showOnTopOfTheChartBoxArea = false, this.rotateAngle = 0.0, this.tooltipBorder = BorderSide.none, - }); + }) : tooltipRoundedRadius = tooltipRoundedRadius ?? 4, + _tooltipBorderRadius = tooltipBorderRadius; /// Sets a rounded radius for the tooltip. + @Deprecated('use tooltipBorderRadius instead') final double tooltipRoundedRadius; + /// Sets a border radius for the tooltip. + final BorderRadius? _tooltipBorderRadius; + + BorderRadius get tooltipBorderRadius => + _tooltipBorderRadius ?? BorderRadius.circular(tooltipRoundedRadius); + /// Applies a padding for showing contents inside the tooltip. final EdgeInsets tooltipPadding; @@ -1105,6 +1117,7 @@ class LineTouchTooltipData with EquatableMixin { @override List get props => [ tooltipRoundedRadius, + _tooltipBorderRadius, tooltipPadding, tooltipMargin, tooltipHorizontalAlignment, diff --git a/lib/src/chart/line_chart/line_chart_painter.dart b/lib/src/chart/line_chart/line_chart_painter.dart index cdd5d1efa..aadf4ed61 100644 --- a/lib/src/chart/line_chart/line_chart_painter.dart +++ b/lib/src/chart/line_chart/line_chart_painter.dart @@ -1225,13 +1225,12 @@ class LineChartPainter extends AxisChartPainter { } } - final radius = Radius.circular(tooltipData.tooltipRoundedRadius); final roundedRect = RRect.fromRectAndCorners( rect, - topLeft: radius, - topRight: radius, - bottomLeft: radius, - bottomRight: radius, + topLeft: tooltipData.tooltipBorderRadius.topLeft, + topRight: tooltipData.tooltipBorderRadius.topRight, + bottomLeft: tooltipData.tooltipBorderRadius.bottomLeft, + bottomRight: tooltipData.tooltipBorderRadius.bottomRight, ); var topSpot = showingTooltipSpots.showingSpots[0]; diff --git a/test/chart/line_chart/line_chart_painter_test.dart b/test/chart/line_chart/line_chart_painter_test.dart index b37b11048..6a7f209d7 100644 --- a/test/chart/line_chart/line_chart_painter_test.dart +++ b/test/chart/line_chart/line_chart_painter_test.dart @@ -2730,7 +2730,10 @@ void main() { final tooltipData = LineTouchTooltipData( getTooltipColor: (touchedSpot) => const Color(0x11111111), - tooltipRoundedRadius: 12, + tooltipBorderRadius: const BorderRadius.only( + topLeft: Radius.circular(10), + topRight: Radius.circular(8), + ), rotateAngle: 43, maxContentWidth: 100, tooltipMargin: 12, @@ -2804,14 +2807,28 @@ void main() { final paint = result1.captured[1] as Paint; expect( rRect, - RRect.fromLTRBR(0, 40, 38, 78, const Radius.circular(12)), + RRect.fromLTRBAndCorners( + 0, + 40, + 38, + 78, + topLeft: const Radius.circular(10), + topRight: const Radius.circular(8), + ), ); expect(paint.color, isSameColorAs(const Color(0x11111111))); final rRectBorder = result1.captured[2] as RRect; final paintBorder = result1.captured[3] as Paint; expect( rRectBorder, - RRect.fromLTRBR(0, 40, 38, 78, const Radius.circular(12)), + RRect.fromLTRBAndCorners( + 0, + 40, + 38, + 78, + topLeft: const Radius.circular(10), + topRight: const Radius.circular(8), + ), ); expect(paintBorder.color, isSameColorAs(const Color(0x11111111))); expect(paintBorder.strokeWidth, 2);