From 8cb22edf953efafc572057e754471b0f4c5dbf37 Mon Sep 17 00:00:00 2001
From: Hariram4428 <hariram.subramanian@syncfusion.com>
Date: Fri, 10 Jan 2025 15:55:08 +0530
Subject: [PATCH] FLUT-933401-[feature]: Updated code snippet
---
Flutter/range-selector/range-controller.md | 106 ++++++++++-----------
1 file changed, 51 insertions(+), 55 deletions(-)
diff --git a/Flutter/range-selector/range-controller.md b/Flutter/range-selector/range-controller.md
index 720bf3104..8ac5b154f 100644
--- a/Flutter/range-selector/range-controller.md
+++ b/Flutter/range-selector/range-controller.md
@@ -113,7 +113,6 @@ We have provided built-in support for selecting the chart segments based on the
SfRangeValues _values = SfRangeValues(DateTime(2010, 03, 01), DateTime(2010, 06, 01));
RangeController _rangeController;
-List<int> selectedItems;
@override
void initState() {
@@ -143,62 +142,59 @@ final List<Data> chartData = <Data>[
@override
Widget build(BuildContext context) {
- selectedItems = <int>[];
- for (int i = 0; i < chartData.length; i++) {
- if (chartData[i].x.millisecondsSinceEpoch >=
- _rangeController.start.millisecondsSinceEpoch &&
- chartData[i].x.millisecondsSinceEpoch <=
- _rangeController.end.millisecondsSinceEpoch) {
- selectedItems.add(chartData.indexOf(chartData[i]));
- }
- }
-
- return Scaffold(
- body: Center(
- child: SfRangeSelector(
- min: DateTime(2010, 01, 01),
- max: DateTime(2010, 09, 01),
- interval: 2,
- dateIntervalType: DateIntervalType.months,
- dateFormat: DateFormat.yM(),
- showTicks: true,
- showLabels: true,
- controller: _rangeController,
- child: Container(
- height: 130,
- child: SfCartesianChart(
- margin: const EdgeInsets.all(0),
- primaryXAxis: DateTimeAxis(minimum: DateTime(2010, 01, 01),
- maximum: DateTime(2010, 09, 01),
- isVisible: false),
- primaryYAxis: NumericAxis(isVisible: false),
- plotAreaBorderWidth: 0,
- plotAreaBackgroundColor: Colors.transparent,
- series: <ColumnSeries<Data, DateTime>>[
- ColumnSeries<Data, DateTime>(
- initialSelectedDataIndexes: selectedItems,
- selectionSettings: SelectionSettings(
- enable: true,
- unselectedOpacity: 0,
- selectedBorderColor: const Color.fromRGBO(
- 0, 178, 206, 1),
- selectedColor: const Color.fromRGBO(0, 178, 206, 1),
- unselectedColor: Colors.transparent,
- selectionController: _rangeController),
- color: const Color.fromRGBO(255, 255, 255, 0),
- dashArray: <double>[5, 4],
- borderColor: const Color.fromRGBO(194, 194, 194, 1),
- animationDuration: 0,
- borderWidth: 1,
- dataSource: chartData,
- xValueMapper: (Data sales, int index) => sales.x,
- yValueMapper: (Data sales, int index) => sales.y)
- ],
- ),
+ return Scaffold(
+ body: Center(
+ child: SfRangeSelector(
+ min: DateTime(2010, 01, 01),
+ max: DateTime(2010, 09, 01),
+ interval: 2,
+ dateIntervalType: DateIntervalType.months,
+ dateFormat: DateFormat.yM(),
+ showTicks: true,
+ showLabels: true,
+ controller: _rangeController,
+ onChanged: (SfRangeValues values) {
+ setState(() {});
+ },
+ child: SizedBox(
+ height: 130,
+ child: SfCartesianChart(
+ margin: EdgeInsets.zero,
+ primaryXAxis: DateTimeAxis(
+ minimum: DateTime(2010, 01, 01),
+ maximum: DateTime(2010, 09, 01),
+ isVisible: false,
),
+ primaryYAxis: const NumericAxis(isVisible: false),
+ plotAreaBorderWidth: 0,
+ plotAreaBackgroundColor: Colors.transparent,
+ series: <ColumnSeries<Data, DateTime>>[
+ ColumnSeries<Data, DateTime>(
+ dataSource: chartData,
+ selectionBehavior: SelectionBehavior(
+ selectionController: _rangeController,
+ ),
+ xValueMapper: (Data sales, int index) => sales.x,
+ yValueMapper: (Data sales, int index) => sales.y,
+ pointColorMapper: (Data sales, int index) {
+ if (sales.x.isAfter(_rangeController.start) &&
+ sales.x.isBefore(_rangeController.end)) {
+ return const Color.fromRGBO(0, 178, 206, 1);
+ }
+ return Colors.transparent;
+ },
+ color: const Color.fromRGBO(255, 255, 255, 0),
+ dashArray: const <double>[5, 4],
+ borderColor: const Color.fromRGBO(194, 194, 194, 1),
+ animationDuration: 0,
+ borderWidth: 1,
+ ),
+ ],
),
- )
- );
+ ),
+ ),
+ ),
+ );
}
{% endhighlight %}