chore(example): add example of how to use the children parameter of the

BarTooltipItem, LineTooltipItem, and ScatterTooltipItem
creky · Mar 20, 2021 · 8154731 · 8154731
1 parent b299b5c
commit 8154731
Show file tree

Hide file tree

Showing 4 changed files with 84 additions and 3 deletions.
diff --git a/example/.vim/coc-settings.json b/example/.vim/coc-settings.json
@@ -0,0 +1,3 @@
+{
+  "flutter.selectedDeviceId": "emulator-5554"
+}
diff --git a/example/lib/bar_chart/samples/bar_chart_sample1.dart b/example/lib/bar_chart/samples/bar_chart_sample1.dart
@@ -177,7 +177,23 @@ class BarChartSample1State extends State<BarChartSample1> {
                   break;
               }
               return BarTooltipItem(
-                  weekDay + '\n' + (rod.y - 1).toString(), TextStyle(color: Colors.yellow));
+                weekDay + '\n',
+                TextStyle(
+                  color: Colors.white,
+                  fontWeight: FontWeight.bold,
+                  fontSize: 18,
+                ),
+                children: <InlineSpan>[
+                  TextSpan(
+                    text: (rod.y - 1).toString(),
+                    style: TextStyle(
+                      color: Colors.yellow,
+                      fontSize: 16,
+                      fontWeight: FontWeight.w500,
+                    ),
+                  ),
+                ],
+              );
             }),
         touchCallback: (barTouchResponse) {
           setState(() {

diff --git a/example/lib/line_chart/samples/line_chart_sample3.dart b/example/lib/line_chart/samples/line_chart_sample3.dart
@@ -90,8 +90,33 @@ class _LineChartSample3State extends State<LineChartSample3> {
                           }
 
                           return LineTooltipItem(
-                            '${widget.weekDays[flSpot.x.toInt()]} \n${flSpot.y} k calories',
-                            const TextStyle(color: Colors.white),
+                            '${widget.weekDays[flSpot.x.toInt()]} \n',
+                            const TextStyle(
+                              color: Colors.white,
+                              fontWeight: FontWeight.bold,
+                            ),
+                            children: [
+                              TextSpan(
+                                text: flSpot.y.toString(),
+                                style: TextStyle(
+                                  color: Colors.grey[100],
+                                  fontWeight: FontWeight.normal,
+                                ),
+                              ),
+                              TextSpan(
+                                text: ' k ',
+                                style: TextStyle(
+                                  fontStyle: FontStyle.italic,
+                                  fontWeight: FontWeight.normal,
+                                ),
+                              ),
+                              TextSpan(
+                                text: 'calories',
+                                style: TextStyle(
+                                  fontWeight: FontWeight.normal,
+                                ),
+                              ),
+                            ],
                           );
                         }).toList();
                       }),

diff --git a/example/lib/scatter_chart/samples/scatter_chart_sample2.dart b/example/lib/scatter_chart/samples/scatter_chart_sample2.dart
@@ -97,6 +97,43 @@ class _ScatterChartSample2State extends State {
               handleBuiltInTouches: false,
               touchTooltipData: ScatterTouchTooltipData(
                 tooltipBgColor: Colors.black,
+                getTooltipItems: (ScatterSpot touchedBarSpot) {
+                  return ScatterTooltipItem(
+                    'X: ',
+                    TextStyle(
+                      height: 1.2,
+                      color: Colors.grey[100],
+                      fontStyle: FontStyle.italic,
+                    ),
+                    10,
+                    children: [
+                      TextSpan(
+                        text: '${touchedBarSpot.x.toInt()} \n',
+                        style: TextStyle(
+                          color: Colors.white,
+                          fontStyle: FontStyle.normal,
+                          fontWeight: FontWeight.bold,
+                        ),
+                      ),
+                      TextSpan(
+                        text: 'Y: ',
+                        style: TextStyle(
+                          height: 1.2,
+                          color: Colors.grey[100],
+                          fontStyle: FontStyle.italic,
+                        ),
+                      ),
+                      TextSpan(
+                        text: touchedBarSpot.y.toInt().toString(),
+                        style: TextStyle(
+                          color: Colors.white,
+                          fontStyle: FontStyle.normal,
+                          fontWeight: FontWeight.bold,
+                        ),
+                      ),
+                    ],
+                  );
+                },
               ),
               touchCallback: (ScatterTouchResponse touchResponse) {
                 if (touchResponse.touchInput is FlPanStart) {