Skip to content

Commit 52fa1df

Browse files
author
LavanyaA
authored
Merge pull request #3 from SyncfusionExamples/Add-demo
Updated demo
2 parents fce015f + 9e17f01 commit 52fa1df

File tree

4 files changed

+94
-189
lines changed

4 files changed

+94
-189
lines changed

‎lib/main.dart‎

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,8 @@ class MyApp extends StatelessWidget {
1414
'Selection',
1515
];
1616

17+
MyApp({super.key});
18+
1719
@override
1820
Widget build(BuildContext context) {
1921
return MaterialApp(
@@ -29,20 +31,19 @@ class MyApp extends StatelessWidget {
2931
return ListTile(
3032
title: Text(items[index]),
3133
onTap: () {
32-
String title = 'Synchronized ${items[index]}';
3334
Navigator.push(
3435
context,
3536
MaterialPageRoute(
3637
builder: (context) => Scaffold(
3738
appBar: AppBar(
38-
title: Text('$title'),
39+
title: Text('Synchronized ${items[index]}'),
3940
),
4041
body: Center(
4142
child: index == 0
42-
? SynchronizedTrackball()
43+
? const SynchronizedTrackball()
4344
: index == 1
44-
? SynchronizedZoomPan()
45-
: SynchronizedSelection(),
45+
? const SynchronizedZoomPan()
46+
: const SynchronizedSelection(),
4647
),
4748
),
4849
),

‎lib/selection.dart‎

Lines changed: 24 additions & 52 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,5 @@
1+
// ignore_for_file: must_be_immutable
2+
13
import 'package:flutter/material.dart';
24
import 'package:syncfusion_flutter_charts/charts.dart';
35

@@ -8,26 +10,10 @@ class SynchronizedSelection extends StatelessWidget {
810

911
@override
1012
Widget build(BuildContext context) {
11-
return const MaterialApp(
13+
return MaterialApp(
1214
debugShowCheckedModeBanner: false,
1315
title: 'Synchronized Selection',
14-
home: MyHomePage(),
15-
);
16-
}
17-
}
18-
19-
class MyHomePage extends StatefulWidget {
20-
const MyHomePage({super.key});
21-
22-
@override
23-
_MyHomePageState createState() => _MyHomePageState();
24-
}
25-
26-
class _MyHomePageState extends State<MyHomePage> {
27-
@override
28-
Widget build(BuildContext context) {
29-
return const SafeArea(
30-
child: Scaffold(
16+
home: Scaffold(
3117
backgroundColor: Colors.white,
3218
body: Row(
3319
children: <Widget>[
@@ -40,12 +26,12 @@ class _MyHomePageState extends State<MyHomePage> {
4026
}
4127
}
4228

43-
SelectionBehavior selectionBehavior1 =
29+
SelectionBehavior _baseSelection =
4430
SelectionBehavior(enable: true, toggleSelection: false);
45-
SelectionBehavior selectionBehavior2 =
31+
SelectionBehavior _targetSelection =
4632
SelectionBehavior(enable: true, toggleSelection: false);
47-
int selectedIndex = -1;
48-
List<SalesData> data = <SalesData>[
33+
int _selectedIndex = -1;
34+
List<SalesData> _data = <SalesData>[
4935
SalesData('Jan', 21),
5036
SalesData('Feb', 24),
5137
SalesData('Mar', 35),
@@ -54,16 +40,9 @@ List<SalesData> data = <SalesData>[
5440
SalesData('Jun', 21),
5541
];
5642

57-
class FirstChart extends StatefulWidget {
58-
const FirstChart({super.key});
43+
class FirstChart extends StatelessWidget {
44+
FirstChart({super.key});
5945

60-
@override
61-
State<StatefulWidget> createState() {
62-
return FirstChartState();
63-
}
64-
}
65-
66-
class FirstChartState extends State<FirstChart> {
6746
bool _isInteractive = false;
6847

6948
@override
@@ -73,37 +52,30 @@ class FirstChartState extends State<FirstChart> {
7352
_isInteractive = true;
7453
},
7554
onSelectionChanged: (selectionArgs) {
76-
if (_isInteractive && selectedIndex != selectionArgs.pointIndex) {
77-
selectedIndex = selectionArgs.pointIndex;
78-
selectionBehavior2.selectDataPoints(selectedIndex);
55+
if (_isInteractive && _selectedIndex != selectionArgs.pointIndex) {
56+
_selectedIndex = selectionArgs.pointIndex;
57+
_targetSelection.selectDataPoints(_selectedIndex);
7958
_isInteractive = false;
8059
}
8160
},
8261
primaryXAxis: const CategoryAxis(),
8362
title: const ChartTitle(text: 'Chart 1'),
8463
series: <ColumnSeries<SalesData, String>>[
8564
ColumnSeries<SalesData, String>(
86-
dataSource: data,
87-
xValueMapper: (SalesData sales, _) => sales.year,
88-
yValueMapper: (SalesData sales, _) => sales.sales,
89-
selectionBehavior: selectionBehavior1,
65+
dataSource: _data,
66+
xValueMapper: (SalesData sales, int index) => sales.year,
67+
yValueMapper: (SalesData sales, int index) => sales.sales,
68+
selectionBehavior: _baseSelection,
9069
color: const Color.fromRGBO(99, 85, 199, 1),
9170
),
9271
],
9372
);
9473
}
9574
}
9675

97-
class SecondChart extends StatefulWidget {
98-
const SecondChart({super.key});
99-
100-
@override
101-
State<StatefulWidget> createState() {
102-
return SecondChartState();
103-
}
104-
}
76+
class SecondChart extends StatelessWidget {
77+
SecondChart({super.key});
10578

106-
class SecondChartState extends State<SecondChart> {
10779
bool _isInteractive = false;
10880

10981
@override
@@ -113,20 +85,20 @@ class SecondChartState extends State<SecondChart> {
11385
_isInteractive = true;
11486
},
11587
onSelectionChanged: (selectionArgs) {
116-
if (_isInteractive && selectedIndex != selectionArgs.pointIndex) {
117-
selectedIndex = selectionArgs.pointIndex;
118-
selectionBehavior1.selectDataPoints(selectedIndex);
88+
if (_isInteractive && _selectedIndex != selectionArgs.pointIndex) {
89+
_selectedIndex = selectionArgs.pointIndex;
90+
_baseSelection.selectDataPoints(_selectedIndex);
11991
_isInteractive = false;
12092
}
12193
},
12294
primaryXAxis: const CategoryAxis(),
12395
title: const ChartTitle(text: 'Chart 2'),
12496
series: <ColumnSeries<SalesData, String>>[
12597
ColumnSeries<SalesData, String>(
126-
dataSource: data,
98+
dataSource: _data,
12799
xValueMapper: (SalesData sales, _) => sales.year,
128100
yValueMapper: (SalesData sales, _) => sales.sales,
129-
selectionBehavior: selectionBehavior2,
101+
selectionBehavior: _targetSelection,
130102
color: const Color.fromRGBO(99, 85, 199, 1),
131103
),
132104
],

‎lib/trackball.dart‎

Lines changed: 25 additions & 54 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,5 @@
1+
// ignore_for_file: must_be_immutable
2+
13
import 'package:flutter/material.dart';
24
import 'package:intl/intl.dart';
35

@@ -11,26 +13,10 @@ class SynchronizedTrackball extends StatelessWidget {
1113

1214
@override
1315
Widget build(BuildContext context) {
14-
return const MaterialApp(
16+
return MaterialApp(
1517
debugShowCheckedModeBanner: false,
1618
title: 'Synchronized Trackball',
17-
home: MyHomePage(),
18-
);
19-
}
20-
}
21-
22-
class MyHomePage extends StatefulWidget {
23-
const MyHomePage({super.key});
24-
25-
@override
26-
_MyHomePageState createState() => _MyHomePageState();
27-
}
28-
29-
class _MyHomePageState extends State<MyHomePage> {
30-
@override
31-
Widget build(BuildContext context) {
32-
return const SafeArea(
33-
child: Scaffold(
19+
home: Scaffold(
3420
backgroundColor: Colors.white,
3521
body: Row(
3622
children: <Widget>[
@@ -43,26 +29,18 @@ class _MyHomePageState extends State<MyHomePage> {
4329
}
4430
}
4531

46-
TrackballBehavior trackball1 =
32+
TrackballBehavior _baseTrackball =
4733
TrackballBehavior(enable: true, activationMode: ActivationMode.singleTap);
48-
TrackballBehavior trackball2 =
34+
TrackballBehavior _targetTrackball =
4935
TrackballBehavior(enable: true, activationMode: ActivationMode.singleTap);
50-
51-
ChartSeriesController? _controller1;
52-
ChartSeriesController? _controller2;
53-
DataModel dataModel = DataModel();
36+
ChartSeriesController? _baseSeriesController;
37+
ChartSeriesController? _targetSeriesController;
38+
DataModel _dataModel = DataModel();
5439
Offset? _position;
5540

56-
class FirstChart extends StatefulWidget {
57-
const FirstChart({super.key});
58-
59-
@override
60-
State<StatefulWidget> createState() {
61-
return FirstChartState();
62-
}
63-
}
41+
class FirstChart extends StatelessWidget {
42+
FirstChart({super.key});
6443

65-
class FirstChartState extends State<FirstChart> {
6644
bool _isInteractive = false;
6745

6846
@override
@@ -73,14 +51,14 @@ class FirstChartState extends State<FirstChart> {
7351
},
7452
onChartTouchInteractionUp: (ChartTouchInteractionArgs tapArgs) {
7553
_isInteractive = false;
76-
trackball2.hide();
54+
_targetTrackball.hide();
7755
},
7856
onTrackballPositionChanging: (TrackballArgs trackballArgs) {
7957
if (_isInteractive) {
80-
_position = _controller1!.pointToPixel(
58+
_position = _baseSeriesController!.pointToPixel(
8159
trackballArgs.chartPointInfo.chartPoint!,
8260
);
83-
trackball2.show(_position!.dx, _position!.dy, 'pixel');
61+
_targetTrackball.show(_position!.dx, _position!.dy, 'pixel');
8462
}
8563
},
8664
primaryXAxis: DateTimeAxis(
@@ -96,32 +74,25 @@ class FirstChartState extends State<FirstChart> {
9674
interval: 0.025,
9775
),
9876
title: const ChartTitle(text: 'Chart 1'),
99-
trackballBehavior: trackball1,
77+
trackballBehavior: _baseTrackball,
10078
series: <LineSeries<SalesData, DateTime>>[
10179
LineSeries<SalesData, DateTime>(
10280
color: const Color.fromRGBO(99, 85, 199, 1),
103-
dataSource: dataModel.data,
81+
dataSource: _dataModel.data,
10482
xValueMapper: (SalesData sales, int index) => sales.dateTime,
10583
yValueMapper: (SalesData sales, int index) => sales.y,
10684
onRendererCreated: (ChartSeriesController controller) {
107-
_controller2 = controller;
85+
_targetSeriesController = controller;
10886
},
10987
),
11088
],
11189
);
11290
}
11391
}
11492

115-
class SecondChart extends StatefulWidget {
116-
const SecondChart({super.key});
117-
118-
@override
119-
State<StatefulWidget> createState() {
120-
return SecondChartState();
121-
}
122-
}
93+
class SecondChart extends StatelessWidget {
94+
SecondChart({super.key});
12395

124-
class SecondChartState extends State<SecondChart> {
12596
bool _isInteractive = false;
12697

12798
@override
@@ -132,14 +103,14 @@ class SecondChartState extends State<SecondChart> {
132103
},
133104
onChartTouchInteractionUp: (ChartTouchInteractionArgs tapArgs) {
134105
_isInteractive = false;
135-
trackball1.hide();
106+
_baseTrackball.hide();
136107
},
137108
onTrackballPositionChanging: (TrackballArgs trackballArgs) {
138109
if (_isInteractive) {
139-
_position = _controller2!.pointToPixel(
110+
_position = _targetSeriesController!.pointToPixel(
140111
trackballArgs.chartPointInfo.chartPoint!,
141112
);
142-
trackball1.show(_position!.dx, _position!.dy, 'pixel');
113+
_baseTrackball.show(_position!.dx, _position!.dy, 'pixel');
143114
}
144115
},
145116
primaryXAxis: DateTimeAxis(
@@ -155,15 +126,15 @@ class SecondChartState extends State<SecondChart> {
155126
interval: 0.025,
156127
),
157128
title: const ChartTitle(text: 'Chart 2'),
158-
trackballBehavior: trackball2,
129+
trackballBehavior: _targetTrackball,
159130
series: <LineSeries<SalesData, DateTime>>[
160131
LineSeries<SalesData, DateTime>(
161132
color: const Color.fromRGBO(99, 85, 199, 1),
162-
dataSource: dataModel.data,
133+
dataSource: _dataModel.data,
163134
xValueMapper: (SalesData sales, int index) => sales.dateTime,
164135
yValueMapper: (SalesData sales, int index) => sales.y,
165136
onRendererCreated: (ChartSeriesController controller) {
166-
_controller1 = controller;
137+
_baseSeriesController = controller;
167138
},
168139
),
169140
],

0 commit comments

Comments
 (0)