update the samples for new feature.
This commit is contained in:
yuvaraj.gajaraj
Родитель
bacdce90c2
Коммит
ef207b0b7b
120
README.md
120
README.md
|
|
@ -1,16 +1,116 @@
|
|||
# flutter_examples
|
||||
# Syncfusion Flutter examples
|
||||
|
||||
This project contains the Syncfusion Flutter UI widgets examples.
|
||||
This repository contains awesome demos of [Syncfusion Flutter UI widgets](https://www.syncfusion.com/flutter-widgets). This is the best place to check our widgets to get more insight into the usage of APIs. You can also check our widgets by installing the complete Flutter sample browser from [Google Play Store](https://play.google.com/store/apps/details?id=com.syncfusion.flutter.examples) or [App Store](https://apps.apple.com/us/app/syncfusion-flutter-ui-widgets/id1475231341), in which you can browse the demo for all the widgets and view the source code of each sample within the app itself.
|
||||
|
||||
## Getting Started
|
||||
<img src="images/flutter_examples.png"/>
|
||||
|
||||
This project is a starting point for a Flutter application.
|
||||
## Table of contents
|
||||
|
||||
A few resources to get you started if this is your first Flutter project:
|
||||
* [Requirements to run the demo](#requirements-to-run-the-demo)
|
||||
* [Repository Structure](#repository-structure)
|
||||
* [Widgets Catalog](#widgets-catalog)
|
||||
* [License](#license)
|
||||
* [Using the examples](#using-the-examples)
|
||||
* [Support and Feedback](#support-and-feedback)
|
||||
|
||||
- [Lab: Write your first Flutter app](https://flutter.dev/docs/get-started/codelab)
|
||||
- [Cookbook: Useful Flutter samples](https://flutter.dev/docs/cookbook)
|
||||
## <a name="requirements-to-run-the-demo"></a>Requirements to run the demo ##
|
||||
* IDE tools are [Visual Studio code](https://flutter.dev/docs/get-started/editor?tab=vscode) and [Android studio](https://flutter.dev/docs/get-started/editor?tab=androidstudio).
|
||||
* Flutter SDK
|
||||
| Channel| Version|
|
||||
|--------|--------|
|
||||
| Stable | [2.0.2](https://code.visualstudio.com/download)|
|
||||
| Beta | [2.0.2](https://storage.googleapis.com/flutter_infra/releases/beta/windows/flutter_windows_2.0.2-beta.zip)|
|
||||
* Dart and Flutter add-ons for Visual Studio Code (available via the Visual studio code extension) in Android Studio it available in plugin preference.
|
||||
|
||||
For help getting started with Flutter, view our
|
||||
[online documentation](https://flutter.dev/docs), which offers tutorials,
|
||||
samples, guidance on mobile development, and a full API reference.
|
||||
## <a name="repository-structure"></a> Repository Structure ##
|
||||
The <b>lib/samples</b> directory contains the Flutter widget examples for each widget such as Charts, DataGrid, etc. All the examples can be deployed in Android, iOS, and web platforms.
|
||||
|
||||
## <a name="widgets-catalog"></a>Widgets Catalog ##
|
||||
|
||||
| Widgets | Repository |
|
||||
| ------------- | --------------- |
|
||||
| Barcode Generator | [Link](https://github.com/syncfusion/flutter-examples/tree/master/lib/samples/barcodes) |
|
||||
| Calendar | [Link](https://github.com/syncfusion/flutter-examples/tree/master/lib/samples/calendar) |
|
||||
| Charts | [Link](https://github.com/syncfusion/flutter-examples/tree/master/lib/samples/chart) |
|
||||
| DataGrid | [Link](https://github.com/syncfusion/flutter-examples/tree/master/lib/samples/datagrid) |
|
||||
| Date Range Picker | [Link](https://github.com/syncfusion/flutter-examples/tree/master/lib/samples/date_picker) |
|
||||
| Linear Gauge | [Link](https://github.com/syncfusion/flutter-examples/tree/master/lib/samples/linear_gauge) |
|
||||
| Maps | [Link](https://github.com/syncfusion/flutter-examples/tree/master/lib/samples/maps) |
|
||||
| PDF | [Link](https://github.com/syncfusion/flutter-examples/tree/master/lib/samples/pdf) |
|
||||
| PDF Viewer | [Link](https://github.com/syncfusion/flutter-examples/tree/master/lib/samples/pdf_viewer) |
|
||||
| Progress Bar | [Link](https://github.com/syncfusion/flutter-examples/tree/master/lib/samples/progress_bar) |
|
||||
| Radial Gauge | [Link](https://github.com/syncfusion/flutter-examples/tree/master/lib/samples/gauge) |
|
||||
| Range Selector | [Link](https://github.com/syncfusion/flutter-examples/tree/master/lib/samples/sliders/range_selector) |
|
||||
| Range Slider | [Link](https://github.com/syncfusion/flutter-examples/tree/master/lib/samples/sliders/range_slider) |
|
||||
| Slider | [Link](https://github.com/syncfusion/flutter-examples/tree/master/lib/samples/sliders/slider) |
|
||||
| Spark Charts | [Link](https://github.com/syncfusion/flutter-examples/tree/master/lib/samples/sparkline) |
|
||||
| Signature Pad | [Link](https://github.com/syncfusion/flutter-examples/tree/master/lib/samples/signature_pad) |
|
||||
| Treemap | [Link](https://github.com/syncfusion/flutter-examples/tree/master/lib/samples/treemap) |
|
||||
| XlsIO | [Link](https://github.com/syncfusion/flutter-examples/tree/master/lib/samples/xlsio) |
|
||||
|
||||
## <a name="license"></a>License ##
|
||||
|
||||
Syncfusion has no liability for any damage or consequence that may arise by the use or viewing of the examples. The examples are for demonstrative purposes and if you choose to use or access the examples you agree to not hold Syncfusion liable, in any form, for any damage that is related to use, accessing or otherwise viewing the examples. By accessing, viewing, or otherwise seeing the examples you acknowledge and agree Syncfusion’s examples will not allow you to seek injunctive relief in any form for any claim related to the sample. If you do not agree to this, do not view, access, utilize or otherwise do anything with Syncfusion’s examples.
|
||||
|
||||
## <a name="using-the-examples"></a>Using the examples ##
|
||||
|
||||
**Step 1**
|
||||
|
||||
Unzip the downloaded flutter example archive.
|
||||
|
||||
**Note:** If you clone this repository ignore this step.
|
||||
|
||||
**Step 2**
|
||||
|
||||
Open the flutter example folder in an IDE.
|
||||
|
||||
**Step 3**
|
||||
|
||||
Run the following command to get the required packages.
|
||||
|
||||
```dart
|
||||
$ flutter pub get
|
||||
```
|
||||
|
||||
**Step 4**
|
||||
|
||||
Run your application either using `F5` or `Run > Start Debugging`.
|
||||
|
||||
## Get the demo application
|
||||
|
||||
Explore the full capabilities of our Flutter widgets on your device by installing our sample browser applications from the below app stores, and view samples code in GitHub.
|
||||
|
||||
<p align="center">
|
||||
<a href="https://play.google.com/store/apps/details?id=com.syncfusion.flutter.examples"><img src="https://cdn.syncfusion.com/content/images/FTControl/google-play-store.png"/></a>
|
||||
<a href="https://apps.apple.com/us/app/syncfusion-flutter-ui-widgets/id1475231341"><img src="https://cdn.syncfusion.com/content/images/FTControl/ios-store.png"/></a>
|
||||
<a href="https://flutter.syncfusion.com"><img src="https://cdn.syncfusion.com/content/images/FTControl/web-sample-browser.png"/></a>
|
||||
</p>
|
||||
<p align="center">
|
||||
<a href="https://www.microsoft.com/en-us/p/syncfusion-flutter-gallery/9nhnbwcsf85d?activetab=pivot:overviewtab"><img src="https://cdn.syncfusion.com/content/images/FTControl/windows-store.png"/></a>
|
||||
<a href="https://install.appcenter.ms/orgs/syncfusion-demos/apps/syncfusion-flutter-gallery/distribution_groups/release"><img src="https://cdn.syncfusion.com/content/images/FTControl/macos-app-center.png"/></a>
|
||||
<a href="https://snapcraft.io/syncfusion-flutter-gallery"><img src="https://cdn.syncfusion.com/content/images/FTControl/snap-store.png"/></a>
|
||||
</p>
|
||||
<p align="center">
|
||||
<a href="https://github.com/syncfusion/flutter-examples"><img src="https://cdn.syncfusion.com/content/images/FTControl/github-samples.png"/></a>
|
||||
</p>
|
||||
|
||||
|
||||
## Useful links
|
||||
Take a look at the following to learn more about Syncfusion Flutter widgets:
|
||||
|
||||
* [Syncfusion Flutter product page](https://www.syncfusion.com/flutter-widgets)
|
||||
* [User guide documentation](https://help.syncfusion.com/flutter/introduction/overview)
|
||||
* [API reference](https://help.syncfusion.com/flutter/introduction/api-reference)
|
||||
* [Knowledge base](https://www.syncfusion.com/kb/flutter)
|
||||
* [Video tutorials](https://www.syncfusion.com/tutorial-videos/flutter)
|
||||
|
||||
## Support and feedback
|
||||
|
||||
* For any other queries, reach our [Syncfusion support team](https://www.syncfusion.com/support/directtrac/incidents/newincident) or post the queries through the [Community forums](https://www.syncfusion.com/forums) and submit a feature request or a bug through our [Feedback portal](https://www.syncfusion.com/feedback/flutter).
|
||||
* To renew the subscription, click [renew](https://www.syncfusion.com/sales/products) or contact our sales team at salessupport@syncfusion.com | Toll Free: 1-888-9 DOTNET.
|
||||
|
||||
## About Syncfusion
|
||||
|
||||
Founded in 2001 and headquartered in Research Triangle Park, N.C., Syncfusion has more than 20,000 customers and more than 1 million users, including large financial institutions, Fortune 500 companies, and global IT consultancies.
|
||||
|
||||
Today we provide 1,000+ controls and frameworks for web ([ASP.NET Core](https://www.syncfusion.com/aspnet-core-ui-controls), [ASP.NET MVC](https://www.syncfusion.com/aspnet-mvc-ui-controls), [ASP.NET WebForms](https://www.syncfusion.com/jquery/aspnet-web-forms-ui-controls), [JavaScript](https://www.syncfusion.com/javascript-ui-controls), [Angular](https://www.syncfusion.com/angular-ui-components), [React](https://www.syncfusion.com/react-ui-components), [Vue](https://www.syncfusion.com/vue-ui-components), and [Blazor](https://www.syncfusion.com/blazor-components), mobile ([Xamarin](https://www.syncfusion.com/xamarin-ui-controls), [Flutter](https://www.syncfusion.com/flutter-widgets), [UWP](https://www.syncfusion.com/uwp-ui-controls), and [JavaScript](https://www.syncfusion.com/javascript-ui-controls)), and desktop development ([WinForms](https://www.syncfusion.com/winforms-ui-controls), [WPF](https://www.syncfusion.com/wpf-ui-controls), and [UWP](https://www.syncfusion.com/uwp-ui-controls)). We provide ready-to deploy enterprise software for dashboards, reports, data integration, and big data processing. Many customers have saved millions in licensing fees by deploying our software.
|
||||
|
|
@ -1,20 +1,27 @@
|
|||
package io.flutter.plugins;
|
||||
|
||||
import androidx.annotation.Keep;
|
||||
import androidx.annotation.NonNull;
|
||||
|
||||
import io.flutter.embedding.engine.FlutterEngine;
|
||||
import io.flutter.plugin.common.PluginRegistry;
|
||||
import io.flutter.plugins.pathprovider.PathProviderPlugin;
|
||||
import io.flutter.plugins.urllauncher.UrlLauncherPlugin;
|
||||
|
||||
/**
|
||||
* Generated file. Do not edit.
|
||||
* This file is generated by the Flutter tool based on the
|
||||
* plugins that support the Android platform.
|
||||
*/
|
||||
@Keep
|
||||
public final class GeneratedPluginRegistrant {
|
||||
public static void registerWith(@NonNull FlutterEngine flutterEngine) {
|
||||
flutterEngine.getPlugins().add(new io.flutter.plugins.pathprovider.PathProviderPlugin());
|
||||
flutterEngine.getPlugins().add(new com.syncfusion.flutter.pdfviewer.SyncfusionFlutterPdfViewerPlugin());
|
||||
flutterEngine.getPlugins().add(new io.flutter.plugins.urllauncher.UrlLauncherPlugin());
|
||||
public static void registerWith(PluginRegistry registry) {
|
||||
if (alreadyRegisteredWith(registry)) {
|
||||
return;
|
||||
}
|
||||
PathProviderPlugin.registerWith(registry.registrarFor("io.flutter.plugins.pathprovider.PathProviderPlugin"));
|
||||
UrlLauncherPlugin.registerWith(registry.registrarFor("io.flutter.plugins.urllauncher.UrlLauncherPlugin"));
|
||||
}
|
||||
|
||||
private static boolean alreadyRegisteredWith(PluginRegistry registry) {
|
||||
final String key = GeneratedPluginRegistrant.class.getCanonicalName();
|
||||
if (registry.hasPlugin(key)) {
|
||||
return true;
|
||||
}
|
||||
registry.registrarFor(key);
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
sdk.dir=C:\\Users\\DharanitharanPalanis\\AppData\\Local\\Android\\sdk
|
||||
sdk.dir=C:\\Users\\SriramKiranSenthilku\\AppData\\Local\\Android\\sdk
|
||||
flutter.sdk=C:\\src\\flutter
|
||||
flutter.buildMode=debug
|
||||
flutter.versionName=18.1.42
|
||||
Двоичный файл не отображается.
|
|
@ -0,0 +1 @@
|
|||
{"dob":"05/01/1992","name":"John","email":"John.simonsbistro@gmail.com","gender":"Male","state":"Georgia","newsletter":"On"}
|
||||
|
|
@ -0,0 +1,24 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<xfdf xmlns="http://ns.adobe.com/xfdf/" xml:space="preserve">
|
||||
<fields>
|
||||
<field name="dob">
|
||||
<value>05/01/1992</value>
|
||||
</field>
|
||||
<field name="name">
|
||||
<value>John</value>
|
||||
</field>
|
||||
<field name="email">
|
||||
<value>John.simonsbistro@gmail.com</value>
|
||||
</field>
|
||||
<field name="gender">
|
||||
<value>Male</value>
|
||||
</field>
|
||||
<field name="state">
|
||||
<value>Georgia</value>
|
||||
</field>
|
||||
<field name="newsletter">
|
||||
<value>On</value>
|
||||
</field>
|
||||
</fields>
|
||||
<f href=""/>
|
||||
</xfdf>
|
||||
|
|
@ -0,0 +1,9 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<Fields>
|
||||
<dob>05/01/1992</dob>
|
||||
<name>John</name>
|
||||
<email>John.simonsbistro@gmail.com</email>
|
||||
<gender>Male</gender>
|
||||
<state>Georgia</state>
|
||||
<newsletter>On</newsletter>
|
||||
</Fields>
|
||||
Двоичный файл не отображается.
|
После Ширина: | Высота: | Размер: 107 KiB |
|
|
@ -579,7 +579,7 @@ Widget getLeftSideDrawer(SampleModel _model) {
|
|||
)),
|
||||
Align(
|
||||
alignment: Alignment.bottomCenter,
|
||||
child: Text('Version 19.1.63',
|
||||
child: Text('Version 19.2.44',
|
||||
style: TextStyle(
|
||||
color: _model.drawerTextIconColor,
|
||||
fontSize: 12,
|
||||
|
|
|
|||
|
|
@ -21,12 +21,16 @@ class WidgetCategory {
|
|||
this.controlList,
|
||||
this.mobileCategoryId,
|
||||
this.webCategoryId,
|
||||
this.showInWeb]);
|
||||
this.platformsToHide]);
|
||||
|
||||
/// Getting the control details from the json file
|
||||
factory WidgetCategory.fromJson(Map<String, dynamic> json) {
|
||||
return WidgetCategory(json['categoryName'], json['controlList'],
|
||||
json['mobileCategoryId'], json['webCategoryId'], json['showInWeb']);
|
||||
return WidgetCategory(
|
||||
json['categoryName'],
|
||||
json['controlList'],
|
||||
json['mobileCategoryId'],
|
||||
json['webCategoryId'],
|
||||
json['platformsToHide']);
|
||||
}
|
||||
|
||||
/// Name of the category
|
||||
|
|
@ -41,12 +45,16 @@ class WidgetCategory {
|
|||
/// Sorting the categories based on this id in web.
|
||||
final int? webCategoryId;
|
||||
|
||||
/// Specify false if the category need not to show in web
|
||||
/// (as Viewer - not supported in web).
|
||||
final bool? showInWeb;
|
||||
|
||||
/// Selected control in the controllist under the particular category
|
||||
int? selectedIndex = 0;
|
||||
|
||||
/// To specify the category not to show on the web/android/iOS/windows/linux/macOS
|
||||
/// platforms in list format.
|
||||
///
|
||||
/// Eg: In json file we can specify like below,
|
||||
///
|
||||
/// "platformsToHide": ["linux", "android"] => the specific category should not show on the linux and android platforms
|
||||
final List<dynamic>? platformsToHide;
|
||||
}
|
||||
|
||||
/// Defines the control class.
|
||||
|
|
@ -60,8 +68,8 @@ class Control {
|
|||
this.displayType,
|
||||
this.subItems,
|
||||
this.controlId,
|
||||
this.showInWeb,
|
||||
this.isBeta);
|
||||
this.isBeta,
|
||||
this.platformsToHide);
|
||||
|
||||
/// Getting the control details from the json file
|
||||
factory Control.fromJson(Map<String, dynamic> json) {
|
||||
|
|
@ -73,8 +81,8 @@ class Control {
|
|||
json['displayType'],
|
||||
json['subItems'],
|
||||
json['controlId'],
|
||||
json['showInWeb'],
|
||||
json['isBeta']);
|
||||
json['isBeta'],
|
||||
json['platformsToHide']);
|
||||
}
|
||||
|
||||
/// Contains title of the control, display in the home page
|
||||
|
|
@ -96,10 +104,6 @@ class Control {
|
|||
/// Mention as card/fullView, by default it will taken as "fullView".
|
||||
final String? displayType;
|
||||
|
||||
/// Specify false if the control need not to show in web
|
||||
/// (as pdf viewer - not supported in web).
|
||||
final bool? showInWeb;
|
||||
|
||||
/// Contains the subItem list which comes under sample type
|
||||
List<SubItem>? sampleList;
|
||||
|
||||
|
|
@ -111,6 +115,14 @@ class Control {
|
|||
|
||||
/// To specify the control is beta or not in `https://pub.dev/publishers/syncfusion.com/packages`
|
||||
final bool? isBeta;
|
||||
|
||||
/// To specify the control not to show on the web/android/iOS/windows/linux/macOS
|
||||
/// platforms in list format.
|
||||
///
|
||||
/// Eg: In json file we can specify like below,
|
||||
///
|
||||
/// "platformsToHide": ["linux", "android"] => the current control should not show on the linux and android platforms
|
||||
final List<dynamic>? platformsToHide;
|
||||
}
|
||||
|
||||
/// Contains the detail of sample in different hierarchy levels
|
||||
|
|
@ -126,10 +138,10 @@ class SubItem {
|
|||
this.description,
|
||||
this.status,
|
||||
this.subItems,
|
||||
this.showInWeb,
|
||||
this.sourceLink,
|
||||
this.sourceText,
|
||||
this.needsPropertyPanel]);
|
||||
this.needsPropertyPanel,
|
||||
this.platformsToHide]);
|
||||
|
||||
/// Getting the SubItem details from the json file
|
||||
factory SubItem.fromJson(Map<String, dynamic> json) {
|
||||
|
|
@ -142,10 +154,10 @@ class SubItem {
|
|||
json['description'],
|
||||
json['status'],
|
||||
json['subItems'],
|
||||
json['showInWeb'],
|
||||
json['sourceLink'],
|
||||
json['sourceText'],
|
||||
json['needsPropertyPanel']);
|
||||
json['needsPropertyPanel'],
|
||||
json['platformsToHide']);
|
||||
}
|
||||
|
||||
/// Type given as parent/child/sample.
|
||||
|
|
@ -180,10 +192,6 @@ class SubItem {
|
|||
/// Status of the sample, displays above the sample
|
||||
final String? status;
|
||||
|
||||
/// Specify false if the sample need not to show in web
|
||||
/// (as sample with dash array).
|
||||
final bool? showInWeb;
|
||||
|
||||
/// SourceLink which will launch a url of the sample's source
|
||||
/// on tapping source text present under the sample.
|
||||
final String? sourceLink;
|
||||
|
|
@ -214,6 +222,14 @@ class SubItem {
|
|||
|
||||
/// Holds appropriate control
|
||||
Control? control;
|
||||
|
||||
/// To specify the sample not to show on the web/android/iOS/windows/linux/macOS
|
||||
/// platforms in list format.
|
||||
///
|
||||
/// Eg: In json file we can specify like below,
|
||||
///
|
||||
/// "platformsToHide": ["linux", "android"] => the specific sample should not show on the linux and android platforms
|
||||
final List<dynamic>? platformsToHide;
|
||||
}
|
||||
|
||||
/// SampleModel class is the base of the Sample browser
|
||||
|
|
@ -428,6 +444,15 @@ class SampleModel extends Listenable {
|
|||
///Check whether application is running on the macOS desktop
|
||||
bool isMacOS = false;
|
||||
|
||||
/// This controls to open / hide the property panel
|
||||
bool isPropertyPanelOpened = true;
|
||||
|
||||
/// holds the current route of sample.
|
||||
late SampleRoute currentSampleRoute;
|
||||
|
||||
/// holds the collection of all sample routes.
|
||||
static List<SampleRoute> sampleRoutes = <SampleRoute>[];
|
||||
|
||||
/// Switching between light, dark, system themes
|
||||
void changeTheme(ThemeData _themeData) {
|
||||
themeData = _themeData;
|
||||
|
|
@ -509,16 +534,15 @@ Future<void> updateControlItems() async {
|
|||
for (int index = 0; index < categoryList.length; index++) {
|
||||
SampleModel._categoryList.add(WidgetCategory.fromJson(categoryList[index]));
|
||||
final List<Control> controlList = <Control>[];
|
||||
if ((!_isWeb || SampleModel._categoryList[index].showInWeb != false) &&
|
||||
(SampleModel._categoryList[index].categoryName != 'Viewer' ||
|
||||
kIsWeb ||
|
||||
(!Platform.isWindows && !Platform.isLinux))) {
|
||||
if (SampleModel._categoryList[index].platformsToHide == null ||
|
||||
_needToShow(SampleModel._categoryList[index].platformsToHide)) {
|
||||
for (int i = 0;
|
||||
i < SampleModel._categoryList[index].controlList!.length;
|
||||
i++) {
|
||||
controlList.add(
|
||||
Control.fromJson(SampleModel._categoryList[index].controlList![i]));
|
||||
if (!_isWeb || controlList[i].showInWeb != false) {
|
||||
if (controlList[i].platformsToHide == null ||
|
||||
_needToShow(controlList[i].platformsToHide)) {
|
||||
for (int j = 0; j < controlList[i].subItems!.length; j++) {
|
||||
_firstLevelSubItems
|
||||
.add(SubItem.fromJson(controlList[i].subItems![j]));
|
||||
|
|
@ -526,10 +550,12 @@ Future<void> updateControlItems() async {
|
|||
for (int k = 0;
|
||||
k < _firstLevelSubItems[j].subItems!.length;
|
||||
k++) {
|
||||
if (!_isWeb ||
|
||||
SubItem.fromJson(_firstLevelSubItems[j].subItems![k])
|
||||
.showInWeb !=
|
||||
false) {
|
||||
if (SubItem.fromJson(_firstLevelSubItems[j].subItems![k])
|
||||
.platformsToHide ==
|
||||
null ||
|
||||
_needToShow(
|
||||
SubItem.fromJson(_firstLevelSubItems[j].subItems![k])
|
||||
.platformsToHide)) {
|
||||
_secondLevelSubItems.add(
|
||||
SubItem.fromJson(_firstLevelSubItems[j].subItems![k]));
|
||||
for (int l = 0;
|
||||
|
|
@ -538,12 +564,15 @@ Future<void> updateControlItems() async {
|
|||
.subItems!
|
||||
.length;
|
||||
l++) {
|
||||
if (!_isWeb ||
|
||||
SubItem.fromJson(_secondLevelSubItems[
|
||||
if (SubItem.fromJson(_secondLevelSubItems[
|
||||
_secondLevelSubItems.length - 1]
|
||||
.subItems![l])
|
||||
.showInWeb !=
|
||||
false) {
|
||||
.platformsToHide ==
|
||||
null ||
|
||||
_needToShow(SubItem.fromJson(_secondLevelSubItems[
|
||||
_secondLevelSubItems.length - 1]
|
||||
.subItems![l])
|
||||
.platformsToHide)) {
|
||||
_thirdLevelSubItems.add(SubItem.fromJson(
|
||||
_secondLevelSubItems[_secondLevelSubItems.length - 1]
|
||||
.subItems![l]));
|
||||
|
|
@ -594,15 +623,18 @@ Future<void> updateControlItems() async {
|
|||
_firstLevelSubItems[j].subItems = _secondLevelSubItems;
|
||||
_secondLevelSubItems = <SubItem>[];
|
||||
} else if (_firstLevelSubItems[j].type == 'child') {
|
||||
if (!_isWeb || _firstLevelSubItems[j].showInWeb != false) {
|
||||
if (_firstLevelSubItems[j].platformsToHide == null ||
|
||||
_needToShow(_firstLevelSubItems[j].platformsToHide)) {
|
||||
_isChild = true;
|
||||
for (int k = 0;
|
||||
k < _firstLevelSubItems[j].subItems!.length;
|
||||
k++) {
|
||||
if (!_isWeb ||
|
||||
SubItem.fromJson(_firstLevelSubItems[j].subItems![k])
|
||||
.showInWeb !=
|
||||
false) {
|
||||
if (SubItem.fromJson(_firstLevelSubItems[j].subItems![k])
|
||||
.platformsToHide ==
|
||||
null ||
|
||||
_needToShow(
|
||||
SubItem.fromJson(_firstLevelSubItems[j].subItems![k])
|
||||
.platformsToHide)) {
|
||||
_secondLevelSubItems.add(
|
||||
SubItem.fromJson(_firstLevelSubItems[j].subItems![k]));
|
||||
_secondLevelSubItems[_secondLevelSubItems.length - 1]
|
||||
|
|
@ -642,7 +674,8 @@ Future<void> updateControlItems() async {
|
|||
} else {
|
||||
_isSample = true;
|
||||
_firstLevelSubItems[j].sampleIndex ??= j;
|
||||
if (!_isWeb || _firstLevelSubItems[j].showInWeb != false) {
|
||||
if (_firstLevelSubItems[j].platformsToHide == null ||
|
||||
_needToShow(_firstLevelSubItems[j].platformsToHide)) {
|
||||
final String breadCrumbText = ('/' +
|
||||
controlList[i].title! +
|
||||
'/' +
|
||||
|
|
@ -709,14 +742,42 @@ Future<void> updateControlItems() async {
|
|||
}
|
||||
}
|
||||
|
||||
bool _needToShow(List<dynamic>? platforms) {
|
||||
return !((platforms!.contains('web') && kIsWeb) ||
|
||||
(!kIsWeb &&
|
||||
((platforms.contains('linux') && Platform.isLinux) ||
|
||||
(platforms.contains('android') && Platform.isAndroid) ||
|
||||
(platforms.contains('iOS') && Platform.isIOS) ||
|
||||
(platforms.contains('windows') && Platform.isWindows) ||
|
||||
(platforms.contains('macOS') && Platform.isMacOS))));
|
||||
}
|
||||
|
||||
///Holds the [SubItem] and the appropriate route name
|
||||
class SampleRoute {
|
||||
///Contains the URL routes of the appropriate subItem
|
||||
SampleRoute({this.routeName, this.subItem});
|
||||
|
||||
///Holds the text which show in the URL
|
||||
final String? routeName;
|
||||
SampleRoute(
|
||||
{this.routeName,
|
||||
this.subItem,
|
||||
this.currentContext,
|
||||
this.currentState,
|
||||
this.currentWidget,
|
||||
this.globalKey});
|
||||
|
||||
///Holds the sample details
|
||||
final SubItem? subItem;
|
||||
|
||||
///Holds the global key
|
||||
final GlobalKey<State>? globalKey;
|
||||
|
||||
///Holds the text which show in the URL
|
||||
String? routeName;
|
||||
|
||||
///Holds the current state
|
||||
State? currentState;
|
||||
|
||||
///Holds the current context
|
||||
BuildContext? currentContext;
|
||||
|
||||
///Holds the current widget
|
||||
Widget? currentWidget;
|
||||
}
|
||||
|
|
|
|||
Разница между файлами не показана из-за своего большого размера
Загрузить разницу
|
|
@ -52,6 +52,8 @@ class _SampleBrowserState extends State<SampleBrowser> {
|
|||
}
|
||||
navigationRoutes[sampleRoute.routeName!] = (BuildContext context) =>
|
||||
WebLayoutPage(
|
||||
key: GlobalKey<State>(),
|
||||
routeName: sampleRoute.routeName!,
|
||||
sampleModel: _sampleListModel,
|
||||
category: category,
|
||||
subItem: sampleRoute.subItem);
|
||||
|
|
@ -511,11 +513,17 @@ class _HomePageState extends State<HomePage> {
|
|||
text: TextSpan(
|
||||
children: <TextSpan>[
|
||||
TextSpan(
|
||||
text: model.sampleList[i].title,
|
||||
text: model.sampleList[i].control!.title,
|
||||
style: TextStyle(
|
||||
fontFamily: 'Roboto-Bold',
|
||||
fontWeight: FontWeight.normal,
|
||||
color: model.textColor,
|
||||
letterSpacing: 0.3)),
|
||||
TextSpan(
|
||||
text: ' - ' + model.sampleList[i].title!,
|
||||
style: TextStyle(
|
||||
fontFamily: 'HeeboMedium',
|
||||
fontWeight: FontWeight.normal,
|
||||
fontSize: 14.0,
|
||||
color: model.textColor,
|
||||
letterSpacing: 0.3)),
|
||||
],
|
||||
|
|
@ -763,6 +771,10 @@ class _CategorizedCardsState extends State<_CategorizedCards> {
|
|||
final List<Widget> items = <Widget>[];
|
||||
for (int i = 0; i < category.controlList!.length; i++) {
|
||||
final Control control = category.controlList![i] as Control;
|
||||
final String? status =
|
||||
control.title == 'PDF Viewer' && !kIsWeb && Platform.isMacOS
|
||||
? 'New'
|
||||
: control.status;
|
||||
items.add(Container(
|
||||
color: model.cardColor,
|
||||
child: Material(
|
||||
|
|
@ -805,8 +817,13 @@ class _CategorizedCardsState extends State<_CategorizedCards> {
|
|||
? Padding(
|
||||
padding: const EdgeInsets.only(left: 8),
|
||||
child: Container(
|
||||
padding: const EdgeInsets.fromLTRB(
|
||||
3, 3, 3, 2),
|
||||
alignment: Alignment.center,
|
||||
padding: model.isWeb &&
|
||||
model.isMobileResolution
|
||||
? const EdgeInsets.fromLTRB(
|
||||
3, 1.5, 3, 5.5)
|
||||
: const EdgeInsets.fromLTRB(
|
||||
3, 3, 3, 2),
|
||||
decoration: const BoxDecoration(
|
||||
shape: BoxShape.rectangle,
|
||||
color: Color.fromRGBO(
|
||||
|
|
@ -822,24 +839,23 @@ class _CategorizedCardsState extends State<_CategorizedCards> {
|
|||
)))
|
||||
: Container()
|
||||
]),
|
||||
if (control.status != null)
|
||||
if (status != null)
|
||||
Container(
|
||||
decoration: BoxDecoration(
|
||||
shape: BoxShape.rectangle,
|
||||
color: control.status!.toLowerCase() ==
|
||||
'new'
|
||||
color: status.toLowerCase() == 'new'
|
||||
? const Color.fromRGBO(55, 153, 30, 1)
|
||||
: control.status!.toLowerCase() ==
|
||||
'updated'
|
||||
: status.toLowerCase() == 'updated'
|
||||
? const Color.fromRGBO(
|
||||
246, 117, 0, 1)
|
||||
: Colors.transparent,
|
||||
borderRadius: const BorderRadius.only(
|
||||
topLeft: Radius.circular(10),
|
||||
bottomLeft: Radius.circular(10))),
|
||||
padding:
|
||||
const EdgeInsets.fromLTRB(6, 2.7, 4, 2.7),
|
||||
child: Text(control.status!,
|
||||
padding: model.isWeb && model.isMobileResolution
|
||||
? const EdgeInsets.fromLTRB(6, 1.5, 4, 5.5)
|
||||
: const EdgeInsets.fromLTRB(6, 2.7, 4, 2.7),
|
||||
child: Text(status,
|
||||
style: const TextStyle(
|
||||
fontFamily: 'Roboto-Medium',
|
||||
color: Colors.white,
|
||||
|
|
|
|||
|
|
@ -38,7 +38,7 @@
|
|||
"description": "Visualize hierarchically structured data that is sized and colored by quantitative variables",
|
||||
"image": "images/treemap.png",
|
||||
"displayType": "tab",
|
||||
"status": "New",
|
||||
"status": "Updated",
|
||||
"isBeta": true,
|
||||
"controlId": 4,
|
||||
"subItems": [
|
||||
|
|
@ -56,12 +56,14 @@
|
|||
"type": "sample",
|
||||
"title": "Slice",
|
||||
"key": "slice_treemap_flat",
|
||||
"status": "Updated",
|
||||
"codeLink": "https://github.com/syncfusion/flutter-examples/tree/master/lib/samples/treemap/flat/flat.dart"
|
||||
},
|
||||
{
|
||||
"type": "sample",
|
||||
"title": "Dice",
|
||||
"key": "dice_treemap_flat",
|
||||
"status": "Updated",
|
||||
"codeLink": "https://github.com/syncfusion/flutter-examples/tree/master/lib/samples/treemap/flat/flat.dart"
|
||||
}
|
||||
]
|
||||
|
|
@ -74,7 +76,9 @@
|
|||
"type": "sample",
|
||||
"title": "Hierarchical",
|
||||
"key": "squarified_treemap_hierarchical",
|
||||
"codeLink": "https://github.com/syncfusion/flutter-examples/tree/master/lib/samples/treemap/hierarchical/hierarchical.dart"
|
||||
"status": "Updated",
|
||||
"codeLink": "https://github.com/syncfusion/flutter-examples/tree/master/lib/samples/treemap/hierarchical/hierarchical.dart",
|
||||
"needsPropertyPanel": true
|
||||
}
|
||||
]
|
||||
},
|
||||
|
|
@ -114,6 +118,19 @@
|
|||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"type": "child",
|
||||
"title": "Drilldown",
|
||||
"subItems": [
|
||||
{
|
||||
"type": "sample",
|
||||
"title": "Drilldown",
|
||||
"key": "squarified_treemap_drilldown",
|
||||
"status": "New",
|
||||
"codeLink": "https://github.com/syncfusion/flutter-examples/tree/master/lib/samples/treemap/drilldown/drilldown.dart"
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"type": "child",
|
||||
"title": "Custom background",
|
||||
|
|
@ -130,9 +147,9 @@
|
|||
},
|
||||
{
|
||||
"title": "Cartesian Charts",
|
||||
"status": "Updated",
|
||||
"description": "Plot over 30 chart types ranging from line charts to financial charts",
|
||||
"image": "images/cartesian_types.png",
|
||||
"status": "Updated",
|
||||
"controlId": 1,
|
||||
"subItems": [
|
||||
{
|
||||
|
|
@ -355,7 +372,12 @@
|
|||
{
|
||||
"title": "Customized bar chart",
|
||||
"key": "customized_bar_chart",
|
||||
"showInWeb": false,
|
||||
"platformsToHide": [
|
||||
"linux",
|
||||
"macOS",
|
||||
"windows",
|
||||
"web"
|
||||
],
|
||||
"description": "This sample demonstrates the rendering of custom bars. Here, the bars are filled with images, to look like pattern fill.",
|
||||
"codeLink": "https://github.com/syncfusion/flutter-examples/blob/master/lib/samples/chart/cartesian_charts/chart_types/bar/customized_bar_chart.dart",
|
||||
"sourceLink": "https://www.makeuseof.com/tag/most-popular-android-apps/",
|
||||
|
|
@ -689,7 +711,6 @@
|
|||
{
|
||||
"title": "Infinite scrolling",
|
||||
"key": "infinite_scrolling",
|
||||
"status": "New",
|
||||
"description": "This sample demonstrates the infinite scrolling functionality. When horizontal scrolling reaches the end of the chart, more data will be loaded and a circular progress indicator will be shown until loading. ",
|
||||
"codeLink": "https://github.com/syncfusion/flutter-examples/blob/master/lib/samples/chart/cartesian_charts/on_demand_loading/infinite_scrolling.dart"
|
||||
}
|
||||
|
|
@ -740,8 +761,7 @@
|
|||
"title": "Default category axis",
|
||||
"key": "default_category_axis",
|
||||
"codeLink": "https://github.com/syncfusion/flutter-examples/blob/master/lib/samples/chart/cartesian_charts/axis_types/category/default_category_axis.dart",
|
||||
"description": "",
|
||||
"status": ""
|
||||
"description": ""
|
||||
},
|
||||
{
|
||||
"title": "Arranged by index",
|
||||
|
|
@ -755,7 +775,6 @@
|
|||
"key": "category_label_placement",
|
||||
"codeLink": "https://github.com/syncfusion/flutter-examples/blob/master/lib/samples/chart/cartesian_charts/axis_types/category/label_placement.dart",
|
||||
"description": "",
|
||||
"status": "",
|
||||
"needsPropertyPanel": true
|
||||
}
|
||||
]
|
||||
|
|
@ -770,7 +789,6 @@
|
|||
"key": "default_datetime_axis",
|
||||
"codeLink": "https://github.com/syncfusion/flutter-examples/blob/master/lib/samples/chart/cartesian_charts/axis_types/date_time/default_date_time_axis.dart",
|
||||
"description": "",
|
||||
"status": "",
|
||||
"sourceLink": "https://www.x-rates.com/graph/?from=USD&to=INR&amount=1",
|
||||
"sourceText": "www.x-rates.com"
|
||||
},
|
||||
|
|
@ -779,7 +797,6 @@
|
|||
"key": "datetime_axis_with_label_format",
|
||||
"codeLink": "https://github.com/syncfusion/flutter-examples/blob/master/lib/samples/chart/cartesian_charts/axis_types/date_time/date_time_axis_with_label_format.dart",
|
||||
"description": "",
|
||||
"status": "",
|
||||
"sourceLink": "https://en.wikipedia.org/wiki/List_of_earthquakes_in_Indonesia",
|
||||
"sourceText": "en.wikipedia.org"
|
||||
}
|
||||
|
|
@ -789,21 +806,18 @@
|
|||
"type": "child",
|
||||
"title": "Date Time Category",
|
||||
"displayType": "card",
|
||||
"status": "New",
|
||||
"subItems": [
|
||||
{
|
||||
"title": "Default date time category axis",
|
||||
"key": "default_datetime_category_axis",
|
||||
"codeLink": "https://github.com/syncfusion/flutter-examples/blob/master/lib/samples/chart/cartesian_charts/axis_types/date_time_category/default_date_time_category.dart",
|
||||
"description": "",
|
||||
"status": "new"
|
||||
"description": ""
|
||||
},
|
||||
{
|
||||
"title": "Label format",
|
||||
"key": "default_datetime_category_axis_label",
|
||||
"codeLink": "https://github.com/syncfusion/flutter-examples/blob/master/lib/samples/chart/cartesian_charts/axis_types/date_time_category/date_time_category_with_label_format.dart",
|
||||
"description": "",
|
||||
"status": "new"
|
||||
"description": ""
|
||||
}
|
||||
]
|
||||
},
|
||||
|
|
@ -835,6 +849,13 @@
|
|||
"title": "Axis Features",
|
||||
"displayType": "card",
|
||||
"subItems": [
|
||||
{
|
||||
"title": "Interval type",
|
||||
"key": "interval_type",
|
||||
"status": "New",
|
||||
"codeLink": "https://github.com/syncfusion/flutter-examples/blob/master/lib/samples/chart/cartesian_charts/axis_features/interval_type.dart",
|
||||
"needsPropertyPanel": true
|
||||
},
|
||||
{
|
||||
"title": "Opposed axes",
|
||||
"key": "opposed_axes",
|
||||
|
|
@ -1078,6 +1099,7 @@
|
|||
},
|
||||
{
|
||||
"title": "Legend with various options",
|
||||
"status": "Updated",
|
||||
"key": "cartesian_legend_various_options",
|
||||
"codeLink": "https://github.com/syncfusion/flutter-examples/blob/master/lib/samples/chart/cartesian_charts/legend/legend_various_options.dart",
|
||||
"needsPropertyPanel": true
|
||||
|
|
@ -1161,13 +1183,11 @@
|
|||
{
|
||||
"type": "child",
|
||||
"title": "Trackball",
|
||||
"status": "Updated",
|
||||
"displayType": "card",
|
||||
"subItems": [
|
||||
{
|
||||
"title": "Chart with trackball",
|
||||
"key": "chart_with_trackball",
|
||||
"status": "Updated",
|
||||
"description": "The trackball is enabled in this sample. Tap the chart to show the trackball and drag the chart to change the position of the trackball continuously. On the web, you can move the cursor over the chart area to display the trackball.",
|
||||
"codeLink": "https://github.com/syncfusion/flutter-examples/blob/master/lib/samples/chart/cartesian_charts/user_interactions/trackball/chart_with_trackball.dart",
|
||||
"needsPropertyPanel": true
|
||||
|
|
@ -1189,7 +1209,8 @@
|
|||
{
|
||||
"title": "Selection modes",
|
||||
"key": "selection_modes",
|
||||
"description": "This sample depicts the selection feature in the chart. Tap the data point to select or unselect in mobile and web click the data points.",
|
||||
"status": "Updated",
|
||||
"description": "This sample depicts the selection feature in the chart. In mobile, tap the data points and on web/desktop click the data points to select or deselect them.",
|
||||
"codeLink": "https://github.com/syncfusion/flutter-examples/blob/master/lib/samples/chart/cartesian_charts/user_interactions/selection/selection_modes.dart",
|
||||
"needsPropertyPanel": true
|
||||
},
|
||||
|
|
@ -1207,6 +1228,13 @@
|
|||
"title": "Events",
|
||||
"displayType": "card",
|
||||
"subItems": [
|
||||
{
|
||||
"title": "Data point events",
|
||||
"key": "data_points",
|
||||
"status": "New",
|
||||
"description": "Tap on a data point to display additional information in the snack bar. Double-tap on it to navigate to that site and long press on it to get the sorting options. This is achieved by using the onPointTap, onPointDoubleTap and onPointLongPress callbacks.",
|
||||
"codeLink": " https://github.com/syncfusion/flutter-examples/blob/master/lib/samples/chart/cartesian_charts/user_interactions/events/data_point_events.dart"
|
||||
},
|
||||
{
|
||||
"title": "Events",
|
||||
"key": "events",
|
||||
|
|
@ -1244,7 +1272,6 @@
|
|||
{
|
||||
"title": "Pagination",
|
||||
"key": "pagination",
|
||||
"status": "New",
|
||||
"description": "This sample shows how to view the next set of data on swiping the chart using the 'onPlotAreaSwipe' callback function. You can swipe from left to right or vice versa and also click on the days at the bottom to view the next set of data.",
|
||||
"codeLink": "https://github.com/syncfusion/flutter-examples/blob/master/lib/samples/chart/cartesian_charts/user_interactions/pagination.dart"
|
||||
}
|
||||
|
|
@ -1258,7 +1285,6 @@
|
|||
{
|
||||
"title": "Auto Scrolling",
|
||||
"description": "In this sample, the data is being added every second. The chart is scrolled to the end automatically to view the current data and you can pan the chart from left to right direction to view the previous data points.",
|
||||
"status": "new",
|
||||
"key": "auto_scrolling",
|
||||
"codeLink": "https://github.com/syncfusion/flutter-examples/blob/master/lib/samples/chart/cartesian_charts/user_interactions/auto_scrolling.dart"
|
||||
}
|
||||
|
|
@ -1432,12 +1458,22 @@
|
|||
"type": "child",
|
||||
"title": "Exporting",
|
||||
"displayType": "tab",
|
||||
"showInWeb": false,
|
||||
"platformsToHide": [
|
||||
"linux",
|
||||
"macOS",
|
||||
"windows",
|
||||
"web"
|
||||
],
|
||||
"subItems": [
|
||||
{
|
||||
"title": "Export",
|
||||
"key": "exporting_chart",
|
||||
"showInWeb": false,
|
||||
"platformsToHide": [
|
||||
"linux",
|
||||
"macOS",
|
||||
"windows",
|
||||
"web"
|
||||
],
|
||||
"codeLink": "https://github.com/syncfusion/flutter-examples/blob/master/lib/samples/chart/cartesian_charts/export.dart"
|
||||
}
|
||||
]
|
||||
|
|
@ -1446,9 +1482,9 @@
|
|||
},
|
||||
{
|
||||
"title": "Circular Charts",
|
||||
"status": "Updated",
|
||||
"description": "Visualize the data using pie, doughnut, and radial bar charts",
|
||||
"image": "images/circle_series.png",
|
||||
"status": "Updated",
|
||||
"controlId": 2,
|
||||
"subItems": [
|
||||
{
|
||||
|
|
@ -1482,7 +1518,7 @@
|
|||
{
|
||||
"title": "Grouping",
|
||||
"key": "pie_with_grouping",
|
||||
"description": "This sample demonstrates the grouping functionality in a pie chart. Data points’ values less than the specified value can be grouped together.",
|
||||
"description": "This sample demonstrates the grouping functionality in the pie chart. Data points whose values are less than the specified value will be grouped together",
|
||||
"codeLink": "https://github.com/syncfusion/flutter-examples/blob/master/lib/samples/chart/circular_charts/chart_types/pie/pie_with_grouping.dart"
|
||||
},
|
||||
{
|
||||
|
|
@ -1496,21 +1532,18 @@
|
|||
"key": "pie_with_gradient",
|
||||
"description": "This sample demonstrates how to apply different types of gradient to the pie slices. Here you can apply the linear, sweep, and radial gradients using the dropdown menu in the property panel.",
|
||||
"codeLink": "https://github.com/syncfusion/flutter-examples/blob/master/lib/samples/chart/circular_charts/chart_types/pie/pie_with_gradient.dart",
|
||||
"status": "new",
|
||||
"needsPropertyPanel": true
|
||||
},
|
||||
{
|
||||
"title": "Image fill",
|
||||
"key": "pie_with_imageShader",
|
||||
"status": "new",
|
||||
"description":"This sample demonstrates how to fill the pie slices with various images for each slice using the 'ImageShader'.",
|
||||
"description": "This sample demonstrates how to fill the pie slices with various images for each slice using the 'ImageShader'.",
|
||||
"codeLink": "https://github.com/syncfusion/flutter-examples/blob/master/lib/samples/chart/circular_charts/chart_types/pie/pie_with_image.dart"
|
||||
},
|
||||
{
|
||||
"title": "Point render mode",
|
||||
"key": "pie_point_render_mode",
|
||||
"status": "new",
|
||||
"description":"This sample demonstrates how to fill the pie slices with various images for each slice using the 'ImageShader'.",
|
||||
"description": "This sample demonstrates how to fill the pie slices with various images for each slice using the 'ImageShader'.",
|
||||
"codeLink": "https://github.com/syncfusion/flutter-examples/blob/master/lib/samples/chart/circular_charts/chart_types/pie/point_render_mode.dart",
|
||||
"needsPropertyPanel": true
|
||||
}
|
||||
|
|
@ -1553,9 +1586,8 @@
|
|||
{
|
||||
"title": "Gradient fill",
|
||||
"key": "doughnut_with_gradient",
|
||||
"description":"This sample demonstrates how to apply different types of gradient to the doughnut slices. Here you can apply the linear, sweep, and radial gradients using the dropdown menu in the property panel.",
|
||||
"description": "This sample demonstrates how to apply different types of gradient to the doughnut slices. Here you can apply the linear, sweep, and radial gradients using the dropdown menu in the property panel.",
|
||||
"codeLink": "https://github.com/syncfusion/flutter-examples/blob/master/lib/samples/chart/circular_charts/chart_types/doughnut/doughnut_with_gradient.dart",
|
||||
"status": "new",
|
||||
"needsPropertyPanel": true
|
||||
}
|
||||
]
|
||||
|
|
@ -1583,10 +1615,15 @@
|
|||
},
|
||||
{
|
||||
"title": "Gradient fill",
|
||||
"status": "new",
|
||||
"key": "radialbar_with_gradient",
|
||||
"description": "This sample renders the radial bar chart with gradient.",
|
||||
"codeLink": "https://github.com/syncfusion/flutter-examples/blob/master/lib/samples/chart/circular_charts/chart_types/radial_bar/radial_bar_with_gradient.dart"
|
||||
},
|
||||
{
|
||||
"title": "Overfilled radial bar",
|
||||
"key": "overfilled_radialbar",
|
||||
"status": "New",
|
||||
"codeLink": "https://github.com/syncfusion/flutter-examples/blob/master/lib/samples/chart/circular_charts/chart_types/radial_bar/overfilled_radial_bar.dart"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1605,6 +1642,7 @@
|
|||
{
|
||||
"title": "Legend with various options",
|
||||
"key": "legend_with_various_options",
|
||||
"status": "Updated",
|
||||
"codeLink": "https://github.com/syncfusion/flutter-examples/blob/master/lib/samples/chart/circular_charts/legend/legend_with_various_options.dart",
|
||||
"needsPropertyPanel": true
|
||||
}
|
||||
|
|
@ -1625,7 +1663,8 @@
|
|||
{
|
||||
"title": "Selection",
|
||||
"key": "circular_selection",
|
||||
"description": "This sample depicts the selection feature in the chart. Tap the data point to select or unselect in mobile and web click the data points.",
|
||||
"status": "Updated",
|
||||
"description": "This sample depicts the selection feature in the chart. In mobile, tap the data points and on web/desktop click the data points to select or deselect them.",
|
||||
"codeLink": "https://github.com/syncfusion/flutter-examples/blob/master/lib/samples/chart/circular_charts/user_interactions/selection.dart",
|
||||
"needsPropertyPanel": true
|
||||
},
|
||||
|
|
@ -1642,13 +1681,23 @@
|
|||
"type": "child",
|
||||
"title": "Exporting",
|
||||
"displayType": "tab",
|
||||
"showInWeb": false,
|
||||
"platformsToHide": [
|
||||
"linux",
|
||||
"macOS",
|
||||
"windows",
|
||||
"web"
|
||||
],
|
||||
"subItems": [
|
||||
{
|
||||
"title": "Export",
|
||||
"key": "export_circular_chart",
|
||||
"codeLink": "https://github.com/syncfusion/flutter-examples/blob/master/lib/samples/chart/circular_charts/export.dart",
|
||||
"showInWeb": false
|
||||
"platformsToHide": [
|
||||
"linux",
|
||||
"macOS",
|
||||
"windows",
|
||||
"web"
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1658,14 +1707,22 @@
|
|||
"title": "Radial Gauge",
|
||||
"description": "Visualize one or multiple measures on a circular scale with pointers and ranges",
|
||||
"image": "images/circle_gauge.png",
|
||||
"status": "Updated",
|
||||
"controlId": 4,
|
||||
"status": "Updated",
|
||||
"subItems": [
|
||||
{
|
||||
"type": "child",
|
||||
"title": "Showcase",
|
||||
"displayType": "card",
|
||||
"subItems": [
|
||||
{
|
||||
"type": "sample",
|
||||
"title": "Sleep tracker",
|
||||
"key": "sleep_tracker",
|
||||
"status": "New",
|
||||
"codeLink": "https://github.com/syncfusion/flutter-examples/tree/master/lib/samples/gauge/showcase/sleep_tracker.dart",
|
||||
"description": ""
|
||||
},
|
||||
{
|
||||
"type": "sample",
|
||||
"title": "Gauge compass",
|
||||
|
|
@ -1775,7 +1832,6 @@
|
|||
"type": "sample",
|
||||
"title": "Marker pointer",
|
||||
"key": "radial_marker",
|
||||
"status": "Updated",
|
||||
"codeLink": "https://github.com/syncfusion/flutter-examples/blob/master/lib/samples/gauge/pointers/marker_pointer.dart",
|
||||
"description": "",
|
||||
"needsPropertyPanel": true
|
||||
|
|
@ -1791,7 +1847,6 @@
|
|||
"type": "sample",
|
||||
"title": "Widget pointer",
|
||||
"key": "radial_widget_pointer",
|
||||
"status": "new",
|
||||
"codeLink": "https://github.com/syncfusion/flutter-examples/blob/master/lib/samples/gauge/pointers/widget_pointer.dart",
|
||||
"description": "This sample demonstrates how to use a custom widget as a pointer using the 'WidgetPointer'."
|
||||
}
|
||||
|
|
@ -1862,7 +1917,6 @@
|
|||
"type": "sample",
|
||||
"title": "Pointer drag",
|
||||
"key": "radial_slider",
|
||||
"status": "updated",
|
||||
"codeLink": "https://github.com/syncfusion/flutter-examples/blob/master/lib/samples/gauge/pointer_interaction/radial_range_slider.dart",
|
||||
"description": "",
|
||||
"needsPropertyPanel": true
|
||||
|
|
@ -1936,13 +1990,23 @@
|
|||
"type": "child",
|
||||
"title": "Exporting",
|
||||
"displayType": "tab",
|
||||
"showInWeb": false,
|
||||
"platformsToHide": [
|
||||
"linux",
|
||||
"macOS",
|
||||
"windows",
|
||||
"web"
|
||||
],
|
||||
"subItems": [
|
||||
{
|
||||
"type": "sample",
|
||||
"title": "Export",
|
||||
"key": "export_gauge",
|
||||
"showInWeb": false,
|
||||
"platformsToHide": [
|
||||
"linux",
|
||||
"macOS",
|
||||
"windows",
|
||||
"web"
|
||||
],
|
||||
"codeLink": "https://github.com/syncfusion/flutter-examples/blob/master/lib/samples/gauge/export/export.dart"
|
||||
}
|
||||
]
|
||||
|
|
@ -1951,7 +2015,6 @@
|
|||
},
|
||||
{
|
||||
"title": "Linear Gauge",
|
||||
"status": "New",
|
||||
"description": "Visualize one or multiple measures on a linear scale with pointers and ranges",
|
||||
"image": "images/linear_gauge.png",
|
||||
"controlId": 5,
|
||||
|
|
@ -2124,7 +2187,6 @@
|
|||
"title": "Funnel Chart",
|
||||
"description": "Visualize the sequential data using funnel chart",
|
||||
"image": "images/funnel.png",
|
||||
"status": "",
|
||||
"displayType": "card",
|
||||
"controlId": 7,
|
||||
"subItems": [
|
||||
|
|
@ -2151,7 +2213,6 @@
|
|||
"title": "Pyramid Chart",
|
||||
"description": "Visualize the organized data using pyramid chart",
|
||||
"image": "images/pyramid.png",
|
||||
"status": "",
|
||||
"displayType": "card",
|
||||
"controlId": 6,
|
||||
"subItems": [
|
||||
|
|
@ -2181,14 +2242,15 @@
|
|||
"description": "Easily visualize data over a geographical area",
|
||||
"image": "images/map.png",
|
||||
"displayType": "tab",
|
||||
"status": "Updated",
|
||||
"controlId": 3,
|
||||
"isBeta": true,
|
||||
"status": "Updated",
|
||||
"subItems": [
|
||||
{
|
||||
"type": "child",
|
||||
"title": "Shape Layer",
|
||||
"displayType": "tab",
|
||||
"status": "Updated",
|
||||
"subItems": [
|
||||
{
|
||||
"type": "sample",
|
||||
|
|
@ -2208,12 +2270,6 @@
|
|||
"key": "bubble",
|
||||
"codeLink": "https://github.com/syncfusion/flutter-examples/tree/master/lib/samples/maps/shape_layer/bubble/bubble.dart"
|
||||
},
|
||||
{
|
||||
"type": "sample",
|
||||
"title": "Selection",
|
||||
"key": "selection",
|
||||
"codeLink": "https://github.com/syncfusion/flutter-examples/tree/master/lib/samples/maps/shape_layer/selection/selection.dart"
|
||||
},
|
||||
{
|
||||
"type": "sample",
|
||||
"title": "Marker",
|
||||
|
|
@ -2224,6 +2280,7 @@
|
|||
"type": "sample",
|
||||
"title": "Legend",
|
||||
"key": "legend",
|
||||
"status": "Updated",
|
||||
"codeLink": "https://github.com/syncfusion/flutter-examples/tree/master/lib/samples/maps/shape_layer/legend/legend.dart",
|
||||
"needsPropertyPanel": true
|
||||
},
|
||||
|
|
@ -2233,11 +2290,16 @@
|
|||
"key": "tooltip",
|
||||
"codeLink": "https://github.com/syncfusion/flutter-examples/tree/master/lib/samples/maps/shape_layer/tooltip/tooltip.dart"
|
||||
},
|
||||
{
|
||||
"type": "sample",
|
||||
"title": "Selection",
|
||||
"key": "selection",
|
||||
"codeLink": "https://github.com/syncfusion/flutter-examples/tree/master/lib/samples/maps/shape_layer/selection/selection.dart"
|
||||
},
|
||||
{
|
||||
"type": "sample",
|
||||
"title": "Zooming",
|
||||
"key": "zooming",
|
||||
"status": "Updated",
|
||||
"codeLink": "https://github.com/syncfusion/flutter-examples/tree/master/lib/samples/maps/shape_layer/zooming/zooming.dart"
|
||||
},
|
||||
{
|
||||
|
|
@ -2258,7 +2320,6 @@
|
|||
"type": "sample",
|
||||
"title": "OpenStreetMap",
|
||||
"key": "open_street_map",
|
||||
"status": "Updated",
|
||||
"codeLink": "https://github.com/syncfusion/flutter-examples/tree/master/lib/samples/maps/tile_layer/open_street_map/open_street_map.dart"
|
||||
},
|
||||
{
|
||||
|
|
@ -2285,7 +2346,6 @@
|
|||
{
|
||||
"type": "sample",
|
||||
"title": "Polygon",
|
||||
"status": "New",
|
||||
"key": "polygon",
|
||||
"description": "This sample demonstrates how the default and inverted polygons can be used to denote a particular area",
|
||||
"codeLink": "https://github.com/syncfusion/flutter-examples/tree/master/lib/samples/maps/tile_layer/vector_layer/polygon.dart"
|
||||
|
|
@ -2344,7 +2404,6 @@
|
|||
"description": "Light-weight line, area, column and win-loss charts which fits in a very small area.",
|
||||
"image": "images/sparkline_winloss.png",
|
||||
"displayType": "tab",
|
||||
"isBeta":true,
|
||||
"controlId": 9,
|
||||
"subItems": [
|
||||
{
|
||||
|
|
@ -2453,6 +2512,20 @@
|
|||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"type": "child",
|
||||
"title": "Editing",
|
||||
"subItems": [
|
||||
{
|
||||
"type": "sample",
|
||||
"title": "Editing",
|
||||
"key": "editing_datagrid",
|
||||
"status": "New",
|
||||
"needsPropertyPanel": true,
|
||||
"codeLink": "https://github.com/syncfusion/flutter-examples/blob/master/lib/samples/datagrid/editing/datagrid_editing.dart"
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"type": "child",
|
||||
"title": "Sorting",
|
||||
|
|
@ -2487,7 +2560,6 @@
|
|||
{
|
||||
"type": "sample",
|
||||
"title": "Freeze Panes",
|
||||
"status": "Updated",
|
||||
"key": "freeze_panes_datagrid",
|
||||
"codeLink": "https://github.com/syncfusion/flutter-examples/blob/master/lib/samples/datagrid/freeze_panes/datagrid_freeze_panes.dart"
|
||||
}
|
||||
|
|
@ -2512,7 +2584,6 @@
|
|||
{
|
||||
"type": "sample",
|
||||
"title": "Styling",
|
||||
"status": "Updated",
|
||||
"key": "styling_datagrid",
|
||||
"codeLink": "https://github.com/syncfusion/flutter-examples/blob/master/lib/samples/datagrid/apperance/styling/datagrid_styling.dart",
|
||||
"needsPropertyPanel": true
|
||||
|
|
@ -2551,7 +2622,6 @@
|
|||
"type": "sample",
|
||||
"title": "Pull To Refresh",
|
||||
"key": "pull_to_refresh_datagrid",
|
||||
"status": "New",
|
||||
"codeLink": "https://github.com/syncfusion/flutter-examples/blob/master/lib/samples/datagrid/pull_to_refresh/datagrid_pull_to_refresh.dart"
|
||||
}
|
||||
]
|
||||
|
|
@ -2575,7 +2645,6 @@
|
|||
{
|
||||
"type": "sample",
|
||||
"title": "Swiping",
|
||||
"status": "New",
|
||||
"key": "swiping_datagrid",
|
||||
"codeLink": "https://github.com/syncfusion/flutter-examples/blob/master/lib/samples/datagrid/swiping/datagrid_swiping.dart"
|
||||
}
|
||||
|
|
@ -2646,7 +2715,6 @@
|
|||
"type": "sample",
|
||||
"title": "Load More",
|
||||
"key": "loadmore_calendar",
|
||||
"status": "New",
|
||||
"codeLink": "https://github.com/syncfusion/flutter-examples/tree/master/lib/samples/calendar/calendar_loadmore.dart"
|
||||
},
|
||||
{
|
||||
|
|
@ -2691,9 +2759,9 @@
|
|||
"title": "Date Range Picker",
|
||||
"description": "Allows to easily select dates or range of dates",
|
||||
"image": "images/Date_range_picker.png",
|
||||
"status": "Updated",
|
||||
"displayType": "tab",
|
||||
"controlId": 2,
|
||||
"isBeta": true,
|
||||
"subItems": [
|
||||
{
|
||||
"type": "sample",
|
||||
|
|
@ -2706,6 +2774,7 @@
|
|||
{
|
||||
"type": "sample",
|
||||
"title": "Hijri Calendar",
|
||||
"status": "Updated",
|
||||
"key": "hijri_calendar_date_picker",
|
||||
"codeLink": "https://github.com/syncfusion/flutter-examples/tree/master/lib/samples/date_picker/hijri_calendar.dart",
|
||||
"needsPropertyPanel": true
|
||||
|
|
@ -2732,7 +2801,6 @@
|
|||
"type": "sample",
|
||||
"title": "Vertical Calendar",
|
||||
"key": "vertical_calendar",
|
||||
"status": "Updated",
|
||||
"codeLink": "https://github.com/syncfusion/flutter-examples/tree/master/lib/samples/date_picker/vertical_calendar.dart",
|
||||
"needsPropertyPanel": true
|
||||
}
|
||||
|
|
@ -2744,6 +2812,10 @@
|
|||
"categoryName": "Viewer",
|
||||
"mobileCategoryId": 4,
|
||||
"webCategoryId": 4,
|
||||
"platformsToHide": [
|
||||
"linux",
|
||||
"windows"
|
||||
],
|
||||
"controlList": [
|
||||
{
|
||||
"title": "PDF Viewer",
|
||||
|
|
@ -2752,20 +2824,17 @@
|
|||
"displayType": "tab",
|
||||
"isBeta": true,
|
||||
"controlId": 1,
|
||||
"status": "Updated",
|
||||
"subItems": [
|
||||
{
|
||||
"type": "sample",
|
||||
"title": "Getting Started",
|
||||
"key": "pdf_viewer_getting_started",
|
||||
"status": "Updated",
|
||||
"codeLink": "https://github.com/syncfusion/flutter-examples/blob/master/lib/samples/pdf_viewer/pdf_viewer_getting_started.dart"
|
||||
},
|
||||
{
|
||||
"type": "sample",
|
||||
"title": "Custom Toolbar",
|
||||
"key": "pdf_viewer_custom_toolbar",
|
||||
"status": "Updated",
|
||||
"codeLink": "https://github.com/syncfusion/flutter-examples/blob/master/lib/samples/pdf_viewer/pdf_viewer_custom_toolbar.dart"
|
||||
}
|
||||
]
|
||||
|
|
@ -2784,6 +2853,7 @@
|
|||
"displayType": "tab",
|
||||
"isBeta": true,
|
||||
"controlId": 1,
|
||||
"status": "Updated",
|
||||
"subItems": [
|
||||
{
|
||||
"type": "sample",
|
||||
|
|
@ -2811,15 +2881,9 @@
|
|||
},
|
||||
{
|
||||
"type": "sample",
|
||||
"title": "Text Extraction",
|
||||
"key": "text_extraction",
|
||||
"codeLink": "https://github.com/syncfusion/flutter-examples/blob/master/lib/samples/pdf/text_extraction.dart"
|
||||
},
|
||||
{
|
||||
"type": "sample",
|
||||
"title": "Find Text",
|
||||
"key": "find_text",
|
||||
"codeLink": "https://github.com/syncfusion/flutter-examples/blob/master/lib/samples/pdf/find_text.dart"
|
||||
"title": "Digital Signature",
|
||||
"key": "digital_signature",
|
||||
"codeLink": "https://github.com/syncfusion/flutter-examples/blob/master/lib/samples/pdf/digital_signature.dart"
|
||||
},
|
||||
{
|
||||
"type": "sample",
|
||||
|
|
@ -2827,6 +2891,19 @@
|
|||
"key": "encryption",
|
||||
"codeLink": "https://github.com/syncfusion/flutter-examples/blob/master/lib/samples/pdf/encryption.dart"
|
||||
},
|
||||
{
|
||||
"type": "sample",
|
||||
"title": "Form Filling",
|
||||
"key": "form",
|
||||
"codeLink": "https://github.com/syncfusion/flutter-examples/blob/master/lib/samples/pdf/form.dart"
|
||||
},
|
||||
{
|
||||
"type": "sample",
|
||||
"title": "Import and Export Form Data",
|
||||
"status": "New",
|
||||
"key": "import_and_export_form_data",
|
||||
"codeLink": "https://github.com/syncfusion/flutter-examples/blob/master/lib/samples/pdf/import_and_export_form_data.dart"
|
||||
},
|
||||
{
|
||||
"type": "sample",
|
||||
"title": "Conformance",
|
||||
|
|
@ -2835,17 +2912,15 @@
|
|||
},
|
||||
{
|
||||
"type": "sample",
|
||||
"title": "Form Filling",
|
||||
"key": "form",
|
||||
"status": "New",
|
||||
"codeLink": "https://github.com/syncfusion/flutter-examples/blob/master/lib/samples/pdf/form.dart"
|
||||
"title": "Text Extraction",
|
||||
"key": "text_extraction",
|
||||
"codeLink": "https://github.com/syncfusion/flutter-examples/blob/master/lib/samples/pdf/text_extraction.dart"
|
||||
},
|
||||
{
|
||||
"type": "sample",
|
||||
"title": "Digital Signature",
|
||||
"key": "digital_signature",
|
||||
"status": "New",
|
||||
"codeLink": "https://github.com/syncfusion/flutter-examples/blob/master/lib/samples/pdf/digital_signature.dart"
|
||||
"title": "Find Text",
|
||||
"key": "find_text",
|
||||
"codeLink": "https://github.com/syncfusion/flutter-examples/blob/master/lib/samples/pdf/find_text.dart"
|
||||
}
|
||||
]
|
||||
},
|
||||
|
|
@ -2856,6 +2931,7 @@
|
|||
"displayType": "tab",
|
||||
"isBeta": true,
|
||||
"controlId": 2,
|
||||
"status": "Updated",
|
||||
"subItems": [
|
||||
{
|
||||
"type": "sample",
|
||||
|
|
@ -2885,9 +2961,9 @@
|
|||
"type": "sample",
|
||||
"title": "Attendance Tracker",
|
||||
"key": "attendance_tracker",
|
||||
"status": "New",
|
||||
"status": "Updated",
|
||||
"codeLink": "https://github.com/syncfusion/flutter-examples/blob/master/lib/samples/xlsio/attendance_tracker/attendance_tracker.dart"
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
|
|
@ -2919,9 +2995,9 @@
|
|||
},
|
||||
{
|
||||
"type": "sample",
|
||||
"title": "Divisors, labels, and ticks",
|
||||
"key": "slider_divisor_label_tick",
|
||||
"codeLink": "https://github.com/syncfusion/flutter-examples/tree/master/lib/samples/sliders/slider/basic_features/slider_divisor_label_tick.dart",
|
||||
"title": "Dividers, labels, and ticks",
|
||||
"key": "slider_divider_label_tick",
|
||||
"codeLink": "https://github.com/syncfusion/flutter-examples/tree/master/lib/samples/sliders/slider/basic_features/slider_divider_label_tick.dart",
|
||||
"description": ""
|
||||
},
|
||||
{
|
||||
|
|
@ -2949,7 +3025,6 @@
|
|||
},
|
||||
{
|
||||
"type": "child",
|
||||
"status": "New",
|
||||
"title": "Customization",
|
||||
"displayType": "tab",
|
||||
"subItems": [
|
||||
|
|
@ -3001,9 +3076,9 @@
|
|||
},
|
||||
{
|
||||
"type": "sample",
|
||||
"title": "Divisors, labels, and ticks",
|
||||
"key": "range_slider_divisor_label_tick",
|
||||
"codeLink": "https://github.com/syncfusion/flutter-examples/blob/master/lib/samples/sliders/range_slider/default_appearance/range_slider_divisor_label_tick.dart",
|
||||
"title": "Dividers, labels, and ticks",
|
||||
"key": "range_slider_divider_label_tick",
|
||||
"codeLink": "https://github.com/syncfusion/flutter-examples/blob/master/lib/samples/sliders/range_slider/default_appearance/range_slider_divider_label_tick.dart",
|
||||
"description": ""
|
||||
},
|
||||
{
|
||||
|
|
@ -3074,13 +3149,11 @@
|
|||
"description": "The vertical slider enables you to select a date or a numeric value",
|
||||
"image": "images/vertical_slider.png",
|
||||
"displayType": "tab",
|
||||
"status": "New",
|
||||
"controlId": 3,
|
||||
"subItems": [
|
||||
{
|
||||
"type": "child",
|
||||
"title": "Basic features",
|
||||
"status": "New",
|
||||
"displayType": "tab",
|
||||
"subItems": [
|
||||
{
|
||||
|
|
@ -3092,9 +3165,9 @@
|
|||
},
|
||||
{
|
||||
"type": "sample",
|
||||
"title": "Divisors, labels, and ticks",
|
||||
"key": "vertical_slider_divisor_label_tick",
|
||||
"codeLink": "https://github.com/syncfusion/flutter-examples/tree/master/lib/samples/sliders/vertical_slider/basic_features/vertical_slider_divisor_label_tick.dart",
|
||||
"title": "Dividers, labels, and ticks",
|
||||
"key": "vertical_slider_divider_label_tick",
|
||||
"codeLink": "https://github.com/syncfusion/flutter-examples/tree/master/lib/samples/sliders/vertical_slider/basic_features/vertical_slider_divider_label_tick.dart",
|
||||
"description": ""
|
||||
},
|
||||
{
|
||||
|
|
@ -3122,7 +3195,6 @@
|
|||
},
|
||||
{
|
||||
"type": "child",
|
||||
"status": "New",
|
||||
"title": "Customization",
|
||||
"displayType": "tab",
|
||||
"subItems": [
|
||||
|
|
@ -3159,7 +3231,6 @@
|
|||
"description": "The vertical range slider enables you to select a date or a numeric range",
|
||||
"image": "images/vertical_range_slider.png",
|
||||
"displayType": "tab",
|
||||
"status": "New",
|
||||
"controlId": 4,
|
||||
"subItems": [
|
||||
{
|
||||
|
|
@ -3177,9 +3248,9 @@
|
|||
},
|
||||
{
|
||||
"type": "sample",
|
||||
"title": "Divisors, labels, and ticks",
|
||||
"key": "vertical_range_slider_divisor_label_tick",
|
||||
"codeLink": "https://github.com/syncfusion/flutter-examples/tree/master/lib/samples/sliders/vertical_range_slider/default_appearance/vertical_range_slider_divisor_label_tick.dart",
|
||||
"title": "Dividers, labels, and ticks",
|
||||
"key": "vertical_range_slider_divider_label_tick",
|
||||
"codeLink": "https://github.com/syncfusion/flutter-examples/tree/master/lib/samples/sliders/vertical_range_slider/default_appearance/vertical_range_slider_divider_label_tick.dart",
|
||||
"description": ""
|
||||
},
|
||||
{
|
||||
|
|
@ -3214,7 +3285,6 @@
|
|||
},
|
||||
{
|
||||
"type": "child",
|
||||
"status": "New",
|
||||
"title": "Customization",
|
||||
"displayType": "tab",
|
||||
"subItems": [
|
||||
|
|
@ -3252,7 +3322,6 @@
|
|||
"image": "images/range_selector.png",
|
||||
"displayType": "tab",
|
||||
"controlId": 5,
|
||||
"isBeta": true,
|
||||
"subItems": [
|
||||
{
|
||||
"type": "sample",
|
||||
|
|
@ -3369,6 +3438,7 @@
|
|||
"image": "images/radial_range_slider.png",
|
||||
"category": "Sliders",
|
||||
"displayType": "tab",
|
||||
"status": "Updated",
|
||||
"controlId": 7,
|
||||
"subItems": [
|
||||
{
|
||||
|
|
@ -3389,6 +3459,7 @@
|
|||
"type": "sample",
|
||||
"title": "Labels and Ticks",
|
||||
"key": "radial_range_slider_ticks_and_labels",
|
||||
"status": "Updated",
|
||||
"codeLink": "https://github.com/syncfusion/flutter-examples/tree/master/lib/samples/radial_range_slider/basic_features/labels_and_ticks.dart",
|
||||
"description": ""
|
||||
},
|
||||
|
|
@ -3451,7 +3522,6 @@
|
|||
"description": "Captures the signature and save it as an image to sync across devices and documents",
|
||||
"image": "images/SignaturePad.png",
|
||||
"displayType": "tab",
|
||||
"isBeta": true,
|
||||
"controlId": 1,
|
||||
"subItems": [
|
||||
{
|
||||
|
|
@ -3465,4 +3535,4 @@
|
|||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
]
|
||||
|
|
|
|||
|
|
@ -19,6 +19,7 @@ import 'samples/chart/cartesian_charts/axis_features/axis_animation.dart';
|
|||
import 'samples/chart/cartesian_charts/axis_features/axis_crossing.dart';
|
||||
import 'samples/chart/cartesian_charts/axis_features/edge_label_placement.dart';
|
||||
import 'samples/chart/cartesian_charts/axis_features/handling_label_collision.dart';
|
||||
import 'samples/chart/cartesian_charts/axis_features/interval_type.dart';
|
||||
import 'samples/chart/cartesian_charts/axis_features/maximum_width_for_labels.dart';
|
||||
import 'samples/chart/cartesian_charts/axis_features/multiple_axis_chart.dart';
|
||||
import 'samples/chart/cartesian_charts/axis_features/opposed_axes.dart';
|
||||
|
|
@ -139,6 +140,7 @@ import 'samples/chart/cartesian_charts/trendline/trendline_forecast.dart';
|
|||
import 'samples/chart/cartesian_charts/user_interactions/add_point_on_click.dart';
|
||||
import 'samples/chart/cartesian_charts/user_interactions/auto_scrolling.dart';
|
||||
import 'samples/chart/cartesian_charts/user_interactions/crosshair.dart';
|
||||
import 'samples/chart/cartesian_charts/user_interactions/events/data_point_events.dart';
|
||||
import 'samples/chart/cartesian_charts/user_interactions/events/events.dart';
|
||||
import 'samples/chart/cartesian_charts/user_interactions/events/navigation_with_events.dart';
|
||||
import 'samples/chart/cartesian_charts/user_interactions/pagination.dart';
|
||||
|
|
@ -168,10 +170,12 @@ import 'samples/chart/circular_charts/chart_types/pie/point_render_mode.dart';
|
|||
import 'samples/chart/circular_charts/chart_types/pie/semi_pie_chart.dart';
|
||||
import 'samples/chart/circular_charts/chart_types/radial_bar/customized_radial_bar_chart.dart';
|
||||
import 'samples/chart/circular_charts/chart_types/radial_bar/default_radial_bar_chart.dart';
|
||||
import 'samples/chart/circular_charts/chart_types/radial_bar/overfilled_radial_bar.dart';
|
||||
import 'samples/chart/circular_charts/chart_types/radial_bar/radial_bar_with_gradient.dart';
|
||||
import 'samples/chart/circular_charts/chart_types/radial_bar/radial_bar_with_legend.dart';
|
||||
import 'samples/chart/circular_charts/export.dart';
|
||||
import 'samples/chart/circular_charts/legend/chart_with_legend.dart';
|
||||
import 'samples/chart/circular_charts/legend/floating_legend.dart';
|
||||
import 'samples/chart/circular_charts/legend/legend_with_various_options.dart';
|
||||
import 'samples/chart/circular_charts/user_interactions/dynamic_selection.dart';
|
||||
import 'samples/chart/circular_charts/user_interactions/selection.dart';
|
||||
|
|
@ -189,6 +193,7 @@ import 'samples/datagrid/columns/datagrid_custom_header.dart';
|
|||
import 'samples/datagrid/columns/datagrid_stacked_header.dart';
|
||||
import 'samples/datagrid/data_source/datagrid_json_data_source.dart';
|
||||
import 'samples/datagrid/data_source/datagrid_list_data_source.dart';
|
||||
import 'samples/datagrid/editing/datagrid_editing.dart';
|
||||
import 'samples/datagrid/freeze_panes/datagrid_freeze_panes.dart';
|
||||
import 'samples/datagrid/getting_started/datagrid_getting_started.dart';
|
||||
import 'samples/datagrid/loadmore/datagrid_infinite_scrolling.dart';
|
||||
|
|
@ -237,6 +242,7 @@ import 'samples/gauge/ranges/range_thickness.dart';
|
|||
import 'samples/gauge/showcase/clock_sample.dart';
|
||||
import 'samples/gauge/showcase/distance_tracker.dart';
|
||||
import 'samples/gauge/showcase/gauge_compass.dart';
|
||||
import 'samples/gauge/showcase/sleep_tracker.dart';
|
||||
import 'samples/gauge/showcase/temperature_monitor.dart';
|
||||
import 'samples/linear_gauge/api/api_customization.dart';
|
||||
import 'samples/linear_gauge/axis/axis_track.dart';
|
||||
|
|
@ -278,6 +284,7 @@ import 'samples/pdf/encryption.dart';
|
|||
import 'samples/pdf/find_text.dart';
|
||||
import 'samples/pdf/form.dart';
|
||||
import 'samples/pdf/header_and_footer.dart';
|
||||
import 'samples/pdf/import_and_export_form_data.dart';
|
||||
import 'samples/pdf/invoice.dart';
|
||||
import 'samples/pdf/text_extraction.dart';
|
||||
import 'samples/pdf_viewer/pdf_viewer_custom_toolbar.dart';
|
||||
|
|
@ -314,13 +321,13 @@ import 'samples/sliders/range_slider/customization/size_customization/size_custo
|
|||
import 'samples/sliders/range_slider/customization/thumb_customization/range_slider_thumb_icon_customization.dart';
|
||||
import 'samples/sliders/range_slider/default_appearance/range_slider_date_time_label.dart';
|
||||
import 'samples/sliders/range_slider/default_appearance/range_slider_default_appearance.dart';
|
||||
import 'samples/sliders/range_slider/default_appearance/range_slider_divisor_label_tick.dart';
|
||||
import 'samples/sliders/range_slider/default_appearance/range_slider_divider_label_tick.dart';
|
||||
import 'samples/sliders/range_slider/default_appearance/range_slider_interval_selection.dart';
|
||||
import 'samples/sliders/range_slider/default_appearance/range_slider_step.dart';
|
||||
import 'samples/sliders/range_slider/default_appearance/range_slider_tooltip_type.dart';
|
||||
import 'samples/sliders/slider/basic_features/default_slider.dart';
|
||||
import 'samples/sliders/slider/basic_features/slider_date_interval.dart';
|
||||
import 'samples/sliders/slider/basic_features/slider_divisor_label_tick.dart';
|
||||
import 'samples/sliders/slider/basic_features/slider_divider_label_tick.dart';
|
||||
import 'samples/sliders/slider/basic_features/slider_step.dart';
|
||||
import 'samples/sliders/slider/basic_features/slider_tooltip_type.dart';
|
||||
import 'samples/sliders/slider/customization/color_customization/slider_color_customization.dart';
|
||||
|
|
@ -333,13 +340,13 @@ import 'samples/sliders/vertical_range_slider/customization/size_customization/v
|
|||
import 'samples/sliders/vertical_range_slider/customization/thumb_customization/vertical_range_slider_thumb_icon_customization.dart';
|
||||
import 'samples/sliders/vertical_range_slider/default_appearance/vertical_range_slider_date_time_label.dart';
|
||||
import 'samples/sliders/vertical_range_slider/default_appearance/vertical_range_slider_default_appearance.dart';
|
||||
import 'samples/sliders/vertical_range_slider/default_appearance/vertical_range_slider_divisor_label_tick.dart';
|
||||
import 'samples/sliders/vertical_range_slider/default_appearance/vertical_range_slider_divider_label_tick.dart';
|
||||
import 'samples/sliders/vertical_range_slider/default_appearance/vertical_range_slider_interval_selection.dart';
|
||||
import 'samples/sliders/vertical_range_slider/default_appearance/vertical_range_slider_step.dart';
|
||||
import 'samples/sliders/vertical_range_slider/default_appearance/vertical_range_slider_tooltip_position.dart';
|
||||
import 'samples/sliders/vertical_slider/basic_features/default_vertical_slider.dart';
|
||||
import 'samples/sliders/vertical_slider/basic_features/vertical_slider_date_interval.dart';
|
||||
import 'samples/sliders/vertical_slider/basic_features/vertical_slider_divisor_label_tick.dart';
|
||||
import 'samples/sliders/vertical_slider/basic_features/vertical_slider_divider_label_tick.dart';
|
||||
import 'samples/sliders/vertical_slider/basic_features/vertical_slider_step.dart';
|
||||
import 'samples/sliders/vertical_slider/basic_features/vertical_slider_tooltip_position.dart';
|
||||
import 'samples/sliders/vertical_slider/customization/color_customization/vertical_slider_color_customization.dart';
|
||||
|
|
@ -352,6 +359,7 @@ import 'samples/sparkline/customization.dart';
|
|||
import 'samples/sparkline/live_update.dart';
|
||||
import 'samples/sparkline/sparkline_in_grid.dart';
|
||||
import 'samples/treemap/custom_background/custom_background.dart';
|
||||
import 'samples/treemap/drilldown/drilldown.dart';
|
||||
import 'samples/treemap/flat/flat.dart';
|
||||
import 'samples/treemap/hierarchical/hierarchical.dart';
|
||||
import 'samples/treemap/range_color_mapping/range_color_mapping.dart';
|
||||
|
|
@ -449,6 +457,7 @@ Map<String, Function> getSampleWidget() {
|
|||
'axis_animation': (Key key) => AxisAnimationDefault(key),
|
||||
'edgelabel_placement': (Key key) => EdgeLabel(key),
|
||||
'chart_maximum_label_width': (Key key) => ChartMaximumLabelWidth(key),
|
||||
'interval_type': (Key key) => IntervalType(key),
|
||||
'handling_label_collision': (Key key) => LabelAction(key),
|
||||
'multiple_axis_chart': (Key key) => MultipleAxis(key),
|
||||
'opposed_axes': (Key key) => NumericOpposed(key),
|
||||
|
|
@ -478,6 +487,7 @@ Map<String, Function> getSampleWidget() {
|
|||
'legend_with_various_options': (Key key) => LegendOptions(key),
|
||||
'cartesian_legend_various_options': (Key key) =>
|
||||
CartesianLegendOptions(key),
|
||||
'circular_floating_legend': (Key key) => CircularFloatingLegend(key),
|
||||
|
||||
//Technical Indicators
|
||||
'accumulation_distribution': (Key key) => AdIndicator(key),
|
||||
|
|
@ -507,6 +517,7 @@ Map<String, Function> getSampleWidget() {
|
|||
'circular_dynamic_selection': (Key key) => DynamicCircularSelection(key),
|
||||
'pie_tooltip_position': (Key key) => PieTooltipPosition(key),
|
||||
'events': (Key key) => Events(key),
|
||||
'data_points': (Key key) => DataPoints(key),
|
||||
'navigate_with_events': (Key key) => NavigationWithEvents(key),
|
||||
'chart_interactivity': (Key key) => InteractiveChart(key),
|
||||
'pagination': (Key key) => Pagination(key),
|
||||
|
|
@ -553,6 +564,7 @@ Map<String, Function> getSampleWidget() {
|
|||
'default_radialbar_chart': (Key key) => RadialBarDefault(key),
|
||||
'radialbar_with_legend': (Key key) => RadialBarAngle(key),
|
||||
'radialbar_with_gradient': (Key key) => RadialBarGradient(key),
|
||||
'overfilled_radialbar': (Key key) => OverfilledRadialBar(key),
|
||||
|
||||
//Funnel
|
||||
'default_funnel_chart': (Key key) => FunnelDefault(key),
|
||||
|
|
@ -622,7 +634,7 @@ Map<String, Function> getSampleWidget() {
|
|||
'range_datalabels': (Key key) => RangeDataLabelExample(key),
|
||||
'range_thickness': (Key key) => RangeThicknessExample(key),
|
||||
'clock_sample': (Key key) => ClockExample(key),
|
||||
|
||||
'sleep_tracker': (Key key) => SleepTrackerSample(key),
|
||||
'distance_tracker': (Key key) => DistanceTrackerExample(key),
|
||||
'gauge_overview': (Key key) => GaugeTemperatureMonitorExample(key),
|
||||
'gauge_compass': (Key key) => GaugeCompassExample(key),
|
||||
|
|
@ -652,12 +664,13 @@ Map<String, Function> getSampleWidget() {
|
|||
'certificate': (Key key) => CourseCompletionCertificatePdf(key),
|
||||
'header_and_footer': (Key key) => HeaderAndFooterPdf(key),
|
||||
'annotations': (Key key) => AnnotationsPdf(key),
|
||||
'digital_signature': (Key key) => SignPdf(key),
|
||||
'encryption': (Key key) => EncryptPdf(key),
|
||||
'form': (Key key) => FormFillingPdf(key),
|
||||
'import_and_export_form_data': (Key key) => ImportAndExportFormData(key),
|
||||
'conformance': (Key key) => ConformancePdf(key),
|
||||
'text_extraction': (Key key) => TextExtractionPdf(key),
|
||||
'find_text': (Key key) => FindTextPdf(key),
|
||||
'encryption': (Key key) => EncryptPdf(key),
|
||||
'conformance': (Key key) => ConformancePdf(key),
|
||||
'form': (Key key) => FormFillingPdf(key),
|
||||
'digital_signature': (Key key) => SignPdf(key),
|
||||
|
||||
// PDF Viewer samples
|
||||
'pdf_viewer_getting_started': (Key key) => GettingStartedPdfViewer(key),
|
||||
|
|
@ -690,7 +703,7 @@ Map<String, Function> getSampleWidget() {
|
|||
|
||||
'slider_size_customization': (Key key) => SliderSizeCustomizationPage(key),
|
||||
|
||||
'slider_divisor_label_tick': (Key key) => SliderLabelCustomizationPage(key),
|
||||
'slider_divider_label_tick': (Key key) => SliderLabelCustomizationPage(key),
|
||||
|
||||
'slider_color_customization': (Key key) =>
|
||||
SliderColorCustomizationPage(key),
|
||||
|
|
@ -700,7 +713,7 @@ Map<String, Function> getSampleWidget() {
|
|||
// Range Slider Samples
|
||||
'range_slider_default_appearance': (Key key) => DefaultRangeSliderPage(key),
|
||||
|
||||
'range_slider_divisor_label_tick': (Key key) => ScaleRangeSliderPage(key),
|
||||
'range_slider_divider_label_tick': (Key key) => ScaleRangeSliderPage(key),
|
||||
|
||||
'range_slider_date_time_label': (Key key) => DateRangeSliderPage(key),
|
||||
|
||||
|
|
@ -726,7 +739,7 @@ Map<String, Function> getSampleWidget() {
|
|||
'vertical_slider_date_interval': (Key key) =>
|
||||
VerticalDateIntervalSliderPage(key),
|
||||
|
||||
'vertical_slider_divisor_label_tick': (Key key) =>
|
||||
'vertical_slider_divider_label_tick': (Key key) =>
|
||||
VerticalSliderLabelCustomizationPage(key),
|
||||
|
||||
'vertical_slider_step': (Key key) => VerticalStepSliderPage(key),
|
||||
|
|
@ -751,7 +764,7 @@ Map<String, Function> getSampleWidget() {
|
|||
'vertical_range_slider_default_appearance': (Key key) =>
|
||||
VerticalDefaultRangeSliderPage(key),
|
||||
|
||||
'vertical_range_slider_divisor_label_tick': (Key key) =>
|
||||
'vertical_range_slider_divider_label_tick': (Key key) =>
|
||||
VerticalScaleRangeSliderPage(key),
|
||||
|
||||
'vertical_range_slider_date_time_label': (Key key) =>
|
||||
|
|
@ -798,6 +811,8 @@ Map<String, Function> getSampleWidget() {
|
|||
|
||||
'column_types_datagrid': (Key key) => ColumnTypeDataGrid(key: key),
|
||||
|
||||
'editing_datagrid': (Key key) => EditingDataGrid(key: key),
|
||||
|
||||
'custom_header_datagrid': (Key key) => CustomHeaderDataGrid(key: key),
|
||||
|
||||
'selection_datagrid': (Key key) => SelectionDataGrid(key: key),
|
||||
|
|
@ -911,5 +926,6 @@ Map<String, Function> getSampleWidget() {
|
|||
'squarified_treemap_custom_background': (Key key) =>
|
||||
TreemapCustomBackgroundSample(key),
|
||||
'squarified_treemap_selection': (Key key) => TreemapSelectionSample(key),
|
||||
'squarified_treemap_drilldown': (Key key) => TreemapDrilldownSample(key),
|
||||
};
|
||||
}
|
||||
|
|
|
|||
|
|
@ -71,6 +71,8 @@ class _DataMatrixGeneratorState extends SampleViewState {
|
|||
mainAxisAlignment: MainAxisAlignment.start,
|
||||
children: <Widget>[
|
||||
Text('Input value: ',
|
||||
overflow: TextOverflow.clip,
|
||||
softWrap: false,
|
||||
style: TextStyle(
|
||||
fontSize: 16.0,
|
||||
fontWeight: FontWeight.bold,
|
||||
|
|
@ -91,7 +93,7 @@ class _DataMatrixGeneratorState extends SampleViewState {
|
|||
BorderSide(color: model.textColor))),
|
||||
autofocus: false,
|
||||
keyboardType: TextInputType.text,
|
||||
maxLines: null,
|
||||
maxLines: 1,
|
||||
onChanged: (String _text) {
|
||||
setState(() {
|
||||
_inputValue = _text;
|
||||
|
|
|
|||
|
|
@ -19,16 +19,16 @@ class _QRCodeGeneratorState extends SampleViewState {
|
|||
_QRCodeGeneratorState();
|
||||
|
||||
final List<String> _encoding = <String>[
|
||||
'Numeric',
|
||||
'AlphaNumeric',
|
||||
'Binary',
|
||||
'numeric',
|
||||
'alphaNumeric',
|
||||
'binary',
|
||||
];
|
||||
|
||||
final List<String> _errorCorrectionLevels = <String>[
|
||||
'High',
|
||||
'Quartile',
|
||||
'Medium',
|
||||
'Low'
|
||||
'high',
|
||||
'quartile',
|
||||
'medium',
|
||||
'low'
|
||||
];
|
||||
|
||||
late ErrorCorrectionLevel _errorCorrectionLevel;
|
||||
|
|
@ -41,9 +41,9 @@ class _QRCodeGeneratorState extends SampleViewState {
|
|||
@override
|
||||
void initState() {
|
||||
super.initState();
|
||||
_selectedInputMode = 'Binary';
|
||||
_selectedInputMode = 'binary';
|
||||
_inputValue = 'http://www.syncfusion.com';
|
||||
_selectedErrorCorrectionLevel = 'Quartile';
|
||||
_selectedErrorCorrectionLevel = 'quartile';
|
||||
_errorCorrectionLevel = ErrorCorrectionLevel.quartile;
|
||||
_inputMode = QRInputMode.binary;
|
||||
_textEditingController = TextEditingController.fromValue(
|
||||
|
|
@ -99,6 +99,8 @@ class _QRCodeGeneratorState extends SampleViewState {
|
|||
mainAxisAlignment: MainAxisAlignment.start,
|
||||
children: <Widget>[
|
||||
Text('Input value: ',
|
||||
overflow: TextOverflow.clip,
|
||||
softWrap: false,
|
||||
style: TextStyle(
|
||||
fontSize: 16.0,
|
||||
fontWeight: FontWeight.bold,
|
||||
|
|
@ -119,7 +121,7 @@ class _QRCodeGeneratorState extends SampleViewState {
|
|||
color: model.textColor))),
|
||||
autofocus: false,
|
||||
keyboardType: TextInputType.text,
|
||||
maxLines: null,
|
||||
maxLines: 1,
|
||||
onChanged: (String _text) {
|
||||
setState(() {
|
||||
_inputValue = _text;
|
||||
|
|
@ -143,6 +145,8 @@ class _QRCodeGeneratorState extends SampleViewState {
|
|||
Expanded(
|
||||
child: Text(
|
||||
'Input mode:',
|
||||
overflow: TextOverflow.clip,
|
||||
softWrap: false,
|
||||
style: TextStyle(
|
||||
fontSize: 16.0,
|
||||
fontWeight: FontWeight.bold,
|
||||
|
|
@ -159,7 +163,7 @@ class _QRCodeGeneratorState extends SampleViewState {
|
|||
value: _selectedInputMode,
|
||||
items: _encoding.map((String value) {
|
||||
return DropdownMenuItem<String>(
|
||||
value: (value != null) ? value : 'Binary',
|
||||
value: (value != null) ? value : 'binary',
|
||||
child: Text(value,
|
||||
textAlign: TextAlign.center,
|
||||
style:
|
||||
|
|
@ -186,6 +190,8 @@ class _QRCodeGeneratorState extends SampleViewState {
|
|||
Expanded(
|
||||
child: Text(
|
||||
'Error level: ',
|
||||
overflow: TextOverflow.clip,
|
||||
softWrap: false,
|
||||
style: TextStyle(
|
||||
fontSize: 16.0,
|
||||
fontWeight: FontWeight.bold,
|
||||
|
|
@ -202,7 +208,7 @@ class _QRCodeGeneratorState extends SampleViewState {
|
|||
value: _selectedErrorCorrectionLevel,
|
||||
items: _errorCorrectionLevels.map((String value) {
|
||||
return DropdownMenuItem<String>(
|
||||
value: (value != null) ? value : 'Quartile',
|
||||
value: (value != null) ? value : 'quartile',
|
||||
child: Text(value,
|
||||
textAlign: TextAlign.center,
|
||||
style:
|
||||
|
|
@ -226,13 +232,13 @@ class _QRCodeGeneratorState extends SampleViewState {
|
|||
void _onInputModeChanged(String item) {
|
||||
_selectedInputMode = item;
|
||||
switch (_selectedInputMode) {
|
||||
case 'Numeric':
|
||||
case 'numeric':
|
||||
_inputMode = QRInputMode.numeric;
|
||||
break;
|
||||
case 'AlphaNumeric':
|
||||
case 'alphaNumeric':
|
||||
_inputMode = QRInputMode.alphaNumeric;
|
||||
break;
|
||||
case 'Binary':
|
||||
case 'binary':
|
||||
_inputMode = QRInputMode.binary;
|
||||
break;
|
||||
}
|
||||
|
|
@ -245,16 +251,16 @@ class _QRCodeGeneratorState extends SampleViewState {
|
|||
void _onErrorCorrectionLevelChanged(String item) {
|
||||
_selectedErrorCorrectionLevel = item;
|
||||
switch (_selectedErrorCorrectionLevel) {
|
||||
case 'High':
|
||||
case 'high':
|
||||
_errorCorrectionLevel = ErrorCorrectionLevel.high;
|
||||
break;
|
||||
case 'Quartile':
|
||||
case 'quartile':
|
||||
_errorCorrectionLevel = ErrorCorrectionLevel.quartile;
|
||||
break;
|
||||
case 'Medium':
|
||||
case 'medium':
|
||||
_errorCorrectionLevel = ErrorCorrectionLevel.medium;
|
||||
break;
|
||||
case 'Low':
|
||||
case 'low':
|
||||
_errorCorrectionLevel = ErrorCorrectionLevel.low;
|
||||
break;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -40,7 +40,7 @@ class _GettingStartedCalendarState extends SampleViewState {
|
|||
];
|
||||
|
||||
final List<String> _viewNavigationModeList =
|
||||
<String>['Snap', 'None'].toList();
|
||||
<String>['snap', 'none'].toList();
|
||||
|
||||
/// Global key used to maintain the state, when we change the parent of the
|
||||
/// widget
|
||||
|
|
@ -55,7 +55,8 @@ class _GettingStartedCalendarState extends SampleViewState {
|
|||
bool _showCurrentTimeIndicator = true;
|
||||
|
||||
ViewNavigationMode _viewNavigationMode = ViewNavigationMode.snap;
|
||||
String _viewNavigationModeString = 'Snap';
|
||||
String _viewNavigationModeString = 'snap';
|
||||
bool _showWeekNumber = false;
|
||||
|
||||
@override
|
||||
void initState() {
|
||||
|
|
@ -212,9 +213,9 @@ class _GettingStartedCalendarState extends SampleViewState {
|
|||
/// Allows/Restrict switching to previous/next views through swipe interaction
|
||||
void onViewNavigationModeChange(String value) {
|
||||
_viewNavigationModeString = value;
|
||||
if (value == 'Snap') {
|
||||
if (value == 'snap') {
|
||||
_viewNavigationMode = ViewNavigationMode.snap;
|
||||
} else if (value == 'None') {
|
||||
} else if (value == 'none') {
|
||||
_viewNavigationMode = ViewNavigationMode.none;
|
||||
}
|
||||
setState(() {
|
||||
|
|
@ -236,9 +237,9 @@ class _GettingStartedCalendarState extends SampleViewState {
|
|||
mainAxisSize: MainAxisSize.max,
|
||||
children: <Widget>[
|
||||
Text('Allow view navigation',
|
||||
softWrap: false,
|
||||
style: TextStyle(fontSize: 16.0, color: model.textColor)),
|
||||
Container(
|
||||
padding: const EdgeInsets.fromLTRB(0, 0, 0, 0),
|
||||
child: Theme(
|
||||
data: Theme.of(context).copyWith(
|
||||
canvasColor: model.bottomSheetBackgroundColor),
|
||||
|
|
@ -269,6 +270,7 @@ class _GettingStartedCalendarState extends SampleViewState {
|
|||
mainAxisSize: MainAxisSize.max,
|
||||
children: <Widget>[
|
||||
Text('Show date picker button',
|
||||
softWrap: false,
|
||||
style: TextStyle(fontSize: 16.0, color: model.textColor)),
|
||||
Container(
|
||||
padding: const EdgeInsets.all(0),
|
||||
|
|
@ -302,11 +304,14 @@ class _GettingStartedCalendarState extends SampleViewState {
|
|||
mainAxisSize: MainAxisSize.max,
|
||||
children: <Widget>[
|
||||
Expanded(
|
||||
child: Text('Show trailing and leading dates',
|
||||
child: Text(
|
||||
model.isWebFullView
|
||||
? 'Show trailing and leading \ndates'
|
||||
: 'Show trailing and leading dates',
|
||||
softWrap: false,
|
||||
style:
|
||||
TextStyle(fontSize: 16.0, color: model.textColor))),
|
||||
Container(
|
||||
padding: const EdgeInsets.fromLTRB(0, 0, 0, 0),
|
||||
child: Theme(
|
||||
data: Theme.of(context).copyWith(
|
||||
canvasColor: model.bottomSheetBackgroundColor),
|
||||
|
|
@ -338,11 +343,14 @@ class _GettingStartedCalendarState extends SampleViewState {
|
|||
mainAxisSize: MainAxisSize.max,
|
||||
children: <Widget>[
|
||||
Expanded(
|
||||
child: Text('Show current time indicator',
|
||||
child: Text(
|
||||
model.isWebFullView
|
||||
? 'Show current time \nindicator'
|
||||
: 'Show current time indicator',
|
||||
softWrap: false,
|
||||
style:
|
||||
TextStyle(fontSize: 16.0, color: model.textColor))),
|
||||
Container(
|
||||
padding: const EdgeInsets.fromLTRB(0, 0, 0, 0),
|
||||
child: Theme(
|
||||
data: Theme.of(context).copyWith(
|
||||
canvasColor: model.bottomSheetBackgroundColor),
|
||||
|
|
@ -367,18 +375,59 @@ class _GettingStartedCalendarState extends SampleViewState {
|
|||
],
|
||||
),
|
||||
),
|
||||
Container(
|
||||
child: Row(
|
||||
crossAxisAlignment: CrossAxisAlignment.center,
|
||||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||
mainAxisSize: MainAxisSize.max,
|
||||
children: <Widget>[
|
||||
Expanded(
|
||||
child: Text('Show week number',
|
||||
softWrap: false,
|
||||
style:
|
||||
TextStyle(fontSize: 16.0, color: model.textColor))),
|
||||
Container(
|
||||
child: Theme(
|
||||
data: Theme.of(context).copyWith(
|
||||
canvasColor: model.bottomSheetBackgroundColor),
|
||||
child: Container(
|
||||
child: Align(
|
||||
alignment: Alignment.centerLeft,
|
||||
child: Transform.scale(
|
||||
scale: 0.8,
|
||||
child: CupertinoSwitch(
|
||||
activeColor: model.backgroundColor,
|
||||
value: _showWeekNumber,
|
||||
onChanged: (bool value) {
|
||||
setState(() {
|
||||
_showWeekNumber = value;
|
||||
stateSetter(() {});
|
||||
});
|
||||
},
|
||||
)),
|
||||
),
|
||||
),
|
||||
),
|
||||
)
|
||||
],
|
||||
),
|
||||
),
|
||||
Container(
|
||||
child: Row(
|
||||
crossAxisAlignment: CrossAxisAlignment.center,
|
||||
mainAxisAlignment: MainAxisAlignment.start,
|
||||
children: <Widget>[
|
||||
Expanded(
|
||||
flex: 6,
|
||||
child: Text('View navigation mode',
|
||||
flex: model.isWebFullView ? 5 : 6,
|
||||
child: Text(
|
||||
model.isWebFullView
|
||||
? 'View navigation \nmode'
|
||||
: 'View navigation mode',
|
||||
softWrap: false,
|
||||
style:
|
||||
TextStyle(fontSize: 16.0, color: model.textColor))),
|
||||
Expanded(
|
||||
flex: 4,
|
||||
flex: model.isWebFullView ? 5 : 4,
|
||||
child: Container(
|
||||
padding: const EdgeInsets.only(left: 60),
|
||||
alignment: Alignment.bottomLeft,
|
||||
|
|
@ -438,6 +487,7 @@ class _GettingStartedCalendarState extends SampleViewState {
|
|||
timeSlotViewSettings: const TimeSlotViewSettings(
|
||||
minimumAppointmentDuration: Duration(minutes: 60)),
|
||||
viewNavigationMode: _viewNavigationMode,
|
||||
showWeekNumber: _showWeekNumber,
|
||||
);
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -80,7 +80,7 @@ class _AxisCrossingState extends SampleViewState {
|
|||
),
|
||||
Row(
|
||||
children: <Widget>[
|
||||
Text('Cross At ',
|
||||
Text('Cross at ',
|
||||
style: TextStyle(fontSize: 16.0, color: model.textColor)),
|
||||
Container(
|
||||
padding: const EdgeInsets.fromLTRB(85, 0, 0, 0),
|
||||
|
|
@ -100,7 +100,7 @@ class _AxisCrossingState extends SampleViewState {
|
|||
),
|
||||
Row(
|
||||
children: <Widget>[
|
||||
Text('Labels Near Axisline',
|
||||
Text('Labels near axis line',
|
||||
style: TextStyle(color: model.textColor, fontSize: 16)),
|
||||
Container(
|
||||
width: 75,
|
||||
|
|
|
|||
|
|
@ -132,7 +132,7 @@ class _LabelActionState extends SampleViewState {
|
|||
dataSource: chartData,
|
||||
xValueMapper: (ChartSampleData data, _) => data.x as String,
|
||||
yValueMapper: (ChartSampleData data, _) => data.y,
|
||||
dataLabelSettings: DataLabelSettings(
|
||||
dataLabelSettings: const DataLabelSettings(
|
||||
isVisible: true, labelAlignment: ChartDataLabelAlignment.top))
|
||||
];
|
||||
}
|
||||
|
|
|
|||
|
|
@ -0,0 +1,271 @@
|
|||
/// Dart imports
|
||||
import 'dart:math';
|
||||
import 'package:intl/intl.dart';
|
||||
|
||||
/// Package import
|
||||
import 'package:flutter/material.dart';
|
||||
|
||||
/// Chart import
|
||||
import 'package:syncfusion_flutter_charts/charts.dart';
|
||||
|
||||
/// Local imports
|
||||
import '../../../../model/sample_view.dart';
|
||||
|
||||
/// Renders the line chart with default data time axis sample.
|
||||
class IntervalType extends SampleView {
|
||||
/// Creates the line chart with default data time axis sample.
|
||||
const IntervalType(Key key) : super(key: key);
|
||||
|
||||
@override
|
||||
_IntervalTypeState createState() => _IntervalTypeState();
|
||||
}
|
||||
|
||||
/// State class of the line chart with default data time axis.
|
||||
class _IntervalTypeState extends SampleViewState {
|
||||
_IntervalTypeState();
|
||||
|
||||
final List<String> _intervalType = <String>[
|
||||
'years',
|
||||
'months',
|
||||
'days',
|
||||
'hours',
|
||||
'minutes',
|
||||
'seconds',
|
||||
'milliseconds'
|
||||
].toList();
|
||||
late String _selectedIntervalType;
|
||||
DateTimeIntervalType _chartIntervalType = DateTimeIntervalType.years;
|
||||
DateFormat _dateFormat = DateFormat.y();
|
||||
late List<ChartSampleData> chartData;
|
||||
|
||||
final List<ChartSampleData> year = <ChartSampleData>[
|
||||
ChartSampleData(x: DateTime(2015, 1, 1), yValue: _getRandomInt(15, 95)),
|
||||
ChartSampleData(x: DateTime(2016, 1, 1), yValue: _getRandomInt(5, 75)),
|
||||
ChartSampleData(x: DateTime(2017, 1, 1), yValue: _getRandomInt(5, 95)),
|
||||
ChartSampleData(x: DateTime(2018, 1, 1), yValue: _getRandomInt(5, 85)),
|
||||
ChartSampleData(x: DateTime(2019, 1, 1), yValue: _getRandomInt(5, 95)),
|
||||
ChartSampleData(x: DateTime(2020, 1, 1), yValue: _getRandomInt(5, 95)),
|
||||
];
|
||||
final List<ChartSampleData> month = <ChartSampleData>[
|
||||
ChartSampleData(x: DateTime(2015, 1, 1), yValue: _getRandomInt(5, 95)),
|
||||
ChartSampleData(x: DateTime(2015, 2, 1), yValue: _getRandomInt(5, 95)),
|
||||
ChartSampleData(x: DateTime(2015, 3, 1), yValue: _getRandomInt(5, 95)),
|
||||
ChartSampleData(x: DateTime(2015, 4, 1), yValue: _getRandomInt(5, 95)),
|
||||
ChartSampleData(x: DateTime(2015, 5, 1), yValue: _getRandomInt(5, 95)),
|
||||
ChartSampleData(x: DateTime(2015, 6, 1), yValue: _getRandomInt(5, 95)),
|
||||
];
|
||||
final List<ChartSampleData> day = <ChartSampleData>[
|
||||
ChartSampleData(x: DateTime(2015, 1, 5), yValue: _getRandomInt(5, 95)),
|
||||
ChartSampleData(x: DateTime(2015, 1, 6), yValue: _getRandomInt(5, 95)),
|
||||
ChartSampleData(x: DateTime(2015, 1, 7), yValue: _getRandomInt(5, 95)),
|
||||
ChartSampleData(x: DateTime(2015, 1, 8), yValue: _getRandomInt(5, 95)),
|
||||
ChartSampleData(x: DateTime(2015, 1, 9), yValue: _getRandomInt(5, 95)),
|
||||
ChartSampleData(x: DateTime(2015, 1, 10), yValue: _getRandomInt(5, 95)),
|
||||
];
|
||||
final List<ChartSampleData> hour = <ChartSampleData>[
|
||||
ChartSampleData(
|
||||
x: DateTime(2015, 1, 1, 11, 00), yValue: _getRandomInt(5, 95)),
|
||||
ChartSampleData(
|
||||
x: DateTime(2015, 1, 1, 12, 00), yValue: _getRandomInt(5, 95)),
|
||||
ChartSampleData(
|
||||
x: DateTime(2015, 1, 1, 13, 00), yValue: _getRandomInt(5, 95)),
|
||||
ChartSampleData(
|
||||
x: DateTime(2015, 1, 1, 14, 00), yValue: _getRandomInt(5, 95)),
|
||||
ChartSampleData(
|
||||
x: DateTime(2015, 1, 1, 15, 00), yValue: _getRandomInt(5, 95)),
|
||||
ChartSampleData(
|
||||
x: DateTime(2015, 1, 1, 16, 00), yValue: _getRandomInt(5, 95)),
|
||||
];
|
||||
final List<ChartSampleData> minute = <ChartSampleData>[
|
||||
ChartSampleData(
|
||||
x: DateTime(2015, 1, 1, 22, 01), yValue: _getRandomInt(5, 95)),
|
||||
ChartSampleData(
|
||||
x: DateTime(2015, 1, 1, 22, 02), yValue: _getRandomInt(5, 95)),
|
||||
ChartSampleData(
|
||||
x: DateTime(2015, 1, 1, 22, 03), yValue: _getRandomInt(5, 95)),
|
||||
ChartSampleData(
|
||||
x: DateTime(2015, 1, 1, 22, 04), yValue: _getRandomInt(5, 95)),
|
||||
ChartSampleData(
|
||||
x: DateTime(2015, 1, 1, 22, 05), yValue: _getRandomInt(5, 95)),
|
||||
ChartSampleData(
|
||||
x: DateTime(2015, 1, 1, 22, 06), yValue: _getRandomInt(5, 95)),
|
||||
];
|
||||
final List<ChartSampleData> second = <ChartSampleData>[
|
||||
ChartSampleData(
|
||||
x: DateTime(2015, 1, 1, 14, 52, 01), yValue: _getRandomInt(5, 95)),
|
||||
ChartSampleData(
|
||||
x: DateTime(2015, 1, 1, 14, 52, 02), yValue: _getRandomInt(5, 95)),
|
||||
ChartSampleData(
|
||||
x: DateTime(2015, 1, 1, 14, 52, 03), yValue: _getRandomInt(5, 95)),
|
||||
ChartSampleData(
|
||||
x: DateTime(2015, 1, 1, 14, 52, 04), yValue: _getRandomInt(5, 95)),
|
||||
ChartSampleData(
|
||||
x: DateTime(2015, 1, 1, 14, 52, 05), yValue: _getRandomInt(5, 95)),
|
||||
ChartSampleData(
|
||||
x: DateTime(2015, 1, 1, 14, 52, 06), yValue: _getRandomInt(5, 95)),
|
||||
];
|
||||
final List<ChartSampleData> millisecond = <ChartSampleData>[
|
||||
ChartSampleData(
|
||||
x: DateTime(2015, 1, 1, 01, 01, 55, 001), yValue: _getRandomInt(5, 95)),
|
||||
ChartSampleData(
|
||||
x: DateTime(2015, 1, 1, 01, 01, 55, 002), yValue: _getRandomInt(5, 95)),
|
||||
ChartSampleData(
|
||||
x: DateTime(2015, 1, 1, 01, 01, 55, 003), yValue: _getRandomInt(5, 95)),
|
||||
ChartSampleData(
|
||||
x: DateTime(2015, 1, 1, 01, 01, 55, 004), yValue: _getRandomInt(5, 95)),
|
||||
ChartSampleData(
|
||||
x: DateTime(2015, 1, 1, 01, 01, 55, 005), yValue: _getRandomInt(5, 95)),
|
||||
ChartSampleData(
|
||||
x: DateTime(2015, 1, 1, 01, 01, 55, 006), yValue: _getRandomInt(5, 95)),
|
||||
];
|
||||
|
||||
@override
|
||||
void initState() {
|
||||
_selectedIntervalType = 'years';
|
||||
chartData = year;
|
||||
super.initState();
|
||||
}
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return _buildDefaultDateTimeAxisChart();
|
||||
}
|
||||
|
||||
@override
|
||||
Widget buildSettings(BuildContext context) {
|
||||
final double screenWidth =
|
||||
model.isWebFullView ? 245 : MediaQuery.of(context).size.width;
|
||||
return StatefulBuilder(
|
||||
builder: (BuildContext context, StateSetter stateSetter) {
|
||||
return ListView(
|
||||
shrinkWrap: true,
|
||||
children: <Widget>[
|
||||
ListTile(
|
||||
title: Text('Interval type',
|
||||
softWrap: false,
|
||||
style: TextStyle(
|
||||
color: model.textColor,
|
||||
)),
|
||||
trailing: Container(
|
||||
padding: EdgeInsets.only(left: 0.07 * screenWidth),
|
||||
width: 0.45 * screenWidth,
|
||||
height: 50,
|
||||
alignment: Alignment.center,
|
||||
child: DropdownButton<String>(
|
||||
isExpanded: true,
|
||||
underline:
|
||||
Container(color: const Color(0xFFBDBDBD), height: 1),
|
||||
value: _selectedIntervalType,
|
||||
items: _intervalType.map((String value) {
|
||||
return DropdownMenuItem<String>(
|
||||
value: (value != null) ? value : 'left',
|
||||
child: Text(value,
|
||||
softWrap: false,
|
||||
style: TextStyle(color: model.textColor)));
|
||||
}).toList(),
|
||||
onChanged: (dynamic value) {
|
||||
onIntervalTypeChanged(value);
|
||||
stateSetter(() {});
|
||||
}),
|
||||
)),
|
||||
],
|
||||
);
|
||||
});
|
||||
}
|
||||
|
||||
/// Returns the line chart with default datetime axis.
|
||||
SfCartesianChart _buildDefaultDateTimeAxisChart() {
|
||||
return SfCartesianChart(
|
||||
plotAreaBorderWidth: 0,
|
||||
primaryXAxis: DateTimeAxis(
|
||||
title: AxisTitle(
|
||||
text: isCardView
|
||||
? ''
|
||||
: '${_selectedIntervalType[0].toUpperCase()}${_selectedIntervalType.substring(1).toLowerCase()}'),
|
||||
labelIntersectAction: _selectedIntervalType == 'hours'
|
||||
? AxisLabelIntersectAction.rotate45
|
||||
: AxisLabelIntersectAction.multipleRows,
|
||||
labelAlignment: _selectedIntervalType == 'hours'
|
||||
? LabelAlignment.start
|
||||
: LabelAlignment.center,
|
||||
intervalType: _chartIntervalType,
|
||||
dateFormat: _selectedIntervalType == 'days'
|
||||
? DateFormat('EEE')
|
||||
: _selectedIntervalType == 'milliseconds'
|
||||
? DateFormat('ss:SSS')
|
||||
: _dateFormat,
|
||||
edgeLabelPlacement: _selectedIntervalType != 'months' &&
|
||||
_selectedIntervalType != 'days' &&
|
||||
!model.isWebFullView
|
||||
? EdgeLabelPlacement.shift
|
||||
: EdgeLabelPlacement.none,
|
||||
majorGridLines: const MajorGridLines(width: 0),
|
||||
interval: 1),
|
||||
primaryYAxis: NumericAxis(
|
||||
axisLine: const AxisLine(width: 0),
|
||||
majorTickLines: const MajorTickLines(size: 0),
|
||||
),
|
||||
series: _getDefaultDateTimeSeries(),
|
||||
);
|
||||
}
|
||||
|
||||
/// Returns the line chart with default data time axis.
|
||||
List<LineSeries<ChartSampleData, DateTime>> _getDefaultDateTimeSeries() {
|
||||
return <LineSeries<ChartSampleData, DateTime>>[
|
||||
LineSeries<ChartSampleData, DateTime>(
|
||||
dataSource: chartData,
|
||||
xValueMapper: (ChartSampleData data, _) => data.x as DateTime,
|
||||
yValueMapper: (ChartSampleData data, _) => data.yValue,
|
||||
)
|
||||
];
|
||||
}
|
||||
|
||||
void onIntervalTypeChanged(String intervalType) {
|
||||
if (intervalType == 'years') {
|
||||
_selectedIntervalType = intervalType;
|
||||
_chartIntervalType = DateTimeIntervalType.years;
|
||||
_dateFormat = DateFormat.y();
|
||||
chartData = year;
|
||||
}
|
||||
if (intervalType == 'months') {
|
||||
_selectedIntervalType = intervalType;
|
||||
_chartIntervalType = DateTimeIntervalType.months;
|
||||
_dateFormat = DateFormat.MMM();
|
||||
chartData = month;
|
||||
}
|
||||
if (intervalType == 'days') {
|
||||
_selectedIntervalType = intervalType;
|
||||
_chartIntervalType = DateTimeIntervalType.days;
|
||||
chartData = day;
|
||||
}
|
||||
if (intervalType == 'hours') {
|
||||
_selectedIntervalType = intervalType;
|
||||
_chartIntervalType = DateTimeIntervalType.hours;
|
||||
_dateFormat = DateFormat.jm();
|
||||
chartData = hour;
|
||||
}
|
||||
if (intervalType == 'minutes') {
|
||||
_selectedIntervalType = intervalType;
|
||||
_chartIntervalType = DateTimeIntervalType.minutes;
|
||||
_dateFormat = DateFormat.Hm();
|
||||
chartData = minute;
|
||||
}
|
||||
if (intervalType == 'seconds') {
|
||||
_selectedIntervalType = intervalType;
|
||||
_chartIntervalType = DateTimeIntervalType.seconds;
|
||||
_dateFormat = DateFormat.ms();
|
||||
chartData = second;
|
||||
}
|
||||
if (intervalType == 'milliseconds') {
|
||||
_selectedIntervalType = intervalType;
|
||||
_chartIntervalType = DateTimeIntervalType.milliseconds;
|
||||
chartData = millisecond;
|
||||
}
|
||||
setState(() {});
|
||||
}
|
||||
}
|
||||
|
||||
num _getRandomInt(int min, int max) {
|
||||
final Random random = Random();
|
||||
return min + random.nextInt(max - min);
|
||||
}
|
||||
|
|
@ -188,7 +188,7 @@ class _ChartMaximumLabelWidthState extends SampleViewState {
|
|||
xValueMapper: (ChartSampleData sales, _) => sales.x as String,
|
||||
yValueMapper: (ChartSampleData sales, _) => sales.y,
|
||||
dataLabelSettings:
|
||||
DataLabelSettings(isVisible: true, offset: const Offset(-5, 0)),
|
||||
const DataLabelSettings(isVisible: true, offset: Offset(-5, 0)),
|
||||
)
|
||||
];
|
||||
}
|
||||
|
|
|
|||
|
|
@ -75,7 +75,7 @@ class _CategoryDefaultState extends SampleViewState {
|
|||
xValueMapper: (ChartSampleData data, _) => data.x as String,
|
||||
yValueMapper: (ChartSampleData data, _) => data.yValue,
|
||||
pointColorMapper: (ChartSampleData data, _) => data.pointColor,
|
||||
dataLabelSettings: DataLabelSettings(isVisible: true),
|
||||
dataLabelSettings: const DataLabelSettings(isVisible: true),
|
||||
)
|
||||
];
|
||||
}
|
||||
|
|
|
|||
|
|
@ -69,9 +69,9 @@ class _DateTimeCategoryLabelState extends SampleViewState {
|
|||
name: 'Server down time',
|
||||
xValueMapper: (_OrdinalSales x, int xx) => x.year,
|
||||
yValueMapper: (_OrdinalSales sales, _) => sales.sales,
|
||||
dataLabelSettings: DataLabelSettings(
|
||||
dataLabelSettings: const DataLabelSettings(
|
||||
isVisible: true,
|
||||
offset: const Offset(0, -5),
|
||||
offset: Offset(0, -5),
|
||||
)),
|
||||
]);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -71,7 +71,7 @@ class _BarTrackerState extends SampleViewState {
|
|||
/// If we enable this property as true,
|
||||
/// then we can show the track of series.
|
||||
isTrackVisible: true,
|
||||
dataLabelSettings: DataLabelSettings(
|
||||
dataLabelSettings: const DataLabelSettings(
|
||||
isVisible: true, labelAlignment: ChartDataLabelAlignment.top),
|
||||
xValueMapper: (ChartSampleData sales, _) => sales.x as String,
|
||||
yValueMapper: (ChartSampleData sales, _) => sales.y,
|
||||
|
|
|
|||
|
|
@ -79,7 +79,7 @@ class _BarCustomizationState extends SampleViewState {
|
|||
onCreateRenderer: (ChartSeries<ChartSampleData, String> series) {
|
||||
return _CustomBarSeriesRenderer();
|
||||
},
|
||||
dataLabelSettings: DataLabelSettings(isVisible: true),
|
||||
dataLabelSettings: const DataLabelSettings(isVisible: true),
|
||||
dataSource: <ChartSampleData>[
|
||||
ChartSampleData(
|
||||
x: 'Facebook', y: 4.119, pointColor: Colors.redAccent),
|
||||
|
|
|
|||
|
|
@ -134,7 +134,7 @@ class _AxisCrossingBaseValueState extends SampleViewState {
|
|||
xValueMapper: (ChartSampleData sales, _) => sales.x as String,
|
||||
yValueMapper: (ChartSampleData sales, _) => sales.y,
|
||||
pointColorMapper: (ChartSampleData sales, _) => sales.pointColor,
|
||||
dataLabelSettings: DataLabelSettings(
|
||||
dataLabelSettings: const DataLabelSettings(
|
||||
isVisible: true,
|
||||
labelAlignment: ChartDataLabelAlignment.middle,
|
||||
alignment: ChartAlignment.center)),
|
||||
|
|
|
|||
|
|
@ -65,7 +65,7 @@ class _ColumnRoundedState extends SampleViewState {
|
|||
return <ColumnSeries<ChartSampleData, String>>[
|
||||
ColumnSeries<ChartSampleData, String>(
|
||||
width: 0.9,
|
||||
dataLabelSettings: DataLabelSettings(
|
||||
dataLabelSettings: const DataLabelSettings(
|
||||
isVisible: true, labelAlignment: ChartDataLabelAlignment.top),
|
||||
dataSource: chartData,
|
||||
|
||||
|
|
|
|||
|
|
@ -73,10 +73,10 @@ class _ColumnTrackerState extends SampleViewState {
|
|||
xValueMapper: (ChartSampleData sales, _) => sales.x as String,
|
||||
yValueMapper: (ChartSampleData sales, _) => sales.y,
|
||||
name: 'Marks',
|
||||
dataLabelSettings: DataLabelSettings(
|
||||
dataLabelSettings: const DataLabelSettings(
|
||||
isVisible: true,
|
||||
labelAlignment: ChartDataLabelAlignment.top,
|
||||
textStyle: const TextStyle(fontSize: 10, color: Colors.white)))
|
||||
textStyle: TextStyle(fontSize: 10, color: Colors.white)))
|
||||
];
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -50,7 +50,7 @@ class _ColumnVerticalState extends SampleViewState {
|
|||
return _CustomColumnSeriesRenderer();
|
||||
},
|
||||
isTrackVisible: false,
|
||||
dataLabelSettings: DataLabelSettings(
|
||||
dataLabelSettings: const DataLabelSettings(
|
||||
isVisible: true, labelAlignment: ChartDataLabelAlignment.middle),
|
||||
dataSource: <ChartSampleData>[
|
||||
ChartSampleData(
|
||||
|
|
|
|||
|
|
@ -64,8 +64,8 @@ class _ColumnDefaultState extends SampleViewState {
|
|||
dataSource: chartData,
|
||||
xValueMapper: (ChartSampleData sales, _) => sales.x as String,
|
||||
yValueMapper: (ChartSampleData sales, _) => sales.y,
|
||||
dataLabelSettings: DataLabelSettings(
|
||||
isVisible: true, textStyle: const TextStyle(fontSize: 10)),
|
||||
dataLabelSettings: const DataLabelSettings(
|
||||
isVisible: true, textStyle: TextStyle(fontSize: 10)),
|
||||
)
|
||||
];
|
||||
}
|
||||
|
|
|
|||
|
|
@ -121,10 +121,10 @@ class _HiloOpenCloseChartState extends SampleViewState {
|
|||
close: 92.04),
|
||||
ChartSampleData(
|
||||
x: DateTime(2016, 02, 22),
|
||||
open: 96.31,
|
||||
open: 98.0237,
|
||||
high: 98.0237,
|
||||
low: 98.0237,
|
||||
close: 96.31),
|
||||
close: 98.0237),
|
||||
ChartSampleData(
|
||||
x: DateTime(2016, 02, 29),
|
||||
open: 99.86,
|
||||
|
|
@ -355,10 +355,10 @@ class _HiloOpenCloseChartState extends SampleViewState {
|
|||
close: 110.06),
|
||||
ChartSampleData(
|
||||
x: DateTime(2016, 11, 21),
|
||||
open: 114.12,
|
||||
open: 115.42,
|
||||
high: 115.42,
|
||||
low: 115.42,
|
||||
close: 114.12),
|
||||
close: 115.42),
|
||||
ChartSampleData(
|
||||
x: DateTime(2016, 11, 28),
|
||||
open: 111.43,
|
||||
|
|
|
|||
|
|
@ -200,11 +200,11 @@ class _HistogramDefaultState extends SampleViewState {
|
|||
width: 0.99,
|
||||
curveWidth: 2.5,
|
||||
yValueMapper: (ChartSampleData sales, _) => sales.x as double,
|
||||
dataLabelSettings: DataLabelSettings(
|
||||
dataLabelSettings: const DataLabelSettings(
|
||||
isVisible: true,
|
||||
labelAlignment: ChartDataLabelAlignment.top,
|
||||
textStyle: const TextStyle(
|
||||
fontWeight: FontWeight.bold, color: Colors.white)),
|
||||
textStyle:
|
||||
TextStyle(fontWeight: FontWeight.bold, color: Colors.white)),
|
||||
)
|
||||
];
|
||||
}
|
||||
|
|
|
|||
|
|
@ -64,25 +64,25 @@ class _StackedColumn100ChartState extends SampleViewState {
|
|||
return <ChartSeries<_ChartData, String>>[
|
||||
StackedColumn100Series<_ChartData, String>(
|
||||
dataSource: chartData,
|
||||
dataLabelSettings: DataLabelSettings(isVisible: true),
|
||||
dataLabelSettings: const DataLabelSettings(isVisible: true),
|
||||
xValueMapper: (_ChartData sales, _) => sales.x,
|
||||
yValueMapper: (_ChartData sales, _) => sales.y1,
|
||||
name: 'Product A'),
|
||||
StackedColumn100Series<_ChartData, String>(
|
||||
dataSource: chartData,
|
||||
dataLabelSettings: DataLabelSettings(isVisible: true),
|
||||
dataLabelSettings: const DataLabelSettings(isVisible: true),
|
||||
xValueMapper: (_ChartData sales, _) => sales.x,
|
||||
yValueMapper: (_ChartData sales, _) => sales.y2,
|
||||
name: 'Product B'),
|
||||
StackedColumn100Series<_ChartData, String>(
|
||||
dataSource: chartData,
|
||||
dataLabelSettings: DataLabelSettings(isVisible: true),
|
||||
dataLabelSettings: const DataLabelSettings(isVisible: true),
|
||||
xValueMapper: (_ChartData sales, _) => sales.x,
|
||||
yValueMapper: (_ChartData sales, _) => sales.y3,
|
||||
name: 'Product C'),
|
||||
StackedColumn100Series<_ChartData, String>(
|
||||
dataSource: chartData,
|
||||
dataLabelSettings: DataLabelSettings(isVisible: true),
|
||||
dataLabelSettings: const DataLabelSettings(isVisible: true),
|
||||
xValueMapper: (_ChartData sales, _) => sales.x,
|
||||
yValueMapper: (_ChartData sales, _) => sales.y4,
|
||||
name: 'Product D')
|
||||
|
|
|
|||
|
|
@ -130,7 +130,7 @@ class _WaterFallState extends SampleViewState {
|
|||
sales.intermediateSumPredicate,
|
||||
totalSumPredicate: (_ChartSampleData sales, _) =>
|
||||
sales.totalSumPredicate,
|
||||
dataLabelSettings: DataLabelSettings(
|
||||
dataLabelSettings: const DataLabelSettings(
|
||||
isVisible: true, labelAlignment: ChartDataLabelAlignment.middle),
|
||||
color: const Color.fromRGBO(0, 189, 174, 1),
|
||||
negativePointsColor: const Color.fromRGBO(229, 101, 144, 1),
|
||||
|
|
|
|||
|
|
@ -58,7 +58,7 @@ class _JsonDataState extends SampleViewState {
|
|||
: const Color.fromRGBO(0, 0, 0, 0.03),
|
||||
lineWidth: 15,
|
||||
activationMode: ActivationMode.singleTap,
|
||||
markerSettings: TrackballMarkerSettings(
|
||||
markerSettings: const TrackballMarkerSettings(
|
||||
borderWidth: 4,
|
||||
height: 10,
|
||||
width: 10,
|
||||
|
|
|
|||
|
|
@ -30,7 +30,7 @@ class _LocalDataState extends SampleViewState {
|
|||
: const Color.fromRGBO(0, 0, 0, 0.03),
|
||||
lineWidth: 15,
|
||||
activationMode: ActivationMode.singleTap,
|
||||
markerSettings: TrackballMarkerSettings(
|
||||
markerSettings: const TrackballMarkerSettings(
|
||||
borderWidth: 4,
|
||||
height: 10,
|
||||
width: 10,
|
||||
|
|
|
|||
|
|
@ -1,5 +1,7 @@
|
|||
/// Package import
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter_examples/widgets/custom_button.dart';
|
||||
import 'package:intl/intl.dart';
|
||||
|
||||
/// Chart import
|
||||
import 'package:syncfusion_flutter_charts/charts.dart';
|
||||
|
|
@ -28,6 +30,8 @@ class _CartesianLegendOptionsState extends SampleViewState {
|
|||
final List<String> _modeList = <String>['wrap', 'scroll', 'none'].toList();
|
||||
late String _selectedMode;
|
||||
late LegendItemOverflowMode _overflowMode;
|
||||
late double _xOffset = double.nan;
|
||||
late double _yOffset = double.nan;
|
||||
|
||||
@override
|
||||
void initState() {
|
||||
|
|
@ -55,6 +59,7 @@ class _CartesianLegendOptionsState extends SampleViewState {
|
|||
children: <Widget>[
|
||||
ListTile(
|
||||
title: Text('Position ',
|
||||
softWrap: false,
|
||||
style: TextStyle(
|
||||
color: model.textColor,
|
||||
)),
|
||||
|
|
@ -80,6 +85,7 @@ class _CartesianLegendOptionsState extends SampleViewState {
|
|||
),
|
||||
ListTile(
|
||||
title: Text('Overflow mode',
|
||||
softWrap: false,
|
||||
style: TextStyle(
|
||||
color: model.textColor,
|
||||
)),
|
||||
|
|
@ -104,7 +110,11 @@ class _CartesianLegendOptionsState extends SampleViewState {
|
|||
})),
|
||||
),
|
||||
ListTile(
|
||||
title: Text('Toggle visibility',
|
||||
title: Text(
|
||||
model.isWebFullView
|
||||
? 'Toggle \nvisibility'
|
||||
: 'Toggle visibility',
|
||||
softWrap: false,
|
||||
style: TextStyle(
|
||||
color: model.textColor,
|
||||
)),
|
||||
|
|
@ -123,6 +133,48 @@ class _CartesianLegendOptionsState extends SampleViewState {
|
|||
});
|
||||
})),
|
||||
),
|
||||
ListTile(
|
||||
title: Text('X offset',
|
||||
style: TextStyle(
|
||||
color: model.textColor,
|
||||
)),
|
||||
trailing: Container(
|
||||
width: 0.4 * screenWidth,
|
||||
height: 50,
|
||||
child: CustomDirectionalButtons(
|
||||
minValue: -100,
|
||||
maxValue: 100,
|
||||
initialValue: _xOffset,
|
||||
needNull: true,
|
||||
onChanged: (double val) => setState(() {
|
||||
_xOffset = val;
|
||||
}),
|
||||
step: 10,
|
||||
iconColor: model.textColor,
|
||||
style: TextStyle(fontSize: 16.0, color: model.textColor),
|
||||
),
|
||||
)),
|
||||
ListTile(
|
||||
title: Text('Y offset',
|
||||
style: TextStyle(
|
||||
color: model.textColor,
|
||||
)),
|
||||
trailing: Container(
|
||||
width: 0.4 * screenWidth,
|
||||
height: 50,
|
||||
child: CustomDirectionalButtons(
|
||||
minValue: -100,
|
||||
maxValue: 100,
|
||||
needNull: true,
|
||||
initialValue: _yOffset,
|
||||
onChanged: (double val) => setState(() {
|
||||
_yOffset = val;
|
||||
}),
|
||||
step: 10,
|
||||
iconColor: model.textColor,
|
||||
style: TextStyle(fontSize: 16.0, color: model.textColor),
|
||||
),
|
||||
)),
|
||||
],
|
||||
);
|
||||
});
|
||||
|
|
@ -132,105 +184,167 @@ class _CartesianLegendOptionsState extends SampleViewState {
|
|||
SfCartesianChart _buildCartesianLegendOptionsChart() {
|
||||
return SfCartesianChart(
|
||||
plotAreaBorderWidth: 0,
|
||||
title: ChartTitle(text: isCardView ? '' : 'Monthly expense of a family'),
|
||||
title: ChartTitle(
|
||||
text: isCardView ? '' : 'Sales comparision of fruits in a shop'),
|
||||
|
||||
/// Legend and its options for cartesian chart.
|
||||
legend: Legend(
|
||||
isVisible: !isCardView,
|
||||
position: _position,
|
||||
overflowMode: _overflowMode,
|
||||
toggleSeriesVisibility: toggleVisibility),
|
||||
primaryXAxis: CategoryAxis(
|
||||
majorGridLines: const MajorGridLines(width: 0),
|
||||
labelRotation: isCardView ? 0 : -45,
|
||||
isVisible: true,
|
||||
position: _position,
|
||||
offset: (_xOffset.isNaN || _yOffset.isNaN)
|
||||
? null
|
||||
: Offset(_xOffset, _yOffset),
|
||||
overflowMode: _overflowMode,
|
||||
toggleSeriesVisibility: toggleVisibility,
|
||||
backgroundColor: model.currentThemeData?.brightness == Brightness.light
|
||||
? Colors.white.withOpacity(0.5)
|
||||
: const Color.fromRGBO(33, 33, 33, 0.5),
|
||||
borderColor: model.currentThemeData?.brightness == Brightness.light
|
||||
? Colors.black.withOpacity(0.5)
|
||||
: Colors.white.withOpacity(0.5),
|
||||
borderWidth: 1,
|
||||
),
|
||||
|
||||
primaryXAxis: DateTimeAxis(
|
||||
majorGridLines: const MajorGridLines(width: 0),
|
||||
intervalType: DateTimeIntervalType.years,
|
||||
dateFormat: DateFormat.y()),
|
||||
primaryYAxis: NumericAxis(
|
||||
axisLine: const AxisLine(width: 0),
|
||||
labelFormat: r'${value}',
|
||||
labelFormat: '{value}B',
|
||||
interval: isCardView ? null : 1,
|
||||
majorTickLines: const MajorTickLines(size: 0)),
|
||||
series: _getStackedLineSeries(),
|
||||
series: _getStackedAreaSeries(),
|
||||
tooltipBehavior: TooltipBehavior(enable: true),
|
||||
);
|
||||
}
|
||||
|
||||
/// Returns the list of chart series which need to render
|
||||
/// on the stacked line chart.
|
||||
List<StackedLineSeries<ChartSampleData, String>> _getStackedLineSeries() {
|
||||
/// on the stacked area chart.
|
||||
List<StackedAreaSeries<ChartSampleData, DateTime>> _getStackedAreaSeries() {
|
||||
final List<ChartSampleData> chartData = <ChartSampleData>[
|
||||
ChartSampleData(
|
||||
x: 'Food',
|
||||
y: 55,
|
||||
yValue: 40,
|
||||
secondSeriesYValue: 45,
|
||||
thirdSeriesYValue: 48,
|
||||
size: 28),
|
||||
x: DateTime(2000, 1, 1),
|
||||
y: 0.61,
|
||||
yValue: 0.03,
|
||||
secondSeriesYValue: 0.48,
|
||||
thirdSeriesYValue: 0.23),
|
||||
ChartSampleData(
|
||||
x: 'Transport',
|
||||
y: 33,
|
||||
yValue: 45,
|
||||
secondSeriesYValue: 54,
|
||||
thirdSeriesYValue: 28,
|
||||
size: 35),
|
||||
x: DateTime(2001, 1, 1),
|
||||
y: 0.81,
|
||||
yValue: 0.05,
|
||||
secondSeriesYValue: 0.53,
|
||||
thirdSeriesYValue: 0.17),
|
||||
ChartSampleData(
|
||||
x: 'Medical',
|
||||
y: 43,
|
||||
yValue: 23,
|
||||
secondSeriesYValue: 20,
|
||||
thirdSeriesYValue: 34,
|
||||
size: 48),
|
||||
x: DateTime(2002, 1, 1),
|
||||
y: 0.91,
|
||||
yValue: 0.06,
|
||||
secondSeriesYValue: 0.57,
|
||||
thirdSeriesYValue: 0.17),
|
||||
ChartSampleData(
|
||||
x: 'Clothes',
|
||||
y: 32,
|
||||
yValue: 54,
|
||||
secondSeriesYValue: 23,
|
||||
thirdSeriesYValue: 54,
|
||||
size: 27),
|
||||
x: DateTime(2003, 1, 1),
|
||||
y: 1.00,
|
||||
yValue: 0.09,
|
||||
secondSeriesYValue: 0.61,
|
||||
thirdSeriesYValue: 0.20),
|
||||
ChartSampleData(
|
||||
x: 'Books',
|
||||
y: 56,
|
||||
yValue: 18,
|
||||
secondSeriesYValue: 43,
|
||||
thirdSeriesYValue: 55,
|
||||
size: 31),
|
||||
x: DateTime(2004, 1, 1),
|
||||
y: 1.19,
|
||||
yValue: 0.14,
|
||||
secondSeriesYValue: 0.63,
|
||||
thirdSeriesYValue: 0.23),
|
||||
ChartSampleData(
|
||||
x: 'Others',
|
||||
y: 23,
|
||||
yValue: 54,
|
||||
secondSeriesYValue: 33,
|
||||
thirdSeriesYValue: 56,
|
||||
size: 35),
|
||||
x: DateTime(2005, 1, 1),
|
||||
y: 1.47,
|
||||
yValue: 0.20,
|
||||
secondSeriesYValue: 0.64,
|
||||
thirdSeriesYValue: 0.36),
|
||||
ChartSampleData(
|
||||
x: DateTime(2006, 1, 1),
|
||||
y: 1.74,
|
||||
yValue: 0.29,
|
||||
secondSeriesYValue: 0.66,
|
||||
thirdSeriesYValue: 0.43),
|
||||
ChartSampleData(
|
||||
x: DateTime(2007, 1, 1),
|
||||
y: 1.98,
|
||||
yValue: 0.46,
|
||||
secondSeriesYValue: 0.76,
|
||||
thirdSeriesYValue: 0.52),
|
||||
ChartSampleData(
|
||||
x: DateTime(2008, 1, 1),
|
||||
y: 1.99,
|
||||
yValue: 0.64,
|
||||
secondSeriesYValue: 0.77,
|
||||
thirdSeriesYValue: 0.72),
|
||||
ChartSampleData(
|
||||
x: DateTime(2009, 1, 1),
|
||||
y: 1.70,
|
||||
yValue: 0.75,
|
||||
secondSeriesYValue: 0.55,
|
||||
thirdSeriesYValue: 1.29),
|
||||
ChartSampleData(
|
||||
x: DateTime(2010, 1, 1),
|
||||
y: 1.48,
|
||||
yValue: 1.06,
|
||||
secondSeriesYValue: 0.54,
|
||||
thirdSeriesYValue: 1.38),
|
||||
ChartSampleData(
|
||||
x: DateTime(2011, 1, 1),
|
||||
y: 1.38,
|
||||
yValue: 1.25,
|
||||
secondSeriesYValue: 0.57,
|
||||
thirdSeriesYValue: 1.82),
|
||||
ChartSampleData(
|
||||
x: DateTime(2012, 1, 1),
|
||||
y: 1.66,
|
||||
yValue: 1.55,
|
||||
secondSeriesYValue: 0.61,
|
||||
thirdSeriesYValue: 2.16),
|
||||
ChartSampleData(
|
||||
x: DateTime(2013, 1, 1),
|
||||
y: 1.66,
|
||||
yValue: 1.55,
|
||||
secondSeriesYValue: 0.67,
|
||||
thirdSeriesYValue: 2.51),
|
||||
ChartSampleData(
|
||||
x: DateTime(2014, 1, 1),
|
||||
y: 1.67,
|
||||
yValue: 1.65,
|
||||
secondSeriesYValue: 0.67,
|
||||
thirdSeriesYValue: 2.61),
|
||||
ChartSampleData(
|
||||
x: DateTime(2015, 1, 1),
|
||||
y: 1.68,
|
||||
yValue: 1.75,
|
||||
secondSeriesYValue: 0.71,
|
||||
thirdSeriesYValue: 2.71),
|
||||
];
|
||||
return <StackedLineSeries<ChartSampleData, String>>[
|
||||
StackedLineSeries<ChartSampleData, String>(
|
||||
return <StackedAreaSeries<ChartSampleData, DateTime>>[
|
||||
StackedAreaSeries<ChartSampleData, DateTime>(
|
||||
animationDuration: 2500,
|
||||
dataSource: chartData,
|
||||
xValueMapper: (ChartSampleData sales, _) => sales.x as String,
|
||||
xValueMapper: (ChartSampleData sales, _) => sales.x as DateTime,
|
||||
yValueMapper: (ChartSampleData sales, _) => sales.y,
|
||||
name: 'Person 1',
|
||||
markerSettings: const MarkerSettings(isVisible: true)),
|
||||
StackedLineSeries<ChartSampleData, String>(
|
||||
name: 'Apple'),
|
||||
StackedAreaSeries<ChartSampleData, DateTime>(
|
||||
animationDuration: 2500,
|
||||
dataSource: chartData,
|
||||
xValueMapper: (ChartSampleData sales, _) => sales.x as String,
|
||||
xValueMapper: (ChartSampleData sales, _) => sales.x as DateTime,
|
||||
yValueMapper: (ChartSampleData sales, _) => sales.yValue,
|
||||
name: 'Person 2',
|
||||
markerSettings: const MarkerSettings(isVisible: true)),
|
||||
StackedLineSeries<ChartSampleData, String>(
|
||||
name: 'Orange'),
|
||||
StackedAreaSeries<ChartSampleData, DateTime>(
|
||||
animationDuration: 2500,
|
||||
dataSource: chartData,
|
||||
xValueMapper: (ChartSampleData sales, _) => sales.x as String,
|
||||
xValueMapper: (ChartSampleData sales, _) => sales.x as DateTime,
|
||||
yValueMapper: (ChartSampleData sales, _) => sales.secondSeriesYValue,
|
||||
name: 'Person 3',
|
||||
markerSettings: const MarkerSettings(isVisible: true)),
|
||||
StackedLineSeries<ChartSampleData, String>(
|
||||
name: 'Pear'),
|
||||
StackedAreaSeries<ChartSampleData, DateTime>(
|
||||
animationDuration: 2500,
|
||||
dataSource: chartData,
|
||||
xValueMapper: (ChartSampleData sales, _) => sales.x as String,
|
||||
xValueMapper: (ChartSampleData sales, _) => sales.x as DateTime,
|
||||
yValueMapper: (ChartSampleData sales, _) => sales.thirdSeriesYValue,
|
||||
name: 'Person 4',
|
||||
markerSettings: const MarkerSettings(isVisible: true)),
|
||||
StackedLineSeries<ChartSampleData, String>(
|
||||
dataSource: chartData,
|
||||
xValueMapper: (ChartSampleData sales, _) => sales.x as String,
|
||||
yValueMapper: (ChartSampleData sales, _) => sales.size,
|
||||
name: 'Person 5',
|
||||
markerSettings: const MarkerSettings(isVisible: true))
|
||||
name: 'Others')
|
||||
];
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -77,7 +77,7 @@ class _LiveVerticalState extends SampleViewState {
|
|||
dataSource: chartData,
|
||||
xValueMapper: (ChartSampleData sales, _) => sales.x as num,
|
||||
yValueMapper: (ChartSampleData sales, _) => sales.y,
|
||||
dataLabelSettings: DataLabelSettings(isVisible: true)),
|
||||
dataLabelSettings: const DataLabelSettings(isVisible: true)),
|
||||
];
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -112,8 +112,8 @@ class _EmptyPointsState extends SampleViewState {
|
|||
mode: _selectedEmptyPointMode, color: Colors.grey),
|
||||
xValueMapper: (ChartSampleData sales, _) => sales.x as String,
|
||||
yValueMapper: (ChartSampleData sales, _) => sales.y,
|
||||
dataLabelSettings: DataLabelSettings(
|
||||
isVisible: true, textStyle: const TextStyle(fontSize: 10)),
|
||||
dataLabelSettings: const DataLabelSettings(
|
||||
isVisible: true, textStyle: TextStyle(fontSize: 10)),
|
||||
)
|
||||
];
|
||||
}
|
||||
|
|
|
|||
|
|
@ -159,7 +159,7 @@ class _SortingDefaultState extends SampleViewState {
|
|||
xValueMapper: (ChartSampleData sales, _) => sales.x as String,
|
||||
yValueMapper: (ChartSampleData sales, _) => sales.y,
|
||||
sortingOrder: _sortingOrder,
|
||||
dataLabelSettings: DataLabelSettings(
|
||||
dataLabelSettings: const DataLabelSettings(
|
||||
isVisible: true, labelAlignment: ChartDataLabelAlignment.auto),
|
||||
sortFieldValueMapper: (ChartSampleData sales, _) =>
|
||||
_sortby == 'x' ? sales.x : sales.y,
|
||||
|
|
|
|||
|
|
@ -60,6 +60,7 @@ class _BollingerIndicatorState extends SampleViewState {
|
|||
ListTile(
|
||||
title: Text(
|
||||
'Period',
|
||||
softWrap: false,
|
||||
style: TextStyle(color: model.textColor),
|
||||
),
|
||||
trailing: Container(
|
||||
|
|
@ -79,7 +80,8 @@ class _BollingerIndicatorState extends SampleViewState {
|
|||
),
|
||||
ListTile(
|
||||
title: Text(
|
||||
'Standard deviation',
|
||||
model.isWebFullView ? 'Standard \ndeviation' : 'Standard deviation',
|
||||
softWrap: false,
|
||||
style: TextStyle(color: model.textColor),
|
||||
),
|
||||
trailing: Container(
|
||||
|
|
|
|||
|
|
@ -28,8 +28,8 @@ class _MACDIndicatorState extends SampleViewState {
|
|||
late double _longPeriod;
|
||||
late double _shortPeriod;
|
||||
final List<String> _macdIndicatorTypeList =
|
||||
<String>['Both', 'Line', 'Histogram'].toList();
|
||||
late String _selectedMacdIndicatorType = 'Both';
|
||||
<String>['both', 'line', 'histogram'].toList();
|
||||
late String _selectedMacdIndicatorType = 'both';
|
||||
late MacdType _macdType = MacdType.both;
|
||||
late TrackballBehavior _trackballBehavior;
|
||||
late TooltipBehavior _tooltipBehavior;
|
||||
|
|
@ -40,7 +40,7 @@ class _MACDIndicatorState extends SampleViewState {
|
|||
_period = 14;
|
||||
_longPeriod = 5.0;
|
||||
_shortPeriod = 2.0;
|
||||
_selectedMacdIndicatorType = 'Both';
|
||||
_selectedMacdIndicatorType = 'both';
|
||||
_macdType = MacdType.both;
|
||||
_trackballBehavior = TrackballBehavior(
|
||||
enable: !isCardView,
|
||||
|
|
@ -67,6 +67,7 @@ class _MACDIndicatorState extends SampleViewState {
|
|||
ListTile(
|
||||
title: Text(
|
||||
'Period',
|
||||
softWrap: false,
|
||||
style: TextStyle(color: model.textColor),
|
||||
),
|
||||
trailing: Container(
|
||||
|
|
@ -86,7 +87,8 @@ class _MACDIndicatorState extends SampleViewState {
|
|||
),
|
||||
ListTile(
|
||||
title: Text(
|
||||
'Long Period',
|
||||
model.isWebFullView ? 'Long \nperiod' : 'Long period',
|
||||
softWrap: false,
|
||||
style: TextStyle(color: model.textColor),
|
||||
),
|
||||
trailing: Container(
|
||||
|
|
@ -106,7 +108,8 @@ class _MACDIndicatorState extends SampleViewState {
|
|||
),
|
||||
ListTile(
|
||||
title: Text(
|
||||
'Short period',
|
||||
model.isWebFullView ? 'Short \nperiod' : 'Short period',
|
||||
softWrap: false,
|
||||
style: TextStyle(color: model.textColor),
|
||||
),
|
||||
trailing: Container(
|
||||
|
|
@ -126,6 +129,7 @@ class _MACDIndicatorState extends SampleViewState {
|
|||
),
|
||||
ListTile(
|
||||
title: Text('MACD type ',
|
||||
softWrap: false,
|
||||
style: TextStyle(
|
||||
color: model.textColor,
|
||||
)),
|
||||
|
|
@ -215,13 +219,13 @@ class _MACDIndicatorState extends SampleViewState {
|
|||
void _onMacdIndicatorTypeChanged(String item) {
|
||||
_selectedMacdIndicatorType = item;
|
||||
switch (_selectedMacdIndicatorType) {
|
||||
case 'Both':
|
||||
case 'both':
|
||||
_macdType = MacdType.both;
|
||||
break;
|
||||
case 'Line':
|
||||
case 'line':
|
||||
_macdType = MacdType.line;
|
||||
break;
|
||||
case 'Histogram':
|
||||
case 'histogram':
|
||||
_macdType = MacdType.histogram;
|
||||
break;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -61,6 +61,7 @@ class _RSIIndicatorState extends SampleViewState {
|
|||
ListTile(
|
||||
title: Text(
|
||||
'Period',
|
||||
softWrap: false,
|
||||
style: TextStyle(color: model.textColor),
|
||||
),
|
||||
trailing: Container(
|
||||
|
|
@ -80,7 +81,8 @@ class _RSIIndicatorState extends SampleViewState {
|
|||
),
|
||||
ListTile(
|
||||
title: Text(
|
||||
'Over bought',
|
||||
'Overbought',
|
||||
softWrap: false,
|
||||
style: TextStyle(color: model.textColor),
|
||||
),
|
||||
trailing: Container(
|
||||
|
|
@ -100,7 +102,8 @@ class _RSIIndicatorState extends SampleViewState {
|
|||
),
|
||||
ListTile(
|
||||
title: Text(
|
||||
'Over Sold',
|
||||
'Oversold',
|
||||
softWrap: false,
|
||||
style: TextStyle(color: model.textColor),
|
||||
),
|
||||
trailing: Container(
|
||||
|
|
@ -119,7 +122,8 @@ class _RSIIndicatorState extends SampleViewState {
|
|||
),
|
||||
),
|
||||
ListTile(
|
||||
title: Text('Show zones',
|
||||
title: Text(model.isWebFullView ? 'Show \nzones' : 'Show zones',
|
||||
softWrap: false,
|
||||
style: TextStyle(
|
||||
color: model.textColor,
|
||||
)),
|
||||
|
|
|
|||
|
|
@ -65,6 +65,7 @@ class _StochasticcIndicatorState extends SampleViewState {
|
|||
ListTile(
|
||||
title: Text(
|
||||
'Period',
|
||||
softWrap: false,
|
||||
style: TextStyle(color: model.textColor),
|
||||
),
|
||||
trailing: Container(
|
||||
|
|
@ -85,6 +86,7 @@ class _StochasticcIndicatorState extends SampleViewState {
|
|||
ListTile(
|
||||
title: Text(
|
||||
'K Period',
|
||||
softWrap: false,
|
||||
style: TextStyle(color: model.textColor),
|
||||
),
|
||||
trailing: Container(
|
||||
|
|
@ -105,6 +107,7 @@ class _StochasticcIndicatorState extends SampleViewState {
|
|||
ListTile(
|
||||
title: Text(
|
||||
'D Period',
|
||||
softWrap: false,
|
||||
style: TextStyle(color: model.textColor),
|
||||
),
|
||||
trailing: Container(
|
||||
|
|
@ -125,6 +128,7 @@ class _StochasticcIndicatorState extends SampleViewState {
|
|||
ListTile(
|
||||
title: Text(
|
||||
'Overbought',
|
||||
softWrap: false,
|
||||
style: TextStyle(color: model.textColor),
|
||||
),
|
||||
trailing: Container(
|
||||
|
|
@ -145,6 +149,7 @@ class _StochasticcIndicatorState extends SampleViewState {
|
|||
ListTile(
|
||||
title: Text(
|
||||
'Oversold',
|
||||
softWrap: false,
|
||||
style: TextStyle(color: model.textColor),
|
||||
),
|
||||
trailing: Container(
|
||||
|
|
@ -163,7 +168,8 @@ class _StochasticcIndicatorState extends SampleViewState {
|
|||
),
|
||||
),
|
||||
ListTile(
|
||||
title: Text('Show zones',
|
||||
title: Text(model.isWebFullView ? 'Show \nzones' : 'Show zones',
|
||||
softWrap: false,
|
||||
style: TextStyle(
|
||||
color: model.textColor,
|
||||
)),
|
||||
|
|
|
|||
|
|
@ -24,12 +24,12 @@ class _TrendLineDefaultState extends SampleViewState {
|
|||
|
||||
int periodMaxValue = 0;
|
||||
final List<String> _trendlineTypeList = <String>[
|
||||
'Linear',
|
||||
'Exponential',
|
||||
'Power',
|
||||
'Logarithmic',
|
||||
'Polynomial',
|
||||
'MovingAverage'
|
||||
'linear',
|
||||
'exponential',
|
||||
'power',
|
||||
'logarithmic',
|
||||
'polynomial',
|
||||
'movingAverage'
|
||||
].toList();
|
||||
late String _selectedTrendLineType;
|
||||
late TrendlineType _type;
|
||||
|
|
@ -39,7 +39,7 @@ class _TrendLineDefaultState extends SampleViewState {
|
|||
|
||||
@override
|
||||
void initState() {
|
||||
_selectedTrendLineType = 'Linear';
|
||||
_selectedTrendLineType = 'linear';
|
||||
_type = TrendlineType.linear;
|
||||
_polynomialOrder = 2;
|
||||
_period = 2;
|
||||
|
|
@ -62,7 +62,9 @@ class _TrendLineDefaultState extends SampleViewState {
|
|||
shrinkWrap: true,
|
||||
children: <Widget>[
|
||||
ListTile(
|
||||
title: Text('Trendline type',
|
||||
title: Text(
|
||||
model.isWebFullView ? 'Trendlin\ne type' : 'Trendline type',
|
||||
softWrap: false,
|
||||
style: TextStyle(
|
||||
color: model.textColor,
|
||||
)),
|
||||
|
|
@ -89,10 +91,14 @@ class _TrendLineDefaultState extends SampleViewState {
|
|||
),
|
||||
),
|
||||
Visibility(
|
||||
visible: _selectedTrendLineType != 'Polynomial' ? false : true,
|
||||
visible: _selectedTrendLineType != 'polynomial' ? false : true,
|
||||
maintainState: true,
|
||||
child: ListTile(
|
||||
title: Text('Polynomial Order',
|
||||
title: Text(
|
||||
model.isWebFullView
|
||||
? 'Polyno\nmial \norder'
|
||||
: 'Polynomial \norder',
|
||||
softWrap: false,
|
||||
style: TextStyle(
|
||||
color: model.textColor,
|
||||
)),
|
||||
|
|
@ -114,10 +120,11 @@ class _TrendLineDefaultState extends SampleViewState {
|
|||
),
|
||||
),
|
||||
Visibility(
|
||||
visible: _selectedTrendLineType != 'MovingAverage' ? false : true,
|
||||
visible: _selectedTrendLineType != 'movingAverage' ? false : true,
|
||||
maintainState: true,
|
||||
child: ListTile(
|
||||
title: Text('Period',
|
||||
softWrap: false,
|
||||
style: TextStyle(
|
||||
color: model.textColor,
|
||||
)),
|
||||
|
|
@ -202,22 +209,22 @@ class _TrendLineDefaultState extends SampleViewState {
|
|||
void _onTrendLineTypeChanged(String item) {
|
||||
_selectedTrendLineType = item;
|
||||
switch (_selectedTrendLineType) {
|
||||
case 'Linear':
|
||||
case 'linear':
|
||||
_type = TrendlineType.linear;
|
||||
break;
|
||||
case 'Exponential':
|
||||
case 'exponential':
|
||||
_type = TrendlineType.exponential;
|
||||
break;
|
||||
case 'Power':
|
||||
case 'power':
|
||||
_type = TrendlineType.power;
|
||||
break;
|
||||
case 'Logarithmic':
|
||||
case 'logarithmic':
|
||||
_type = TrendlineType.logarithmic;
|
||||
break;
|
||||
case 'Polynomial':
|
||||
case 'polynomial':
|
||||
_type = TrendlineType.polynomial;
|
||||
break;
|
||||
case 'MovingAverage':
|
||||
case 'movingAverage':
|
||||
_type = TrendlineType.movingAverage;
|
||||
break;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -52,7 +52,7 @@ class _TrendLineForecastState extends SampleViewState {
|
|||
style: TextStyle(fontSize: 16.0, color: model.textColor),
|
||||
),
|
||||
Container(
|
||||
padding: const EdgeInsets.fromLTRB(50, 0, 0, 0),
|
||||
padding: const EdgeInsets.fromLTRB(30, 0, 20, 0),
|
||||
child: CustomDirectionalButtons(
|
||||
maxValue: 50,
|
||||
initialValue: _forwardForecastValue,
|
||||
|
|
@ -77,7 +77,7 @@ class _TrendLineForecastState extends SampleViewState {
|
|||
style: TextStyle(fontSize: 16.0, color: model.textColor),
|
||||
),
|
||||
Container(
|
||||
padding: const EdgeInsets.fromLTRB(40, 0, 0, 0),
|
||||
padding: const EdgeInsets.fromLTRB(20, 0, 20, 0),
|
||||
child: CustomDirectionalButtons(
|
||||
maxValue: 50,
|
||||
initialValue: _backwardForecastValue,
|
||||
|
|
|
|||
|
|
@ -59,10 +59,11 @@ class _DefaultCrossHairState extends SampleViewState {
|
|||
shrinkWrap: true,
|
||||
children: <Widget>[
|
||||
ListTile(
|
||||
title: Text('Line type', style: TextStyle(color: model.textColor)),
|
||||
title: Text('Line type',
|
||||
softWrap: false, style: TextStyle(color: model.textColor)),
|
||||
trailing: Container(
|
||||
padding: EdgeInsets.only(left: 0.07 * screenWidth),
|
||||
width: 0.5 * screenWidth,
|
||||
width: 0.4 * screenWidth,
|
||||
height: 50,
|
||||
alignment: Alignment.bottomLeft,
|
||||
child: DropdownButton<String>(
|
||||
|
|
@ -81,13 +82,14 @@ class _DefaultCrossHairState extends SampleViewState {
|
|||
})),
|
||||
),
|
||||
ListTile(
|
||||
title: Text('Show always',
|
||||
title: Text(model.isWebFullView ? 'Show \nalways' : 'Show always',
|
||||
softWrap: false,
|
||||
style: TextStyle(
|
||||
color: model.textColor,
|
||||
)),
|
||||
trailing: Container(
|
||||
padding: EdgeInsets.only(left: 0.05 * screenWidth),
|
||||
width: 0.5 * screenWidth,
|
||||
width: 0.4 * screenWidth,
|
||||
child: CheckboxListTile(
|
||||
controlAffinity: ListTileControlAffinity.leading,
|
||||
contentPadding: EdgeInsets.zero,
|
||||
|
|
@ -100,10 +102,10 @@ class _DefaultCrossHairState extends SampleViewState {
|
|||
});
|
||||
}))),
|
||||
ListTile(
|
||||
title:
|
||||
Text('Hide delay ', style: TextStyle(color: model.textColor)),
|
||||
title: Text('Hide delay ',
|
||||
softWrap: false, style: TextStyle(color: model.textColor)),
|
||||
trailing: Container(
|
||||
width: 0.5 * screenWidth,
|
||||
width: 0.4 * screenWidth,
|
||||
padding: EdgeInsets.only(left: 0.03 * screenWidth),
|
||||
child: CustomDirectionalButtons(
|
||||
maxValue: 10,
|
||||
|
|
|
|||
|
|
@ -0,0 +1,358 @@
|
|||
/// Package import
|
||||
import 'package:flutter/material.dart';
|
||||
|
||||
/// Chart import
|
||||
import 'package:syncfusion_flutter_charts/charts.dart';
|
||||
|
||||
///URL launcher import
|
||||
import 'package:url_launcher/url_launcher.dart' show launch;
|
||||
|
||||
/// Local imports
|
||||
import '../../../../../model/sample_view.dart';
|
||||
|
||||
///
|
||||
List<String>? xvalue = <String>[
|
||||
'YouTube',
|
||||
'Twitter',
|
||||
'Instagram',
|
||||
'Snapchat',
|
||||
'Facebook'
|
||||
];
|
||||
|
||||
///
|
||||
List<int>? yvalue = <int>[51, 42, 63, 61, 74];
|
||||
|
||||
///
|
||||
String sortby = '';
|
||||
|
||||
///Renders default column chart sample
|
||||
class DataPoints extends SampleView {
|
||||
///Renders default column chart sample
|
||||
const DataPoints(Key key) : super(key: key);
|
||||
@override
|
||||
_DataPointsState createState() => _DataPointsState();
|
||||
}
|
||||
|
||||
class _DataPointsState extends SampleViewState {
|
||||
_DataPointsState();
|
||||
late List<ChartSampleData> chartData;
|
||||
late SortingOrder sortingOrder;
|
||||
late String sortBy;
|
||||
final GlobalKey<ScaffoldMessengerState> _scaffoldKey =
|
||||
GlobalKey<ScaffoldMessengerState>();
|
||||
@override
|
||||
void initState() {
|
||||
sortBy = '';
|
||||
sortingOrder = SortingOrder.none;
|
||||
chartData = <ChartSampleData>[
|
||||
ChartSampleData(
|
||||
x: 'YouTube',
|
||||
y: 51,
|
||||
pointColor: const Color.fromRGBO(192, 33, 39, 1),
|
||||
),
|
||||
ChartSampleData(
|
||||
x: 'Twitter',
|
||||
y: 42,
|
||||
pointColor: const Color.fromRGBO(26, 157, 235, 1),
|
||||
),
|
||||
ChartSampleData(
|
||||
x: 'Instagram',
|
||||
y: 63,
|
||||
),
|
||||
ChartSampleData(
|
||||
x: 'Snapchat',
|
||||
y: 61,
|
||||
pointColor: const Color.fromRGBO(254, 250, 55, 1),
|
||||
),
|
||||
ChartSampleData(
|
||||
x: 'Facebook',
|
||||
y: 74,
|
||||
pointColor: const Color.fromRGBO(47, 107, 167, 1),
|
||||
),
|
||||
];
|
||||
super.initState();
|
||||
}
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return ScaffoldMessenger(
|
||||
key: _scaffoldKey,
|
||||
child: Scaffold(
|
||||
backgroundColor: model.cardThemeColor,
|
||||
body: _buildDefaultColumnChart()));
|
||||
}
|
||||
|
||||
/// Get default column chart
|
||||
SfCartesianChart _buildDefaultColumnChart() {
|
||||
return SfCartesianChart(
|
||||
title: ChartTitle(
|
||||
text: isCardView
|
||||
? ''
|
||||
: 'Percentage of people using social media on a daily basis'),
|
||||
plotAreaBorderWidth: 0,
|
||||
primaryXAxis: CategoryAxis(
|
||||
majorGridLines: const MajorGridLines(width: 0),
|
||||
majorTickLines: const MajorTickLines(size: 0)),
|
||||
primaryYAxis: NumericAxis(
|
||||
axisLine: const AxisLine(width: 0),
|
||||
interval: isCardView ? 20 : 10,
|
||||
maximum: isCardView ? 100 : 90,
|
||||
majorTickLines: const MajorTickLines(size: 0)),
|
||||
series: _getDefaultColumnSeries(),
|
||||
);
|
||||
}
|
||||
|
||||
Future<void> _showMyDialog() async {
|
||||
return showDialog<void>(
|
||||
context: context,
|
||||
builder: (BuildContext context) {
|
||||
return AlertDialog(
|
||||
contentPadding: const EdgeInsets.all(0),
|
||||
content: Container(
|
||||
width: double.minPositive,
|
||||
child: ListView(
|
||||
shrinkWrap: true,
|
||||
children: <Widget>[
|
||||
Container(
|
||||
height: 40,
|
||||
child: ListTile(
|
||||
contentPadding: const EdgeInsets.fromLTRB(15, 0, 0, 0),
|
||||
title: const Text('Sort Data Points',
|
||||
style: TextStyle(
|
||||
fontSize: 16, fontWeight: FontWeight.bold)),
|
||||
trailing: IconButton(
|
||||
icon: Icon(Icons.close, color: model.backgroundColor),
|
||||
onPressed: () {
|
||||
Navigator.of(context).pop();
|
||||
},
|
||||
),
|
||||
)),
|
||||
ListTile(
|
||||
horizontalTitleGap: 0,
|
||||
title: const Text(
|
||||
'Ascending (x-value)',
|
||||
textAlign: TextAlign.center,
|
||||
),
|
||||
onTap: () {
|
||||
xvalue!.sort();
|
||||
sortingOrder = SortingOrder.ascending;
|
||||
sortBy = 'sortByX';
|
||||
Navigator.of(context).pop();
|
||||
setState(() {});
|
||||
},
|
||||
),
|
||||
const Divider(height: 4, thickness: 2),
|
||||
ListTile(
|
||||
horizontalTitleGap: 0,
|
||||
title: const Text(
|
||||
'Descending (x-value)',
|
||||
textAlign: TextAlign.center,
|
||||
),
|
||||
onTap: () {
|
||||
xvalue!.sort((String b, String a) => a.compareTo(b));
|
||||
sortingOrder = SortingOrder.descending;
|
||||
sortBy = 'sortByX';
|
||||
Navigator.of(context).pop();
|
||||
setState(() {});
|
||||
},
|
||||
),
|
||||
const Divider(height: 4, thickness: 2),
|
||||
ListTile(
|
||||
horizontalTitleGap: 0,
|
||||
title: const Text(
|
||||
'Ascending (y-value)',
|
||||
textAlign: TextAlign.center,
|
||||
),
|
||||
onTap: () {
|
||||
yvalue!.sort();
|
||||
xvalue = <String>[
|
||||
'Twitter',
|
||||
'YouTube',
|
||||
'Snapchat',
|
||||
'Instagram',
|
||||
'Facebook'
|
||||
];
|
||||
sortingOrder = SortingOrder.ascending;
|
||||
sortBy = 'sortByY';
|
||||
sortby = 'sortByY';
|
||||
Navigator.of(context).pop();
|
||||
setState(() {});
|
||||
},
|
||||
),
|
||||
const Divider(height: 4, thickness: 2),
|
||||
ListTile(
|
||||
horizontalTitleGap: 0,
|
||||
title: const Text(
|
||||
'Descending (y-value)',
|
||||
textAlign: TextAlign.center,
|
||||
),
|
||||
onTap: () {
|
||||
yvalue!.sort((int b, int a) => a.compareTo(b));
|
||||
xvalue = <String>[
|
||||
'Facebook',
|
||||
'Instagram',
|
||||
'Snapchat',
|
||||
'YouTube',
|
||||
'Twitter'
|
||||
];
|
||||
sortingOrder = SortingOrder.descending;
|
||||
sortBy = 'sortByY';
|
||||
sortby = 'sortByY';
|
||||
Navigator.of(context).pop();
|
||||
setState(() {});
|
||||
},
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
},
|
||||
);
|
||||
}
|
||||
|
||||
/// Get default column series
|
||||
List<ColumnSeries<ChartSampleData, String>> _getDefaultColumnSeries() {
|
||||
final List<Color> color = <Color>[];
|
||||
color.add(const Color.fromRGBO(93, 80, 202, 1));
|
||||
color.add(const Color.fromRGBO(183, 45, 145, 1));
|
||||
color.add(const Color.fromRGBO(250, 203, 118, 1));
|
||||
|
||||
final List<double> stops = <double>[];
|
||||
stops.add(0.0);
|
||||
stops.add(0.5);
|
||||
stops.add(1.0);
|
||||
|
||||
final LinearGradient gradientColors = LinearGradient(
|
||||
colors: color,
|
||||
stops: stops,
|
||||
begin: Alignment.topCenter,
|
||||
end: Alignment.bottomCenter);
|
||||
return <ColumnSeries<ChartSampleData, String>>[
|
||||
ColumnSeries<ChartSampleData, String>(
|
||||
onCreateRenderer: (ChartSeries<ChartSampleData, String> series) {
|
||||
return _CustomColumnSeriesRenderer(isCardView);
|
||||
},
|
||||
onPointTap: (ChartPointDetails args) {
|
||||
final String xValue =
|
||||
xvalue![args.viewportPointIndex! as int].toString();
|
||||
String? snackBarText = '';
|
||||
if (xValue == 'YouTube') {
|
||||
snackBarText = '51% of YouTube users are using it on daily basis.';
|
||||
} else if (xValue == 'Twitter') {
|
||||
snackBarText = '42% of Twitter users are using it on daily basis.';
|
||||
} else if (xValue == 'Instagram') {
|
||||
snackBarText =
|
||||
'63% of Instagram users are using it on daily basis.';
|
||||
} else if (xValue == 'Snapchat') {
|
||||
snackBarText = '61% of Snapchat users are using it on daily basis.';
|
||||
} else if (xValue == 'Facebook') {
|
||||
snackBarText = '74% of Facebook users are using it on daily basis.';
|
||||
}
|
||||
_scaffoldKey.currentState?.hideCurrentSnackBar();
|
||||
_scaffoldKey.currentState?.showSnackBar(SnackBar(
|
||||
width: _measureText(snackBarText).width,
|
||||
behavior: SnackBarBehavior.floating,
|
||||
shape: const RoundedRectangleBorder(
|
||||
borderRadius: BorderRadius.all(Radius.circular(5))),
|
||||
duration: const Duration(milliseconds: 3000),
|
||||
content: Text(
|
||||
snackBarText,
|
||||
textAlign: TextAlign.center,
|
||||
),
|
||||
));
|
||||
},
|
||||
onPointDoubleTap: (ChartPointDetails args) {
|
||||
args.pointIndex == 0
|
||||
? launch('https://www.youtube.com/')
|
||||
: args.pointIndex == 1
|
||||
? launch('http://www.twitter.com/')
|
||||
: args.pointIndex == 2
|
||||
? launch('https://www.instagram.com/')
|
||||
: args.pointIndex == 3
|
||||
? launch('http://www.snapchat.com/')
|
||||
: launch('https://www.facebook.com/');
|
||||
},
|
||||
onPointLongPress: (ChartPointDetails args) {
|
||||
_showMyDialog();
|
||||
sortby = '';
|
||||
},
|
||||
dataSource: chartData,
|
||||
animationDuration: 0,
|
||||
sortingOrder: sortingOrder,
|
||||
xValueMapper: (ChartSampleData sales, _) => sales.x as String,
|
||||
yValueMapper: (ChartSampleData sales, _) => sales.y,
|
||||
pointColorMapper: (ChartSampleData sales, _) => sales.pointColor,
|
||||
sortFieldValueMapper: (ChartSampleData sales, _) =>
|
||||
sortBy == 'sortByX' ? sales.x : sales.y,
|
||||
dataLabelSettings: const DataLabelSettings(
|
||||
isVisible: true, textStyle: TextStyle(fontSize: 10)),
|
||||
gradient: gradientColors,
|
||||
)
|
||||
];
|
||||
}
|
||||
}
|
||||
|
||||
class _CustomColumnSeriesRenderer extends ColumnSeriesRenderer {
|
||||
_CustomColumnSeriesRenderer(this._isCardView);
|
||||
final bool _isCardView;
|
||||
@override
|
||||
ChartSegment createSegment() {
|
||||
return _ColumnCustomPainter(_isCardView);
|
||||
}
|
||||
}
|
||||
|
||||
class _ColumnCustomPainter extends ColumnSegment {
|
||||
_ColumnCustomPainter(this._isCardView);
|
||||
final bool _isCardView;
|
||||
@override
|
||||
int get currentSegmentIndex => super.currentSegmentIndex!;
|
||||
@override
|
||||
void onPaint(Canvas canvas) {
|
||||
Paint? myPaint = fillPaint;
|
||||
if (_isCardView) {
|
||||
xvalue = <String>[
|
||||
'YouTube',
|
||||
'Twitter',
|
||||
'Instagram',
|
||||
'Snapchat',
|
||||
'Facebook'
|
||||
];
|
||||
sortby = '';
|
||||
}
|
||||
if (sortby == 'sortByY'
|
||||
? yvalue![currentSegmentIndex] == 51
|
||||
: xvalue![currentSegmentIndex] == 'YouTube') {
|
||||
myPaint = Paint()..color = const Color.fromRGBO(192, 33, 39, 1);
|
||||
} else if (sortby == 'sortByY'
|
||||
? yvalue![currentSegmentIndex] == 42
|
||||
: xvalue![currentSegmentIndex] == 'Twitter') {
|
||||
myPaint = Paint()..color = const Color.fromRGBO(26, 157, 235, 1);
|
||||
} else if (sortby == 'sortByY'
|
||||
? yvalue![currentSegmentIndex] == 63
|
||||
: xvalue![currentSegmentIndex] == 'Instagram') {
|
||||
myPaint = fillPaint;
|
||||
} else if (sortby == 'sortByY'
|
||||
? yvalue![currentSegmentIndex] == 61
|
||||
: xvalue![currentSegmentIndex] == 'Snapchat') {
|
||||
myPaint = Paint()..color = const Color.fromRGBO(254, 250, 55, 1);
|
||||
} else if (sortby == 'sortByY'
|
||||
? yvalue![currentSegmentIndex] == 74
|
||||
: xvalue![currentSegmentIndex] == 'Facebook') {
|
||||
myPaint = Paint()..color = const Color.fromRGBO(60, 92, 156, 1);
|
||||
}
|
||||
final Rect rect = Rect.fromLTRB(segmentRect.left, segmentRect.top,
|
||||
segmentRect.right * animationFactor, segmentRect.bottom);
|
||||
canvas.drawRect(rect, myPaint!);
|
||||
}
|
||||
}
|
||||
|
||||
Size _measureText(String textValue) {
|
||||
Size size;
|
||||
final TextPainter textPainter = TextPainter(
|
||||
textAlign: TextAlign.center,
|
||||
textDirection: TextDirection.ltr,
|
||||
text: TextSpan(text: textValue));
|
||||
textPainter.layout();
|
||||
size = Size(textPainter.width + 40, textPainter.height);
|
||||
return size;
|
||||
}
|
||||
|
|
@ -177,13 +177,6 @@ class _EventsState extends SampleViewState {
|
|||
(consoleKey.currentState)?.setState(() {});
|
||||
}
|
||||
},
|
||||
onPointTapped: (PointTapArgs args) {
|
||||
if (!isCardView) {
|
||||
actionsList.insert(
|
||||
0, 'Point (${args.pointIndex.toString()}) was tapped');
|
||||
(consoleKey.currentState)?.setState(() {});
|
||||
}
|
||||
},
|
||||
onChartTouchInteractionDown: (ChartTouchInteractionArgs args) {
|
||||
if (!isCardView) {
|
||||
actionsList.insert(0, 'Chart was tapped down');
|
||||
|
|
@ -268,13 +261,20 @@ class _EventsState extends SampleViewState {
|
|||
];
|
||||
return <ColumnSeries<ChartSampleData, String>>[
|
||||
ColumnSeries<ChartSampleData, String>(
|
||||
onPointTap: (ChartPointDetails args) {
|
||||
if (!isCardView) {
|
||||
actionsList.insert(
|
||||
0, 'Point (${args.pointIndex.toString()}) was tapped');
|
||||
(consoleKey.currentState)?.setState(() {});
|
||||
}
|
||||
},
|
||||
dataSource: chartData,
|
||||
animationDuration: 0,
|
||||
name: 'Population',
|
||||
xValueMapper: (ChartSampleData sales, _) => sales.x as String,
|
||||
yValueMapper: (ChartSampleData sales, _) => sales.y,
|
||||
markerSettings: const MarkerSettings(isVisible: true),
|
||||
dataLabelSettings: DataLabelSettings(isVisible: true),
|
||||
dataLabelSettings: const DataLabelSettings(isVisible: true),
|
||||
)
|
||||
];
|
||||
}
|
||||
|
|
|
|||
|
|
@ -220,22 +220,6 @@ class _NavigationWithEventsState extends SampleViewState {
|
|||
));
|
||||
launchHyperLink(args.value.toString());
|
||||
},
|
||||
onPointTapped: (PointTapArgs args) {
|
||||
_scaffoldKey.currentState?.showSnackBar(SnackBar(
|
||||
width: model.isWebFullView
|
||||
? _measureText(
|
||||
'Data point tapped/clicked. Navigating to the link.')
|
||||
.width
|
||||
: null,
|
||||
behavior: SnackBarBehavior.floating,
|
||||
shape: const RoundedRectangleBorder(
|
||||
borderRadius: BorderRadius.all(Radius.circular(5))),
|
||||
duration: const Duration(milliseconds: 2000),
|
||||
content:
|
||||
const Text('Data point tapped/clicked. Navigating to the link.'),
|
||||
));
|
||||
launchHyperLink(args.pointIndex.toString());
|
||||
},
|
||||
primaryXAxis: CategoryAxis(
|
||||
labelIntersectAction: isCardView
|
||||
? AxisLabelIntersectAction.multipleRows
|
||||
|
|
@ -293,11 +277,27 @@ class _NavigationWithEventsState extends SampleViewState {
|
|||
List<CartesianSeries<ChartSampleData, String>> _getDefaultSortingSeries() {
|
||||
return <BarSeries<ChartSampleData, String>>[
|
||||
BarSeries<ChartSampleData, String>(
|
||||
onPointTap: (ChartPointDetails args) {
|
||||
_scaffoldKey.currentState?.showSnackBar(SnackBar(
|
||||
width: model.isWebFullView
|
||||
? _measureText(
|
||||
'Data point tapped/clicked. Navigating to the link.')
|
||||
.width
|
||||
: null,
|
||||
behavior: SnackBarBehavior.floating,
|
||||
shape: const RoundedRectangleBorder(
|
||||
borderRadius: BorderRadius.all(Radius.circular(5))),
|
||||
duration: const Duration(milliseconds: 2000),
|
||||
content: const Text(
|
||||
'Data point tapped/clicked. Navigating to the link.'),
|
||||
));
|
||||
launchHyperLink(args.pointIndex.toString());
|
||||
},
|
||||
dataSource: _chartData,
|
||||
xValueMapper: (ChartSampleData sales, _) => sales.x as String,
|
||||
yValueMapper: (ChartSampleData sales, _) => sales.y,
|
||||
dataLabelSettings:
|
||||
DataLabelSettings(isVisible: true, offset: const Offset(-5, 0)),
|
||||
const DataLabelSettings(isVisible: true, offset: Offset(-5, 0)),
|
||||
)
|
||||
];
|
||||
}
|
||||
|
|
|
|||
|
|
@ -322,7 +322,7 @@ class _PaginationState extends SampleViewState {
|
|||
borderColor: const Color.fromRGBO(255, 204, 5, 1),
|
||||
borderWidth: 2,
|
||||
color: const Color.fromRGBO(255, 245, 211, 1),
|
||||
dataLabelSettings: DataLabelSettings(
|
||||
dataLabelSettings: const DataLabelSettings(
|
||||
isVisible: true, labelAlignment: ChartDataLabelAlignment.outer),
|
||||
xValueMapper: (ChartSampleData sales, _) => sales.xValue as String,
|
||||
yValueMapper: (ChartSampleData sales, _) => sales.y,
|
||||
|
|
|
|||
|
|
@ -103,7 +103,9 @@ class _DefaultSelectionState extends SampleViewState {
|
|||
],
|
||||
),
|
||||
),
|
||||
Column(
|
||||
Row(
|
||||
crossAxisAlignment: CrossAxisAlignment.center,
|
||||
mainAxisAlignment: MainAxisAlignment.center,
|
||||
children: <Widget>[
|
||||
Container(
|
||||
child: Padding(
|
||||
|
|
|
|||
|
|
@ -20,6 +20,7 @@ class DefaultSelection extends SampleView {
|
|||
class _DefaultSelectionState extends SampleViewState {
|
||||
_DefaultSelectionState();
|
||||
late bool _enableMultiSelect;
|
||||
late bool _toggleSelection;
|
||||
|
||||
final List<String> _modeList =
|
||||
<String>['point', 'series', 'cluster'].toList();
|
||||
|
|
@ -33,13 +34,16 @@ class _DefaultSelectionState extends SampleViewState {
|
|||
_selectedMode = 'point';
|
||||
_mode = SelectionType.point;
|
||||
_enableMultiSelect = false;
|
||||
_selectionBehavior =
|
||||
SelectionBehavior(enable: true, unselectedOpacity: 0.5);
|
||||
_toggleSelection = true;
|
||||
super.initState();
|
||||
}
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
_selectionBehavior = SelectionBehavior(
|
||||
enable: true,
|
||||
unselectedOpacity: 0.5,
|
||||
toggleSelection: _toggleSelection);
|
||||
return _buildDefaultSelectionChart();
|
||||
}
|
||||
|
||||
|
|
@ -54,6 +58,7 @@ class _DefaultSelectionState extends SampleViewState {
|
|||
children: <Widget>[
|
||||
ListTile(
|
||||
title: Text('Mode',
|
||||
softWrap: false,
|
||||
style: TextStyle(
|
||||
color: model.textColor,
|
||||
)),
|
||||
|
|
@ -79,7 +84,11 @@ class _DefaultSelectionState extends SampleViewState {
|
|||
}),
|
||||
)),
|
||||
ListTile(
|
||||
title: Text('Enable multi-selection',
|
||||
title: Text(
|
||||
model.isWebFullView
|
||||
? 'Enable multi-\nselection'
|
||||
: 'Enable multi-selection',
|
||||
softWrap: false,
|
||||
style: TextStyle(
|
||||
color: model.textColor,
|
||||
)),
|
||||
|
|
@ -97,6 +106,29 @@ class _DefaultSelectionState extends SampleViewState {
|
|||
stateSetter(() {});
|
||||
});
|
||||
}))),
|
||||
ListTile(
|
||||
title: Text(
|
||||
model.isWebFullView
|
||||
? 'Toggle \nselection'
|
||||
: 'Toggle selection',
|
||||
softWrap: false,
|
||||
style: TextStyle(
|
||||
color: model.textColor,
|
||||
)),
|
||||
trailing: Container(
|
||||
padding: EdgeInsets.only(left: 0.05 * screenWidth),
|
||||
width: 0.4 * screenWidth,
|
||||
child: CheckboxListTile(
|
||||
controlAffinity: ListTileControlAffinity.leading,
|
||||
contentPadding: EdgeInsets.zero,
|
||||
activeColor: model.backgroundColor,
|
||||
value: _toggleSelection,
|
||||
onChanged: (bool? value) {
|
||||
setState(() {
|
||||
_toggleSelection = value!;
|
||||
stateSetter(() {});
|
||||
});
|
||||
}))),
|
||||
],
|
||||
);
|
||||
});
|
||||
|
|
|
|||
|
|
@ -72,6 +72,7 @@ class _DefaultTrackballState extends SampleViewState {
|
|||
children: <Widget>[
|
||||
ListTile(
|
||||
title: Text('Mode',
|
||||
softWrap: false,
|
||||
style: TextStyle(
|
||||
color: model.textColor,
|
||||
)),
|
||||
|
|
@ -100,7 +101,9 @@ class _DefaultTrackballState extends SampleViewState {
|
|||
),
|
||||
),
|
||||
ListTile(
|
||||
title: Text('Alignment',
|
||||
title: Text(
|
||||
model.isWebFullView ? 'Alignm\nent' : 'Alignment',
|
||||
softWrap: false,
|
||||
style: TextStyle(
|
||||
color: _selectedMode != 'groupAllPoints'
|
||||
? model.textColor.withOpacity(0.3)
|
||||
|
|
@ -134,10 +137,12 @@ class _DefaultTrackballState extends SampleViewState {
|
|||
]));
|
||||
}),
|
||||
ListTile(
|
||||
title: Text('Show always ',
|
||||
style: TextStyle(
|
||||
color: model.textColor,
|
||||
)),
|
||||
title:
|
||||
Text(model.isWebFullView ? 'Show \nalways ' : 'Show always',
|
||||
softWrap: false,
|
||||
style: TextStyle(
|
||||
color: model.textColor,
|
||||
)),
|
||||
trailing: Container(
|
||||
padding: EdgeInsets.only(left: 0.05 * screenWidth),
|
||||
width: 0.6 * screenWidth,
|
||||
|
|
@ -153,8 +158,8 @@ class _DefaultTrackballState extends SampleViewState {
|
|||
});
|
||||
}))),
|
||||
ListTile(
|
||||
title:
|
||||
Text('Hide delay ', style: TextStyle(color: model.textColor)),
|
||||
title: Text(model.isWebFullView ? 'Hide \ndelay ' : 'Hide delay ',
|
||||
softWrap: false, style: TextStyle(color: model.textColor)),
|
||||
trailing: Container(
|
||||
width: 0.6 * screenWidth,
|
||||
padding: EdgeInsets.only(left: 0.03 * screenWidth),
|
||||
|
|
@ -171,7 +176,11 @@ class _DefaultTrackballState extends SampleViewState {
|
|||
),
|
||||
),
|
||||
ListTile(
|
||||
title: Text('Show track\nmarker',
|
||||
title: Text(
|
||||
model.isWebFullView
|
||||
? 'Show \ntrack\nmarker'
|
||||
: 'Show track\nmarker',
|
||||
softWrap: false,
|
||||
style: TextStyle(
|
||||
color: model.textColor,
|
||||
)),
|
||||
|
|
@ -191,7 +200,11 @@ class _DefaultTrackballState extends SampleViewState {
|
|||
})),
|
||||
),
|
||||
ListTile(
|
||||
title: Text('Show marker\nin tooltip',
|
||||
title: Text(
|
||||
model.isWebFullView
|
||||
? 'Show \nmarker\nin \ntooltip'
|
||||
: 'Show marker\nin tooltip',
|
||||
softWrap: false,
|
||||
style: TextStyle(
|
||||
color: model.textColor,
|
||||
)),
|
||||
|
|
|
|||
|
|
@ -147,7 +147,7 @@ class _TrackballTemplateState extends SampleViewState {
|
|||
/// To set the track ball as true and customized trackball behaviour.
|
||||
trackballBehavior: TrackballBehavior(
|
||||
enable: true,
|
||||
markerSettings: TrackballMarkerSettings(
|
||||
markerSettings: const TrackballMarkerSettings(
|
||||
height: 10,
|
||||
width: 10,
|
||||
borderWidth: 1,
|
||||
|
|
|
|||
|
|
@ -55,7 +55,7 @@ class _DoughnutDefaultState extends SampleViewState {
|
|||
xValueMapper: (ChartSampleData data, _) => data.x as String,
|
||||
yValueMapper: (ChartSampleData data, _) => data.y,
|
||||
dataLabelMapper: (ChartSampleData data, _) => data.text,
|
||||
dataLabelSettings: DataLabelSettings(isVisible: true))
|
||||
dataLabelSettings: const DataLabelSettings(isVisible: true))
|
||||
];
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -44,10 +44,12 @@ class _DoughnutGradientState extends SampleViewState {
|
|||
shrinkWrap: true,
|
||||
children: <Widget>[
|
||||
ListTile(
|
||||
title: Text('Gradient mode',
|
||||
style: TextStyle(
|
||||
color: model.textColor,
|
||||
)),
|
||||
title:
|
||||
Text(model.isWebFullView ? 'Gradient \nmode' : 'Gradient mode',
|
||||
softWrap: false,
|
||||
style: TextStyle(
|
||||
color: model.textColor,
|
||||
)),
|
||||
trailing: Container(
|
||||
padding: EdgeInsets.only(left: 0.07 * screenWidth),
|
||||
width: 0.5 * screenWidth,
|
||||
|
|
|
|||
|
|
@ -32,7 +32,7 @@ class _SemiDoughnutChartState extends SampleViewState {
|
|||
crossAxisAlignment: CrossAxisAlignment.center,
|
||||
mainAxisAlignment: MainAxisAlignment.start,
|
||||
children: <Widget>[
|
||||
Text('Start Angle ',
|
||||
Text('Start angle ',
|
||||
style: TextStyle(fontSize: 16.0, color: model.textColor)),
|
||||
Container(
|
||||
padding: const EdgeInsets.fromLTRB(40, 0, 0, 0),
|
||||
|
|
@ -58,7 +58,7 @@ class _SemiDoughnutChartState extends SampleViewState {
|
|||
children: <Widget>[
|
||||
Padding(
|
||||
padding: const EdgeInsets.fromLTRB(0, 15, 0, 0),
|
||||
child: Text('End Angle ',
|
||||
child: Text('End angle ',
|
||||
style: TextStyle(fontSize: 16.0, color: model.textColor)),
|
||||
),
|
||||
Container(
|
||||
|
|
@ -116,7 +116,7 @@ class _SemiDoughnutChartState extends SampleViewState {
|
|||
xValueMapper: (ChartSampleData data, _) => data.x as String,
|
||||
yValueMapper: (ChartSampleData data, _) => data.y,
|
||||
dataLabelMapper: (ChartSampleData data, _) => data.text,
|
||||
dataLabelSettings: DataLabelSettings(
|
||||
dataLabelSettings: const DataLabelSettings(
|
||||
isVisible: true, labelPosition: ChartDataLabelPosition.outside))
|
||||
];
|
||||
}
|
||||
|
|
|
|||
|
|
@ -53,7 +53,7 @@ class _PieDefaultState extends SampleViewState {
|
|||
dataLabelMapper: (ChartSampleData data, _) => data.text,
|
||||
startAngle: 90,
|
||||
endAngle: 90,
|
||||
dataLabelSettings: DataLabelSettings(isVisible: true)),
|
||||
dataLabelSettings: const DataLabelSettings(isVisible: true)),
|
||||
];
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -43,10 +43,12 @@ class _PieGradientState extends SampleViewState {
|
|||
shrinkWrap: true,
|
||||
children: <Widget>[
|
||||
ListTile(
|
||||
title: Text('Gradient mode',
|
||||
style: TextStyle(
|
||||
color: model.textColor,
|
||||
)),
|
||||
title:
|
||||
Text(model.isWebFullView ? 'Gradient \nmode' : 'Gradient mode',
|
||||
softWrap: false,
|
||||
style: TextStyle(
|
||||
color: model.textColor,
|
||||
)),
|
||||
trailing: Container(
|
||||
padding: EdgeInsets.only(left: 0.07 * screenWidth),
|
||||
width: 0.5 * screenWidth,
|
||||
|
|
@ -142,9 +144,9 @@ class _PieGradientState extends SampleViewState {
|
|||
? Colors.black.withOpacity(0.3)
|
||||
: Colors.white.withOpacity(0.3),
|
||||
strokeWidth: 1.5,
|
||||
dataLabelSettings: DataLabelSettings(
|
||||
dataLabelSettings: const DataLabelSettings(
|
||||
isVisible: true,
|
||||
textStyle: const TextStyle(fontSize: 13, color: Colors.white),
|
||||
textStyle: TextStyle(fontSize: 13, color: Colors.white),
|
||||
),
|
||||
xValueMapper: (ChartSampleData data, _) => data.x as String,
|
||||
yValueMapper: (ChartSampleData data, _) => data.y,
|
||||
|
|
|
|||
|
|
@ -93,7 +93,7 @@ class _PieGroupingState extends SampleViewState {
|
|||
PieSeries<ChartSampleData, String>(
|
||||
radius: '90%',
|
||||
dataLabelMapper: (ChartSampleData data, _) => data.x as String,
|
||||
dataLabelSettings: DataLabelSettings(
|
||||
dataLabelSettings: const DataLabelSettings(
|
||||
isVisible: true, labelPosition: ChartDataLabelPosition.inside),
|
||||
dataSource: pieData,
|
||||
startAngle: 90,
|
||||
|
|
|
|||
|
|
@ -59,7 +59,7 @@ class _PieRadiusState extends SampleViewState {
|
|||
startAngle: 100,
|
||||
endAngle: 100,
|
||||
pointRadiusMapper: (ChartSampleData data, _) => data.text,
|
||||
dataLabelSettings: DataLabelSettings(
|
||||
dataLabelSettings: const DataLabelSettings(
|
||||
isVisible: true, labelPosition: ChartDataLabelPosition.outside))
|
||||
];
|
||||
}
|
||||
|
|
|
|||
|
|
@ -51,7 +51,11 @@ class _PiePointRenderModeState extends SampleViewState {
|
|||
physics: const ClampingScrollPhysics(),
|
||||
children: <Widget>[
|
||||
ListTile(
|
||||
title: Text('Point rendering mode',
|
||||
title: Text(
|
||||
model.isWebFullView
|
||||
? 'Point \nrendering \nmode'
|
||||
: 'Point rendering mode',
|
||||
softWrap: false,
|
||||
style: TextStyle(
|
||||
color: model.textColor,
|
||||
)),
|
||||
|
|
@ -116,7 +120,7 @@ class _PiePointRenderModeState extends SampleViewState {
|
|||
PieSeries<ChartSampleData, String>(
|
||||
radius: isCardView ? '70%' : '58%',
|
||||
dataLabelMapper: (ChartSampleData data, _) => data.text,
|
||||
dataLabelSettings: DataLabelSettings(
|
||||
dataLabelSettings: const DataLabelSettings(
|
||||
isVisible: true, labelPosition: ChartDataLabelPosition.outside),
|
||||
dataSource: pieData,
|
||||
pointRenderMode: _mode,
|
||||
|
|
|
|||
|
|
@ -39,7 +39,7 @@ class _SemiPieChartState extends SampleViewState {
|
|||
crossAxisAlignment: CrossAxisAlignment.center,
|
||||
mainAxisAlignment: MainAxisAlignment.start,
|
||||
children: <Widget>[
|
||||
Text('Start Angle ',
|
||||
Text('Start angle ',
|
||||
style: TextStyle(fontSize: 16.0, color: model.textColor)),
|
||||
Container(
|
||||
padding: const EdgeInsets.fromLTRB(40, 0, 0, 0),
|
||||
|
|
@ -65,7 +65,7 @@ class _SemiPieChartState extends SampleViewState {
|
|||
children: <Widget>[
|
||||
Padding(
|
||||
padding: const EdgeInsets.fromLTRB(0, 15, 0, 0),
|
||||
child: Text('End Angle ',
|
||||
child: Text('End angle ',
|
||||
style: TextStyle(fontSize: 16.0, color: model.textColor)),
|
||||
),
|
||||
Container(
|
||||
|
|
@ -127,7 +127,7 @@ class _SemiPieChartState extends SampleViewState {
|
|||
/// it will render as semi pie chart.
|
||||
startAngle: _startAngle,
|
||||
endAngle: _endAngle,
|
||||
dataLabelSettings: DataLabelSettings(
|
||||
dataLabelSettings: const DataLabelSettings(
|
||||
isVisible: true, labelPosition: ChartDataLabelPosition.inside))
|
||||
];
|
||||
}
|
||||
|
|
|
|||
|
|
@ -70,8 +70,8 @@ class _RadialBarDefaultState extends SampleViewState {
|
|||
return <RadialBarSeries<ChartSampleData, String>>[
|
||||
RadialBarSeries<ChartSampleData, String>(
|
||||
maximumValue: 15,
|
||||
dataLabelSettings: DataLabelSettings(
|
||||
isVisible: true, textStyle: const TextStyle(fontSize: 10.0)),
|
||||
dataLabelSettings: const DataLabelSettings(
|
||||
isVisible: true, textStyle: TextStyle(fontSize: 10.0)),
|
||||
dataSource: chartData,
|
||||
cornerStyle: CornerStyle.bothCurve,
|
||||
gap: '10%',
|
||||
|
|
|
|||
|
|
@ -0,0 +1,151 @@
|
|||
/// Package import
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:intl/intl.dart';
|
||||
|
||||
/// Chart import
|
||||
import 'package:syncfusion_flutter_charts/charts.dart';
|
||||
|
||||
/// Local imports
|
||||
import '../../../../../model/sample_view.dart';
|
||||
|
||||
/// Render the radial series with legend.
|
||||
class OverfilledRadialBar extends SampleView {
|
||||
/// Creates the radial series with legend.
|
||||
const OverfilledRadialBar(Key key) : super(key: key);
|
||||
|
||||
@override
|
||||
_OverfilledRadialBarState createState() => _OverfilledRadialBarState();
|
||||
}
|
||||
|
||||
/// State class of radial series with legend.
|
||||
class _OverfilledRadialBarState extends SampleViewState {
|
||||
_OverfilledRadialBarState();
|
||||
late TooltipBehavior _tooltipBehavior;
|
||||
final List<_ChartData> chartData = <_ChartData>[
|
||||
_ChartData(
|
||||
'Low \n3.5k/6k', 3500, const Color.fromRGBO(235, 97, 143, 1), 'Low'),
|
||||
_ChartData('Average \n7.2k/6k', 7200,
|
||||
const Color.fromRGBO(145, 132, 202, 1), 'Average'),
|
||||
_ChartData('High \n10.5k/6k', 10500, const Color.fromRGBO(69, 187, 161, 1),
|
||||
'High'),
|
||||
];
|
||||
|
||||
@override
|
||||
void initState() {
|
||||
_tooltipBehavior = TooltipBehavior(enable: true);
|
||||
super.initState();
|
||||
}
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return _buildAngleRadialBarChart();
|
||||
}
|
||||
|
||||
/// Retunrs the circular charts with radial series.
|
||||
SfCircularChart _buildAngleRadialBarChart() {
|
||||
final Orientation orientation = MediaQuery.of(context).orientation;
|
||||
return SfCircularChart(
|
||||
key: GlobalKey(),
|
||||
legend: Legend(
|
||||
toggleSeriesVisibility: false,
|
||||
isVisible: !isCardView,
|
||||
iconHeight: 20,
|
||||
iconWidth: 20,
|
||||
overflowMode: LegendItemOverflowMode.wrap),
|
||||
title:
|
||||
ChartTitle(text: isCardView ? '' : 'Monthly steps count tracker'),
|
||||
annotations: <CircularChartAnnotation>[
|
||||
CircularChartAnnotation(
|
||||
angle: 0,
|
||||
radius: '0%',
|
||||
height: isCardView
|
||||
? '45%'
|
||||
: model.isWeb
|
||||
? '30%'
|
||||
: '35%',
|
||||
width: isCardView || orientation == Orientation.landscape
|
||||
? '65%'
|
||||
: '55%',
|
||||
widget: Container(
|
||||
child: Column(
|
||||
children: <Widget>[
|
||||
Padding(
|
||||
padding: EdgeInsets.only(
|
||||
top: model.isWeb || model.isDesktop
|
||||
? 5
|
||||
: model.isWebFullView
|
||||
? 15
|
||||
: 0),
|
||||
child: Text('Goal -',
|
||||
style: TextStyle(
|
||||
fontWeight: FontWeight.bold,
|
||||
fontSize:
|
||||
model.isWeb || model.isDesktop ? 20 : 15))),
|
||||
Padding(
|
||||
padding: EdgeInsets.only(
|
||||
top: model.isAndroid &&
|
||||
!isCardView &&
|
||||
orientation == Orientation.landscape
|
||||
? 0
|
||||
: isCardView ||
|
||||
orientation == Orientation.landscape
|
||||
? 0
|
||||
: 10)),
|
||||
Text('6k steps/day',
|
||||
softWrap: false,
|
||||
style: TextStyle(
|
||||
fontWeight: FontWeight.bold,
|
||||
fontSize:
|
||||
isCardView || orientation == Orientation.landscape
|
||||
? 10
|
||||
: 14))
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
series: _getRadialBarSeries(),
|
||||
tooltipBehavior: _tooltipBehavior,
|
||||
onTooltipRender: (TooltipArgs args) {
|
||||
final NumberFormat numberFormat = NumberFormat.compactCurrency(
|
||||
decimalDigits: 2,
|
||||
symbol: '',
|
||||
);
|
||||
// ignore: cast_nullable_to_non_nullable
|
||||
args.text = chartData[args.pointIndex as int].text +
|
||||
' : ' +
|
||||
numberFormat
|
||||
// ignore: cast_nullable_to_non_nullable
|
||||
.format(chartData[args.pointIndex as int].y)
|
||||
.toString();
|
||||
});
|
||||
}
|
||||
|
||||
/// Returns radial bar series with legend.
|
||||
List<RadialBarSeries<_ChartData, String>> _getRadialBarSeries() {
|
||||
final List<RadialBarSeries<_ChartData, String>> list =
|
||||
<RadialBarSeries<_ChartData, String>>[
|
||||
RadialBarSeries<_ChartData, String>(
|
||||
maximumValue: 6000,
|
||||
radius: '100%',
|
||||
gap: '3%',
|
||||
dataSource: chartData,
|
||||
cornerStyle: CornerStyle.bothCurve,
|
||||
xValueMapper: (_ChartData data, _) => data.x,
|
||||
yValueMapper: (_ChartData data, _) => data.y,
|
||||
pointColorMapper: (_ChartData data, _) => data.color,
|
||||
dataLabelMapper: (_ChartData data, _) => data.text,
|
||||
dataLabelSettings: const DataLabelSettings(isVisible: true))
|
||||
];
|
||||
return list;
|
||||
}
|
||||
}
|
||||
|
||||
class _ChartData {
|
||||
_ChartData(this.x, this.y, this.color, this.text);
|
||||
|
||||
final String x;
|
||||
final num? y;
|
||||
final Color color;
|
||||
final String text;
|
||||
}
|
||||
|
|
@ -81,8 +81,8 @@ class _RadialBarGradientState extends SampleViewState {
|
|||
return <RadialBarSeries<_ChartShaderData, String>>[
|
||||
RadialBarSeries<_ChartShaderData, String>(
|
||||
maximumValue: 15,
|
||||
dataLabelSettings: DataLabelSettings(
|
||||
isVisible: true, textStyle: const TextStyle(fontSize: 10.0)),
|
||||
dataLabelSettings: const DataLabelSettings(
|
||||
isVisible: true, textStyle: TextStyle(fontSize: 10.0)),
|
||||
dataSource: chartData,
|
||||
cornerStyle: CornerStyle.bothCurve,
|
||||
gap: '10%',
|
||||
|
|
|
|||
|
|
@ -85,7 +85,7 @@ class _RadialBarAngleState extends SampleViewState {
|
|||
yValueMapper: (ChartSampleData data, _) => data.y,
|
||||
pointColorMapper: (ChartSampleData data, _) => data.pointColor,
|
||||
dataLabelMapper: (ChartSampleData data, _) => data.text,
|
||||
dataLabelSettings: DataLabelSettings(isVisible: true))
|
||||
dataLabelSettings: const DataLabelSettings(isVisible: true))
|
||||
];
|
||||
return list;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -152,7 +152,7 @@ class _ExportState extends SampleViewState {
|
|||
strokeWidth: 1,
|
||||
legendIconType: LegendIconType.rectangle,
|
||||
dataLabelMapper: (ChartSampleData sales, _) => sales.text,
|
||||
dataLabelSettings: DataLabelSettings(isVisible: true))
|
||||
dataLabelSettings: const DataLabelSettings(isVisible: true))
|
||||
];
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -55,7 +55,7 @@ class _LegendDefaultState extends SampleViewState {
|
|||
yValueMapper: (ChartSampleData data, _) => data.y,
|
||||
startAngle: 90,
|
||||
endAngle: 90,
|
||||
dataLabelSettings: DataLabelSettings(
|
||||
dataLabelSettings: const DataLabelSettings(
|
||||
isVisible: true, labelPosition: ChartDataLabelPosition.outside)),
|
||||
];
|
||||
}
|
||||
|
|
|
|||
|
|
@ -0,0 +1,167 @@
|
|||
/// Package imports
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter_examples/widgets/custom_button.dart';
|
||||
|
||||
/// Chart import
|
||||
import 'package:syncfusion_flutter_charts/charts.dart';
|
||||
|
||||
/// Local imports
|
||||
import '../../../../model/sample_view.dart';
|
||||
|
||||
/// Renders the stacked area chart sample.
|
||||
class CircularFloatingLegend extends SampleView {
|
||||
/// Creates the stacked area chart sample.
|
||||
const CircularFloatingLegend(Key key) : super(key: key);
|
||||
|
||||
@override
|
||||
_CircularFloatingLegendState createState() => _CircularFloatingLegendState();
|
||||
}
|
||||
|
||||
/// State class of the stacked area chart.
|
||||
class _CircularFloatingLegendState extends SampleViewState {
|
||||
_CircularFloatingLegendState();
|
||||
|
||||
final List<String> _position =
|
||||
<String>['left', 'right', 'top', 'bottom', 'center'].toList();
|
||||
late String _selectedPosition;
|
||||
late double _xValue;
|
||||
late double _yValue;
|
||||
@override
|
||||
void initState() {
|
||||
_selectedPosition = 'left';
|
||||
_xValue = 100;
|
||||
_yValue = 100;
|
||||
super.initState();
|
||||
}
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return _buildCircularChart();
|
||||
}
|
||||
|
||||
@override
|
||||
Widget buildSettings(BuildContext context) {
|
||||
final double screenWidth =
|
||||
model.isWebFullView ? 245 : MediaQuery.of(context).size.width;
|
||||
return StatefulBuilder(
|
||||
builder: (BuildContext context, StateSetter stateSetter) {
|
||||
return ListView(
|
||||
shrinkWrap: true,
|
||||
children: <Widget>[
|
||||
ListTile(
|
||||
title: Text('Position',
|
||||
style: TextStyle(
|
||||
color: model.textColor,
|
||||
)),
|
||||
trailing: Container(
|
||||
padding: EdgeInsets.only(left: 0.07 * screenWidth),
|
||||
width: 0.4 * screenWidth,
|
||||
height: 50,
|
||||
alignment: Alignment.center,
|
||||
child: DropdownButton<String>(
|
||||
isExpanded: true,
|
||||
underline:
|
||||
Container(color: const Color(0xFFBDBDBD), height: 1),
|
||||
value: _selectedPosition,
|
||||
items: _position.map((String value) {
|
||||
return DropdownMenuItem<String>(
|
||||
value: (value != null) ? value : 'left',
|
||||
child: Text(value,
|
||||
style: TextStyle(color: model.textColor)));
|
||||
}).toList(),
|
||||
onChanged: (dynamic value) {
|
||||
_selectedPosition = value.toString();
|
||||
stateSetter(() {});
|
||||
}),
|
||||
)),
|
||||
ListTile(
|
||||
title: Text('X offset',
|
||||
style: TextStyle(
|
||||
color: model.textColor,
|
||||
)),
|
||||
trailing: Container(
|
||||
width: 0.4 * screenWidth,
|
||||
child: CustomDirectionalButtons(
|
||||
minValue: 100,
|
||||
maxValue: 300,
|
||||
initialValue: _xValue,
|
||||
onChanged: (double val) => setState(() {
|
||||
_xValue = val;
|
||||
}),
|
||||
step: 10,
|
||||
iconColor: model.textColor,
|
||||
style: TextStyle(fontSize: 20.0, color: model.textColor),
|
||||
))),
|
||||
ListTile(
|
||||
title: Text('Y offset',
|
||||
style: TextStyle(
|
||||
color: model.textColor,
|
||||
)),
|
||||
trailing: Container(
|
||||
width: 0.4 * screenWidth,
|
||||
child: CustomDirectionalButtons(
|
||||
minValue: 100,
|
||||
maxValue: 300,
|
||||
initialValue: _yValue,
|
||||
onChanged: (double val) => setState(() {
|
||||
_yValue = val;
|
||||
}),
|
||||
step: 10,
|
||||
iconColor: model.textColor,
|
||||
style: TextStyle(fontSize: 20.0, color: model.textColor),
|
||||
))),
|
||||
],
|
||||
);
|
||||
});
|
||||
}
|
||||
|
||||
/// Returns the cartesian stacked area chart.
|
||||
SfCircularChart _buildCircularChart() {
|
||||
return SfCircularChart(
|
||||
tooltipBehavior: TooltipBehavior(enable: true),
|
||||
title: ChartTitle(
|
||||
text: isCardView ? '' : 'Sales comparision of fruits in a shop'),
|
||||
series: _getStackedAreaSeries(),
|
||||
annotations: <CircularChartAnnotation>[
|
||||
CircularChartAnnotation(
|
||||
widget: Container(
|
||||
height: 80,
|
||||
width: 80,
|
||||
child: const Text(
|
||||
'Floating',
|
||||
style: TextStyle(fontSize: 14, fontWeight: FontWeight.bold),
|
||||
)),
|
||||
)
|
||||
],
|
||||
);
|
||||
}
|
||||
|
||||
/// Returns the list of chart series which need to render
|
||||
/// on the stacked area chart.
|
||||
List<PieSeries<ChartSampleData, String>> _getStackedAreaSeries() {
|
||||
final List<ChartSampleData> chartData = <ChartSampleData>[
|
||||
ChartSampleData(x: 'Medical Care', y: 8.49),
|
||||
ChartSampleData(x: 'Housing', y: 2.40),
|
||||
ChartSampleData(x: 'Transportation', y: 4.44),
|
||||
ChartSampleData(x: 'Education', y: 3.11),
|
||||
ChartSampleData(x: 'Electronics', y: 3.06),
|
||||
ChartSampleData(x: 'Other Personal', y: 78.4),
|
||||
];
|
||||
return <PieSeries<ChartSampleData, String>>[
|
||||
PieSeries<ChartSampleData, String>(
|
||||
animationDuration: 2500,
|
||||
startAngle: 120,
|
||||
endAngle: 120,
|
||||
explodeAll: true,
|
||||
explodeOffset: '3%',
|
||||
dataSource: chartData,
|
||||
enableSmartLabels: false,
|
||||
explode: true,
|
||||
enableTooltip: true,
|
||||
dataLabelSettings: const DataLabelSettings(
|
||||
isVisible: true, labelPosition: ChartDataLabelPosition.outside),
|
||||
xValueMapper: (ChartSampleData sales, _) => sales.x as String,
|
||||
yValueMapper: (ChartSampleData sales, _) => sales.y),
|
||||
];
|
||||
}
|
||||
}
|
||||
|
|
@ -1,5 +1,6 @@
|
|||
/// Package import
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter_examples/widgets/custom_button.dart';
|
||||
|
||||
/// Chart import
|
||||
import 'package:syncfusion_flutter_charts/charts.dart';
|
||||
|
|
@ -27,6 +28,8 @@ class _LegendOptionsState extends SampleViewState {
|
|||
final List<String> _modeList = <String>['wrap', 'scroll', 'none'].toList();
|
||||
String _selectedMode = 'wrap';
|
||||
LegendItemOverflowMode _overflowMode = LegendItemOverflowMode.wrap;
|
||||
late double _xOffset = double.nan;
|
||||
late double _yOffset = double.nan;
|
||||
|
||||
@override
|
||||
Widget buildSettings(BuildContext context) {
|
||||
|
|
@ -39,6 +42,7 @@ class _LegendOptionsState extends SampleViewState {
|
|||
children: <Widget>[
|
||||
ListTile(
|
||||
title: Text('Position ',
|
||||
softWrap: false,
|
||||
style: TextStyle(
|
||||
color: model.textColor,
|
||||
)),
|
||||
|
|
@ -64,10 +68,12 @@ class _LegendOptionsState extends SampleViewState {
|
|||
),
|
||||
),
|
||||
ListTile(
|
||||
title: Text('Overflow mode',
|
||||
style: TextStyle(
|
||||
color: model.textColor,
|
||||
)),
|
||||
title:
|
||||
Text(model.isWebFullView ? 'Overflow \nmode' : 'Overflow mode',
|
||||
softWrap: false,
|
||||
style: TextStyle(
|
||||
color: model.textColor,
|
||||
)),
|
||||
trailing: Container(
|
||||
padding: EdgeInsets.only(left: 0.07 * screenWidth),
|
||||
width: 0.4 * screenWidth,
|
||||
|
|
@ -89,7 +95,11 @@ class _LegendOptionsState extends SampleViewState {
|
|||
})),
|
||||
),
|
||||
ListTile(
|
||||
title: Text('Toggle visibility',
|
||||
title: Text(
|
||||
model.isWebFullView
|
||||
? 'Toggle \nvisibility'
|
||||
: 'Toggle visibility',
|
||||
softWrap: false,
|
||||
style: TextStyle(
|
||||
color: model.textColor,
|
||||
)),
|
||||
|
|
@ -108,6 +118,48 @@ class _LegendOptionsState extends SampleViewState {
|
|||
});
|
||||
})),
|
||||
),
|
||||
ListTile(
|
||||
title: Text('X offset',
|
||||
style: TextStyle(
|
||||
color: model.textColor,
|
||||
)),
|
||||
trailing: Container(
|
||||
width: 0.4 * screenWidth,
|
||||
height: 50,
|
||||
child: CustomDirectionalButtons(
|
||||
minValue: -100,
|
||||
maxValue: 100,
|
||||
needNull: true,
|
||||
initialValue: _xOffset,
|
||||
onChanged: (double val) => setState(() {
|
||||
_xOffset = val;
|
||||
}),
|
||||
step: 10,
|
||||
iconColor: model.textColor,
|
||||
style: TextStyle(fontSize: 16.0, color: model.textColor),
|
||||
),
|
||||
)),
|
||||
ListTile(
|
||||
title: Text('Y offset',
|
||||
style: TextStyle(
|
||||
color: model.textColor,
|
||||
)),
|
||||
trailing: Container(
|
||||
width: 0.4 * screenWidth,
|
||||
height: 50,
|
||||
child: CustomDirectionalButtons(
|
||||
minValue: -100,
|
||||
maxValue: 100,
|
||||
needNull: true,
|
||||
initialValue: _yOffset,
|
||||
onChanged: (double val) => setState(() {
|
||||
_yOffset = val;
|
||||
}),
|
||||
step: 10,
|
||||
iconColor: model.textColor,
|
||||
style: TextStyle(fontSize: 16.0, color: model.textColor),
|
||||
),
|
||||
)),
|
||||
],
|
||||
);
|
||||
});
|
||||
|
|
@ -125,6 +177,9 @@ class _LegendOptionsState extends SampleViewState {
|
|||
legend: Legend(
|
||||
isVisible: true,
|
||||
position: _position,
|
||||
offset: (_xOffset.isNaN || _yOffset.isNaN)
|
||||
? null
|
||||
: Offset(_xOffset, _yOffset),
|
||||
overflowMode: _overflowMode,
|
||||
toggleSeriesVisibility: toggleVisibility),
|
||||
series: _getLegendOptionsSeries(),
|
||||
|
|
@ -149,7 +204,7 @@ class _LegendOptionsState extends SampleViewState {
|
|||
yValueMapper: (ChartSampleData data, _) => data.y,
|
||||
startAngle: 90,
|
||||
endAngle: 90,
|
||||
dataLabelSettings: DataLabelSettings(isVisible: true)),
|
||||
dataLabelSettings: const DataLabelSettings(isVisible: true)),
|
||||
];
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -39,6 +39,7 @@ class _CircularSelectionState extends SampleViewState {
|
|||
child: Row(
|
||||
children: <Widget>[
|
||||
Text('Point index ',
|
||||
softWrap: false,
|
||||
style: TextStyle(
|
||||
color: model.textColor,
|
||||
fontSize: 16,
|
||||
|
|
@ -64,7 +65,7 @@ class _CircularSelectionState extends SampleViewState {
|
|||
),
|
||||
);
|
||||
}),
|
||||
Column(
|
||||
Row(
|
||||
crossAxisAlignment: CrossAxisAlignment.center,
|
||||
mainAxisAlignment: MainAxisAlignment.center,
|
||||
children: <Widget>[
|
||||
|
|
@ -126,7 +127,7 @@ class _CircularSelectionState extends SampleViewState {
|
|||
dataLabelMapper: (ChartSampleData data, _) => data.x as String,
|
||||
startAngle: 100,
|
||||
endAngle: 100,
|
||||
dataLabelSettings: DataLabelSettings(
|
||||
dataLabelSettings: const DataLabelSettings(
|
||||
isVisible: true, labelPosition: ChartDataLabelPosition.outside),
|
||||
selectionBehavior: selectionBehavior)
|
||||
];
|
||||
|
|
|
|||
|
|
@ -21,35 +21,63 @@ class _CircularSelectionState extends SampleViewState {
|
|||
late SelectionBehavior selectionBehavior;
|
||||
|
||||
bool enableMultiSelect = false;
|
||||
|
||||
@override
|
||||
void initState() {
|
||||
selectionBehavior = SelectionBehavior(enable: true);
|
||||
super.initState();
|
||||
}
|
||||
bool _toggleSelection = true;
|
||||
|
||||
@override
|
||||
Widget buildSettings(BuildContext context) {
|
||||
final double screenWidth =
|
||||
model.isWebFullView ? 245 : MediaQuery.of(context).size.width;
|
||||
return StatefulBuilder(
|
||||
builder: (BuildContext context, StateSetter stateSetter) {
|
||||
return Row(
|
||||
return ListView(
|
||||
shrinkWrap: true,
|
||||
children: <Widget>[
|
||||
Text('Enable multi-selection ',
|
||||
style: TextStyle(
|
||||
color: model.textColor,
|
||||
fontSize: 16,
|
||||
)),
|
||||
Container(
|
||||
width: 90,
|
||||
child: CheckboxListTile(
|
||||
activeColor: model.backgroundColor,
|
||||
value: enableMultiSelect,
|
||||
onChanged: (bool? value) {
|
||||
setState(() {
|
||||
enableMultiSelect = value!;
|
||||
stateSetter(() {});
|
||||
});
|
||||
}))
|
||||
ListTile(
|
||||
title: Text(
|
||||
model.isWebFullView
|
||||
? 'Enable multi-\nselection'
|
||||
: 'Enable multi-selection',
|
||||
softWrap: false,
|
||||
style: TextStyle(
|
||||
color: model.textColor,
|
||||
)),
|
||||
trailing: Container(
|
||||
padding: EdgeInsets.only(left: 0.05 * screenWidth),
|
||||
width: 0.4 * screenWidth,
|
||||
child: CheckboxListTile(
|
||||
controlAffinity: ListTileControlAffinity.leading,
|
||||
contentPadding: EdgeInsets.zero,
|
||||
activeColor: model.backgroundColor,
|
||||
value: enableMultiSelect,
|
||||
onChanged: (bool? value) {
|
||||
setState(() {
|
||||
enableMultiSelect = value!;
|
||||
stateSetter(() {});
|
||||
});
|
||||
}))),
|
||||
ListTile(
|
||||
title: Text(
|
||||
model.isWebFullView
|
||||
? 'Toggle \nselection'
|
||||
: 'Toggle selection',
|
||||
softWrap: false,
|
||||
style: TextStyle(
|
||||
color: model.textColor,
|
||||
)),
|
||||
trailing: Container(
|
||||
padding: EdgeInsets.only(left: 0.05 * screenWidth),
|
||||
width: 0.4 * screenWidth,
|
||||
child: CheckboxListTile(
|
||||
controlAffinity: ListTileControlAffinity.leading,
|
||||
contentPadding: EdgeInsets.zero,
|
||||
activeColor: model.backgroundColor,
|
||||
value: _toggleSelection,
|
||||
onChanged: (bool? value) {
|
||||
setState(() {
|
||||
_toggleSelection = value!;
|
||||
stateSetter(() {});
|
||||
});
|
||||
}))),
|
||||
],
|
||||
);
|
||||
});
|
||||
|
|
@ -57,6 +85,8 @@ class _CircularSelectionState extends SampleViewState {
|
|||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
selectionBehavior =
|
||||
SelectionBehavior(enable: true, toggleSelection: _toggleSelection);
|
||||
return _buildCircularSelectionChart();
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -137,7 +137,7 @@ class _PieTooltipPositionState extends SampleViewState {
|
|||
startAngle: 100,
|
||||
endAngle: 100,
|
||||
pointRadiusMapper: (ChartSampleData data, _) => data.text,
|
||||
dataLabelSettings: DataLabelSettings(
|
||||
dataLabelSettings: const DataLabelSettings(
|
||||
isVisible: true, labelPosition: ChartDataLabelPosition.outside))
|
||||
];
|
||||
}
|
||||
|
|
|
|||
|
|
@ -34,8 +34,8 @@ class _FunnelDefaultState extends SampleViewState {
|
|||
shrinkWrap: true,
|
||||
children: <Widget>[
|
||||
ListTile(
|
||||
title:
|
||||
Text('Gap ratio ', style: TextStyle(color: model.textColor)),
|
||||
title: Text('Gap ratio ',
|
||||
softWrap: false, style: TextStyle(color: model.textColor)),
|
||||
trailing: Container(
|
||||
padding: EdgeInsets.only(left: 0.03 * screenWidth),
|
||||
width: 0.5 * screenWidth,
|
||||
|
|
@ -52,8 +52,8 @@ class _FunnelDefaultState extends SampleViewState {
|
|||
),
|
||||
),
|
||||
ListTile(
|
||||
title:
|
||||
Text('Neck height ', style: TextStyle(color: model.textColor)),
|
||||
title: Text(model.isWebFullView ? 'Neck \nheight' : 'Neck height ',
|
||||
softWrap: false, style: TextStyle(color: model.textColor)),
|
||||
trailing: Container(
|
||||
padding: EdgeInsets.only(left: 0.03 * screenWidth),
|
||||
width: 0.5 * screenWidth,
|
||||
|
|
@ -70,7 +70,8 @@ class _FunnelDefaultState extends SampleViewState {
|
|||
),
|
||||
),
|
||||
ListTile(
|
||||
title: Text('Neck width', style: TextStyle(color: model.textColor)),
|
||||
title: Text('Neck width',
|
||||
softWrap: false, style: TextStyle(color: model.textColor)),
|
||||
trailing: Container(
|
||||
padding: EdgeInsets.only(left: 0.03 * screenWidth),
|
||||
width: 0.5 * screenWidth,
|
||||
|
|
@ -88,6 +89,7 @@ class _FunnelDefaultState extends SampleViewState {
|
|||
),
|
||||
ListTile(
|
||||
title: Text('Explode',
|
||||
softWrap: false,
|
||||
style: TextStyle(
|
||||
color: model.textColor,
|
||||
)),
|
||||
|
|
@ -148,6 +150,6 @@ class _FunnelDefaultState extends SampleViewState {
|
|||
gapRatio: isCardView ? 0 : gapRatio,
|
||||
neckHeight: isCardView ? '20%' : neckHeight.toString() + '%',
|
||||
neckWidth: isCardView ? '20%' : neckWidth.toString() + '%',
|
||||
dataLabelSettings: DataLabelSettings(isVisible: true));
|
||||
dataLabelSettings: const DataLabelSettings(isVisible: true));
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -37,8 +37,8 @@ class _FunnelSmartLabelState extends SampleViewState {
|
|||
shrinkWrap: true,
|
||||
children: <Widget>[
|
||||
ListTile(
|
||||
title: Text('Label Position ',
|
||||
style: TextStyle(color: model.textColor)),
|
||||
title: Text('Label position ',
|
||||
softWrap: false, style: TextStyle(color: model.textColor)),
|
||||
trailing: Container(
|
||||
padding: EdgeInsets.only(left: 0.07 * screenWidth),
|
||||
width: 0.4 * screenWidth,
|
||||
|
|
@ -61,7 +61,9 @@ class _FunnelSmartLabelState extends SampleViewState {
|
|||
),
|
||||
),
|
||||
ListTile(
|
||||
title: Text('Smart label mode',
|
||||
title: Text(
|
||||
model.isWebFullView ? 'Smart label \nmode' : 'Smart label mode',
|
||||
softWrap: false,
|
||||
style: TextStyle(
|
||||
color: model.textColor,
|
||||
)),
|
||||
|
|
|
|||
|
|
@ -19,9 +19,9 @@ class PyramidDefault extends SampleView {
|
|||
|
||||
class _PyramidDefaultState extends SampleViewState {
|
||||
_PyramidDefaultState();
|
||||
final List<String> _pyramidMode = <String>['Linear', 'Surface'].toList();
|
||||
final List<String> _pyramidMode = <String>['linear', 'surface'].toList();
|
||||
PyramidMode _selectedPyramidMode = PyramidMode.linear;
|
||||
String _selectedMode = 'Linear';
|
||||
String _selectedMode = 'linear';
|
||||
double gapRatio = 0;
|
||||
bool explode = false;
|
||||
|
||||
|
|
@ -35,8 +35,8 @@ class _PyramidDefaultState extends SampleViewState {
|
|||
shrinkWrap: true,
|
||||
children: <Widget>[
|
||||
ListTile(
|
||||
title:
|
||||
Text('Pyramid mode', style: TextStyle(color: model.textColor)),
|
||||
title: Text(model.isWebFullView ? 'Pyramid \nmode' : 'Pyramid mode',
|
||||
softWrap: false, style: TextStyle(color: model.textColor)),
|
||||
trailing: Container(
|
||||
padding: EdgeInsets.only(left: 0.07 * screenWidth),
|
||||
width: 0.5 * screenWidth,
|
||||
|
|
@ -48,7 +48,7 @@ class _PyramidDefaultState extends SampleViewState {
|
|||
value: _selectedMode,
|
||||
items: _pyramidMode.map((String value) {
|
||||
return DropdownMenuItem<String>(
|
||||
value: (value != null) ? value : 'Linear',
|
||||
value: (value != null) ? value : 'linear',
|
||||
child: Text(value,
|
||||
style: TextStyle(color: model.textColor)));
|
||||
}).toList(),
|
||||
|
|
@ -59,7 +59,8 @@ class _PyramidDefaultState extends SampleViewState {
|
|||
),
|
||||
),
|
||||
ListTile(
|
||||
title: Text('Gap ratio', style: TextStyle(color: model.textColor)),
|
||||
title: Text('Gap ratio',
|
||||
softWrap: false, style: TextStyle(color: model.textColor)),
|
||||
trailing: Container(
|
||||
padding: EdgeInsets.only(left: 0.03 * screenWidth),
|
||||
width: 0.5 * screenWidth,
|
||||
|
|
@ -77,6 +78,7 @@ class _PyramidDefaultState extends SampleViewState {
|
|||
),
|
||||
ListTile(
|
||||
title: Text('Explode',
|
||||
softWrap: false,
|
||||
style: TextStyle(
|
||||
color: model.textColor,
|
||||
)),
|
||||
|
|
@ -133,7 +135,7 @@ class _PyramidDefaultState extends SampleViewState {
|
|||
pyramidMode: isCardView ? PyramidMode.linear : _selectedPyramidMode,
|
||||
xValueMapper: (ChartSampleData data, _) => data.x as String,
|
||||
yValueMapper: (ChartSampleData data, _) => data.y,
|
||||
dataLabelSettings: DataLabelSettings(
|
||||
dataLabelSettings: const DataLabelSettings(
|
||||
isVisible: true,
|
||||
));
|
||||
}
|
||||
|
|
@ -141,9 +143,9 @@ class _PyramidDefaultState extends SampleViewState {
|
|||
/// Change the pyramid mode
|
||||
void _onPyramidModeChange(String item) {
|
||||
_selectedMode = item;
|
||||
if (_selectedMode == 'Linear') {
|
||||
if (_selectedMode == 'linear') {
|
||||
_selectedPyramidMode = PyramidMode.linear;
|
||||
} else if (_selectedMode == 'Surface') {
|
||||
} else if (_selectedMode == 'surface') {
|
||||
_selectedPyramidMode = PyramidMode.surface;
|
||||
}
|
||||
setState(() {
|
||||
|
|
|
|||
|
|
@ -39,7 +39,7 @@ class _PyramidSmartLabelState extends SampleViewState {
|
|||
children: <Widget>[
|
||||
ListTile(
|
||||
title: Text('Label position ',
|
||||
style: TextStyle(color: model.textColor)),
|
||||
softWrap: false, style: TextStyle(color: model.textColor)),
|
||||
trailing: Container(
|
||||
padding: EdgeInsets.only(left: 0.07 * screenWidth),
|
||||
width: 0.4 * screenWidth,
|
||||
|
|
@ -62,7 +62,9 @@ class _PyramidSmartLabelState extends SampleViewState {
|
|||
),
|
||||
),
|
||||
ListTile(
|
||||
title: Text('Smart label mode',
|
||||
title: Text(
|
||||
model.isWebFullView ? 'Smart label \nmode' : 'Smart label mode',
|
||||
softWrap: false,
|
||||
style: TextStyle(
|
||||
color: model.textColor,
|
||||
)),
|
||||
|
|
|
|||
|
|
@ -41,7 +41,7 @@ class _ConditionalStylingDataGridState extends SampleViewState {
|
|||
source: conditionalStyleDataGridSource,
|
||||
columnWidthMode: ColumnWidthMode.fill,
|
||||
columns: <GridColumn>[
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'name',
|
||||
width:
|
||||
(isWebOrDesktop && model.isMobileResolution) ? 150 : double.nan,
|
||||
|
|
@ -54,7 +54,7 @@ class _ConditionalStylingDataGridState extends SampleViewState {
|
|||
),
|
||||
),
|
||||
),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'qs1',
|
||||
width:
|
||||
(isWebOrDesktop && model.isMobileResolution) ? 150 : double.nan,
|
||||
|
|
@ -68,7 +68,7 @@ class _ConditionalStylingDataGridState extends SampleViewState {
|
|||
),
|
||||
),
|
||||
),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'qs2',
|
||||
width:
|
||||
(isWebOrDesktop && model.isMobileResolution) ? 150 : double.nan,
|
||||
|
|
@ -82,7 +82,7 @@ class _ConditionalStylingDataGridState extends SampleViewState {
|
|||
),
|
||||
),
|
||||
),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'qs3',
|
||||
width:
|
||||
(isWebOrDesktop && model.isMobileResolution) ? 150 : double.nan,
|
||||
|
|
@ -96,7 +96,7 @@ class _ConditionalStylingDataGridState extends SampleViewState {
|
|||
),
|
||||
),
|
||||
),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'qs4',
|
||||
width:
|
||||
(isWebOrDesktop && model.isMobileResolution) ? 150 : double.nan,
|
||||
|
|
|
|||
|
|
@ -1,17 +1,18 @@
|
|||
///Dart import
|
||||
import 'dart:math' as math;
|
||||
|
||||
import 'package:flutter/foundation.dart';
|
||||
|
||||
/// Package imports
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:intl/intl.dart';
|
||||
import 'package:flutter/foundation.dart';
|
||||
|
||||
/// Barcode import
|
||||
import 'package:syncfusion_flutter_datagrid/datagrid.dart';
|
||||
|
||||
///Core theme import
|
||||
import 'package:syncfusion_flutter_core/theme.dart';
|
||||
|
||||
/// Barcode import
|
||||
import 'package:syncfusion_flutter_datagrid/datagrid.dart';
|
||||
|
||||
/// Local import
|
||||
import '../../../../model/model.dart';
|
||||
import '../../../../model/sample_view.dart';
|
||||
|
|
@ -47,25 +48,25 @@ class _StylingDataGridState extends SampleViewState {
|
|||
|
||||
/// GridLineVisibility strings for drop down widget.
|
||||
final List<String> _encoding = <String>[
|
||||
'Both',
|
||||
'Horizontal',
|
||||
'None',
|
||||
'Vertical',
|
||||
'both',
|
||||
'horizontal',
|
||||
'none',
|
||||
'vertical',
|
||||
];
|
||||
|
||||
void _onGridLinesVisibilityChanges(String item) {
|
||||
gridLinesVisibility = item;
|
||||
switch (gridLinesVisibility) {
|
||||
case 'Both':
|
||||
case 'both':
|
||||
gridLineVisibility = GridLinesVisibility.both;
|
||||
break;
|
||||
case 'Horizontal':
|
||||
case 'horizontal':
|
||||
gridLineVisibility = GridLinesVisibility.horizontal;
|
||||
break;
|
||||
case 'None':
|
||||
case 'none':
|
||||
gridLineVisibility = GridLinesVisibility.none;
|
||||
break;
|
||||
case 'Vertical':
|
||||
case 'vertical':
|
||||
gridLineVisibility = GridLinesVisibility.vertical;
|
||||
break;
|
||||
}
|
||||
|
|
@ -77,7 +78,7 @@ class _StylingDataGridState extends SampleViewState {
|
|||
TextStyle(color: Color.fromRGBO(255, 255, 255, 1));
|
||||
return isWebOrDesktop
|
||||
? <GridColumn>[
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'orderId',
|
||||
width: (isWebOrDesktop && model.isMobileResolution)
|
||||
? 110.0
|
||||
|
|
@ -92,7 +93,7 @@ class _StylingDataGridState extends SampleViewState {
|
|||
),
|
||||
),
|
||||
),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'customerId',
|
||||
width: 120.0,
|
||||
label: Container(
|
||||
|
|
@ -105,7 +106,7 @@ class _StylingDataGridState extends SampleViewState {
|
|||
),
|
||||
),
|
||||
),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'name',
|
||||
width: (isWebOrDesktop && model.isMobileResolution)
|
||||
? 110.0
|
||||
|
|
@ -120,7 +121,7 @@ class _StylingDataGridState extends SampleViewState {
|
|||
),
|
||||
),
|
||||
),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'freight',
|
||||
width: (isWebOrDesktop && model.isMobileResolution)
|
||||
? 100.0
|
||||
|
|
@ -135,7 +136,7 @@ class _StylingDataGridState extends SampleViewState {
|
|||
),
|
||||
),
|
||||
),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'city',
|
||||
width: (isWebOrDesktop && model.isMobileResolution)
|
||||
? 100.0
|
||||
|
|
@ -150,7 +151,7 @@ class _StylingDataGridState extends SampleViewState {
|
|||
),
|
||||
),
|
||||
),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'price',
|
||||
width: (isWebOrDesktop && model.isMobileResolution)
|
||||
? 115.0
|
||||
|
|
@ -167,7 +168,7 @@ class _StylingDataGridState extends SampleViewState {
|
|||
)
|
||||
]
|
||||
: <GridColumn>[
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'orderId',
|
||||
label: Container(
|
||||
padding: const EdgeInsets.all(8),
|
||||
|
|
@ -179,7 +180,7 @@ class _StylingDataGridState extends SampleViewState {
|
|||
),
|
||||
),
|
||||
),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
width: 100,
|
||||
columnName: 'customerId',
|
||||
columnWidthMode: isLandscapeInMobileView
|
||||
|
|
@ -195,7 +196,7 @@ class _StylingDataGridState extends SampleViewState {
|
|||
),
|
||||
),
|
||||
),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'name',
|
||||
label: Container(
|
||||
padding: const EdgeInsets.all(8),
|
||||
|
|
@ -207,7 +208,7 @@ class _StylingDataGridState extends SampleViewState {
|
|||
),
|
||||
),
|
||||
),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'city',
|
||||
label: Container(
|
||||
padding: const EdgeInsets.all(8),
|
||||
|
|
@ -243,7 +244,7 @@ class _StylingDataGridState extends SampleViewState {
|
|||
isWebOrDesktop = model.isWeb || model.isDesktop;
|
||||
stylingDataGridSource =
|
||||
_StylingDataGridSource(model: model, isWebOrDesktop: isWebOrDesktop);
|
||||
gridLinesVisibility = 'None';
|
||||
gridLinesVisibility = 'horizontal';
|
||||
gridLineVisibility = GridLinesVisibility.horizontal;
|
||||
panelOpen = frontPanelVisible.value;
|
||||
frontPanelVisible.addListener(_subscribeToValueNotifier);
|
||||
|
|
@ -263,11 +264,11 @@ class _StylingDataGridState extends SampleViewState {
|
|||
return ListView(shrinkWrap: true, children: <Widget>[
|
||||
ListTile(
|
||||
title: Text(
|
||||
'Grid lines visibility:',
|
||||
style: TextStyle(
|
||||
fontSize: 16.0,
|
||||
fontWeight: FontWeight.bold,
|
||||
color: model.textColor),
|
||||
model.isWebFullView
|
||||
? 'Grid lines \nvisibility'
|
||||
: 'Grid lines visibility',
|
||||
softWrap: false,
|
||||
style: TextStyle(fontSize: 16.0, color: model.textColor),
|
||||
),
|
||||
trailing: Theme(
|
||||
data: ThemeData(canvasColor: model.bottomSheetBackgroundColor),
|
||||
|
|
@ -275,7 +276,7 @@ class _StylingDataGridState extends SampleViewState {
|
|||
value: gridLinesVisibility,
|
||||
items: _encoding.map((String value) {
|
||||
return DropdownMenuItem<String>(
|
||||
value: (value != null) ? value : 'None',
|
||||
value: (value != null) ? value : 'none',
|
||||
child: Text(value,
|
||||
textAlign: TextAlign.center,
|
||||
style: TextStyle(color: model.textColor)));
|
||||
|
|
@ -296,9 +297,20 @@ class _StylingDataGridState extends SampleViewState {
|
|||
color: model.themeData.brightness == Brightness.light
|
||||
? const Color.fromRGBO(0, 0, 0, 0.26)
|
||||
: const Color.fromRGBO(255, 255, 255, 0.26));
|
||||
return BoxDecoration(
|
||||
border:
|
||||
Border(left: borderSide, right: borderSide, bottom: borderSide));
|
||||
|
||||
// Restricts the right side border when Datagrid has gridlinesVisibility
|
||||
// to both and vertical to maintains the border thickness.
|
||||
switch (gridLineVisibility) {
|
||||
case GridLinesVisibility.none:
|
||||
case GridLinesVisibility.horizontal:
|
||||
return BoxDecoration(
|
||||
border: Border(
|
||||
left: borderSide, right: borderSide, bottom: borderSide));
|
||||
case GridLinesVisibility.both:
|
||||
case GridLinesVisibility.vertical:
|
||||
return BoxDecoration(
|
||||
border: Border(left: borderSide, bottom: borderSide));
|
||||
}
|
||||
}
|
||||
|
||||
@override
|
||||
|
|
@ -314,10 +326,11 @@ class _StylingDataGridState extends SampleViewState {
|
|||
clipBehavior: Clip.antiAlias,
|
||||
elevation: 1.0,
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.all(16.0),
|
||||
child: Container(
|
||||
decoration: drawBorder(),
|
||||
child: _buildDataGrid(gridLineVisibility)))));
|
||||
padding: const EdgeInsets.all(16.0),
|
||||
child: DecoratedBox(
|
||||
decoration: drawBorder(),
|
||||
child: _buildDataGrid(gridLineVisibility)),
|
||||
)));
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -1,10 +1,11 @@
|
|||
///Dart import
|
||||
import 'dart:math' as math;
|
||||
|
||||
import 'package:flutter/foundation.dart';
|
||||
|
||||
/// Package imports
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:intl/intl.dart';
|
||||
import 'package:flutter/foundation.dart';
|
||||
|
||||
/// Barcode imports
|
||||
import 'package:syncfusion_flutter_datagrid/datagrid.dart';
|
||||
|
|
@ -40,7 +41,7 @@ class _ColumnTypesDataGridState extends SampleViewState {
|
|||
: ColumnWidthMode.fill
|
||||
: ColumnWidthMode.none,
|
||||
columns: <GridColumn>[
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'dealer',
|
||||
width: 90,
|
||||
label: Container(
|
||||
|
|
@ -51,7 +52,7 @@ class _ColumnTypesDataGridState extends SampleViewState {
|
|||
overflow: TextOverflow.ellipsis,
|
||||
),
|
||||
)),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'id',
|
||||
width: !isWebOrDesktop
|
||||
? 50
|
||||
|
|
@ -69,7 +70,7 @@ class _ColumnTypesDataGridState extends SampleViewState {
|
|||
columnWidthMode: isLandscapeInMobileView
|
||||
? ColumnWidthMode.fill
|
||||
: ColumnWidthMode.none),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'name',
|
||||
width:
|
||||
(isWebOrDesktop && model.isMobileResolution) ? 110 : double.nan,
|
||||
|
|
@ -82,7 +83,7 @@ class _ColumnTypesDataGridState extends SampleViewState {
|
|||
),
|
||||
),
|
||||
),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'freight',
|
||||
width:
|
||||
(isWebOrDesktop && model.isMobileResolution) ? 110 : double.nan,
|
||||
|
|
@ -98,7 +99,7 @@ class _ColumnTypesDataGridState extends SampleViewState {
|
|||
),
|
||||
),
|
||||
),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'shippedDate',
|
||||
width: 110,
|
||||
label: Container(
|
||||
|
|
@ -111,7 +112,7 @@ class _ColumnTypesDataGridState extends SampleViewState {
|
|||
),
|
||||
//dateFormat: DateFormat.yMd()
|
||||
),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'city',
|
||||
width: isWebOrDesktop ? 110.0 : double.nan,
|
||||
label: Container(
|
||||
|
|
@ -123,7 +124,7 @@ class _ColumnTypesDataGridState extends SampleViewState {
|
|||
),
|
||||
),
|
||||
),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'price',
|
||||
width: (isWebOrDesktop && model.isMobileResolution)
|
||||
? 120.0
|
||||
|
|
|
|||
|
|
@ -1,11 +1,11 @@
|
|||
import 'dart:math';
|
||||
|
||||
import 'package:collection/collection.dart';
|
||||
import 'package:flutter/foundation.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter_examples/model/sample_view.dart';
|
||||
import 'package:intl/intl.dart';
|
||||
import 'package:syncfusion_flutter_datagrid/datagrid.dart';
|
||||
import 'package:collection/collection.dart';
|
||||
|
||||
/// Renders custom header data grid sample
|
||||
class CustomHeaderDataGrid extends SampleView {
|
||||
|
|
@ -170,7 +170,7 @@ class _CustomHeaderDataGridState extends SampleViewState {
|
|||
List<GridColumn> getColumns() {
|
||||
List<GridColumn> columns;
|
||||
columns = <GridColumn>[
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'id',
|
||||
width: 140,
|
||||
label: buildHeaderCell(Container(
|
||||
|
|
@ -180,7 +180,7 @@ class _CustomHeaderDataGridState extends SampleViewState {
|
|||
overflow: TextOverflow.ellipsis,
|
||||
),
|
||||
))),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'productId',
|
||||
width: 150,
|
||||
label: buildHeaderCell(Container(
|
||||
|
|
@ -190,7 +190,7 @@ class _CustomHeaderDataGridState extends SampleViewState {
|
|||
overflow: TextOverflow.ellipsis,
|
||||
),
|
||||
))),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'name',
|
||||
width: 185,
|
||||
label: buildHeaderCell(Container(
|
||||
|
|
@ -200,7 +200,7 @@ class _CustomHeaderDataGridState extends SampleViewState {
|
|||
overflow: TextOverflow.ellipsis,
|
||||
),
|
||||
))),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'product',
|
||||
width: 135,
|
||||
label: buildHeaderCell(Container(
|
||||
|
|
@ -210,7 +210,7 @@ class _CustomHeaderDataGridState extends SampleViewState {
|
|||
overflow: TextOverflow.ellipsis,
|
||||
),
|
||||
))),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'orderDate',
|
||||
width: 150,
|
||||
label: buildHeaderCell(Container(
|
||||
|
|
@ -220,7 +220,7 @@ class _CustomHeaderDataGridState extends SampleViewState {
|
|||
overflow: TextOverflow.ellipsis,
|
||||
),
|
||||
))),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'quantity',
|
||||
width: 135,
|
||||
label: buildHeaderCell(Container(
|
||||
|
|
@ -230,7 +230,7 @@ class _CustomHeaderDataGridState extends SampleViewState {
|
|||
overflow: TextOverflow.ellipsis,
|
||||
),
|
||||
))),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'city',
|
||||
width: 130,
|
||||
label: buildHeaderCell(Container(
|
||||
|
|
@ -240,7 +240,7 @@ class _CustomHeaderDataGridState extends SampleViewState {
|
|||
overflow: TextOverflow.ellipsis,
|
||||
),
|
||||
))),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'unitPrice',
|
||||
width: 140,
|
||||
label: buildHeaderCell(Container(
|
||||
|
|
|
|||
|
|
@ -1,17 +1,18 @@
|
|||
/// Dart import
|
||||
import 'dart:math';
|
||||
|
||||
import 'package:flutter/foundation.dart';
|
||||
|
||||
/// Package imports
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:intl/intl.dart';
|
||||
import 'package:flutter/foundation.dart';
|
||||
|
||||
/// DataGrid import
|
||||
import 'package:syncfusion_flutter_datagrid/datagrid.dart';
|
||||
|
||||
/// Core import
|
||||
import 'package:syncfusion_flutter_core/theme.dart';
|
||||
|
||||
/// DataGrid import
|
||||
import 'package:syncfusion_flutter_datagrid/datagrid.dart';
|
||||
|
||||
/// Local import
|
||||
import '../../../model/sample_view.dart';
|
||||
|
||||
|
|
@ -34,7 +35,7 @@ class _StackedHeaderDataGridState extends SampleViewState {
|
|||
List<GridColumn> _getColumns() {
|
||||
List<GridColumn> columns;
|
||||
columns = <GridColumn>[
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'customerName',
|
||||
width: isWebOrDesktop ? 180 : 140,
|
||||
label: Container(
|
||||
|
|
@ -46,7 +47,7 @@ class _StackedHeaderDataGridState extends SampleViewState {
|
|||
overflow: TextOverflow.ellipsis,
|
||||
),
|
||||
)),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'city',
|
||||
width: isWebOrDesktop ? 140 : 100,
|
||||
label: Container(
|
||||
|
|
@ -58,7 +59,7 @@ class _StackedHeaderDataGridState extends SampleViewState {
|
|||
overflow: TextOverflow.ellipsis,
|
||||
),
|
||||
)),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'orderId',
|
||||
width: isWebOrDesktop ? 140 : 90,
|
||||
label: Container(
|
||||
|
|
@ -70,7 +71,7 @@ class _StackedHeaderDataGridState extends SampleViewState {
|
|||
overflow: TextOverflow.ellipsis,
|
||||
),
|
||||
)),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'orderDate',
|
||||
width: isWebOrDesktop ? 140 : 110,
|
||||
label: Container(
|
||||
|
|
@ -82,7 +83,7 @@ class _StackedHeaderDataGridState extends SampleViewState {
|
|||
overflow: TextOverflow.ellipsis,
|
||||
),
|
||||
)),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'product',
|
||||
width: isWebOrDesktop ? 160 : 100,
|
||||
label: Container(
|
||||
|
|
@ -94,7 +95,7 @@ class _StackedHeaderDataGridState extends SampleViewState {
|
|||
overflow: TextOverflow.ellipsis,
|
||||
),
|
||||
)),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'productId',
|
||||
width: isWebOrDesktop ? 150 : 100,
|
||||
label: Container(
|
||||
|
|
@ -106,7 +107,7 @@ class _StackedHeaderDataGridState extends SampleViewState {
|
|||
overflow: TextOverflow.ellipsis,
|
||||
),
|
||||
)),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'quantity',
|
||||
width: isWebOrDesktop ? 150 : 90,
|
||||
label: Container(
|
||||
|
|
@ -118,7 +119,7 @@ class _StackedHeaderDataGridState extends SampleViewState {
|
|||
overflow: TextOverflow.ellipsis,
|
||||
),
|
||||
)),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'unitPrice',
|
||||
width: isWebOrDesktop ? 140 : 100,
|
||||
label: Container(
|
||||
|
|
|
|||
|
|
@ -26,7 +26,7 @@ class _JsonDataSourceDataGridState extends SampleViewState {
|
|||
List<GridColumn> getColumns() {
|
||||
List<GridColumn> columns;
|
||||
columns = <GridColumn>[
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'id',
|
||||
width: isWebOrDesktop ? 135 : 90,
|
||||
label: Container(
|
||||
|
|
@ -39,7 +39,7 @@ class _JsonDataSourceDataGridState extends SampleViewState {
|
|||
),
|
||||
),
|
||||
),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'contactName',
|
||||
width: 150,
|
||||
label: Container(
|
||||
|
|
@ -52,7 +52,7 @@ class _JsonDataSourceDataGridState extends SampleViewState {
|
|||
),
|
||||
),
|
||||
),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'companyName',
|
||||
width: isWebOrDesktop ? 165 : 140,
|
||||
label: Container(
|
||||
|
|
@ -65,7 +65,7 @@ class _JsonDataSourceDataGridState extends SampleViewState {
|
|||
),
|
||||
),
|
||||
),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'city',
|
||||
width: isWebOrDesktop ? 150 : 120,
|
||||
label: Container(
|
||||
|
|
@ -78,7 +78,7 @@ class _JsonDataSourceDataGridState extends SampleViewState {
|
|||
),
|
||||
),
|
||||
),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'country',
|
||||
width: isWebOrDesktop ? 150 : 120,
|
||||
label: Container(
|
||||
|
|
@ -91,7 +91,7 @@ class _JsonDataSourceDataGridState extends SampleViewState {
|
|||
),
|
||||
),
|
||||
),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'designation',
|
||||
width: 170,
|
||||
label: Container(
|
||||
|
|
@ -104,7 +104,7 @@ class _JsonDataSourceDataGridState extends SampleViewState {
|
|||
),
|
||||
),
|
||||
),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'postalCode',
|
||||
width: 110,
|
||||
label: Container(
|
||||
|
|
@ -113,7 +113,7 @@ class _JsonDataSourceDataGridState extends SampleViewState {
|
|||
child: const Text('Postal Code'),
|
||||
),
|
||||
),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'phoneNumber',
|
||||
width: 150,
|
||||
label: Container(
|
||||
|
|
|
|||
|
|
@ -31,7 +31,7 @@ class _ListDataSourceDataGridState extends SampleViewState {
|
|||
List<GridColumn> columns;
|
||||
columns = isWebOrDesktop
|
||||
? <GridColumn>[
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
width: (isWebOrDesktop && model.isMobileResolution)
|
||||
? 120.0
|
||||
: double.nan,
|
||||
|
|
@ -45,7 +45,7 @@ class _ListDataSourceDataGridState extends SampleViewState {
|
|||
),
|
||||
),
|
||||
),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
width: (isWebOrDesktop && model.isMobileResolution)
|
||||
? 150.0
|
||||
: double.nan,
|
||||
|
|
@ -59,7 +59,7 @@ class _ListDataSourceDataGridState extends SampleViewState {
|
|||
),
|
||||
),
|
||||
),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
width: (isWebOrDesktop && model.isMobileResolution)
|
||||
? 120.0
|
||||
: double.nan,
|
||||
|
|
@ -73,7 +73,7 @@ class _ListDataSourceDataGridState extends SampleViewState {
|
|||
),
|
||||
),
|
||||
),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
width: (isWebOrDesktop && model.isMobileResolution)
|
||||
? 110.0
|
||||
: double.nan,
|
||||
|
|
@ -87,7 +87,7 @@ class _ListDataSourceDataGridState extends SampleViewState {
|
|||
),
|
||||
),
|
||||
),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
width: (isWebOrDesktop && model.isMobileResolution)
|
||||
? 120.0
|
||||
: double.nan,
|
||||
|
|
@ -101,7 +101,7 @@ class _ListDataSourceDataGridState extends SampleViewState {
|
|||
),
|
||||
),
|
||||
),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
width: (isWebOrDesktop && model.isMobileResolution)
|
||||
? 120.0
|
||||
: double.nan,
|
||||
|
|
@ -117,7 +117,7 @@ class _ListDataSourceDataGridState extends SampleViewState {
|
|||
)
|
||||
]
|
||||
: <GridColumn>[
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'id',
|
||||
label: Container(
|
||||
padding: const EdgeInsets.all(8),
|
||||
|
|
@ -127,7 +127,7 @@ class _ListDataSourceDataGridState extends SampleViewState {
|
|||
overflow: TextOverflow.ellipsis,
|
||||
),
|
||||
)),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'customerId',
|
||||
columnWidthMode: isLandscapeInMobileView
|
||||
? ColumnWidthMode.fill
|
||||
|
|
@ -141,7 +141,7 @@ class _ListDataSourceDataGridState extends SampleViewState {
|
|||
),
|
||||
),
|
||||
),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'name',
|
||||
label: Container(
|
||||
padding: const EdgeInsets.all(8),
|
||||
|
|
@ -152,7 +152,7 @@ class _ListDataSourceDataGridState extends SampleViewState {
|
|||
),
|
||||
),
|
||||
),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'city',
|
||||
label: Container(
|
||||
padding: const EdgeInsets.all(8),
|
||||
|
|
|
|||
|
|
@ -0,0 +1,754 @@
|
|||
///Dart import
|
||||
import 'dart:core';
|
||||
import 'dart:math';
|
||||
|
||||
import 'package:collection/collection.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter/services.dart';
|
||||
import 'package:flutter_examples/model/model.dart';
|
||||
import 'package:flutter_examples/model/sample_view.dart';
|
||||
import 'package:intl/intl.dart';
|
||||
import 'package:syncfusion_flutter_datagrid/datagrid.dart';
|
||||
|
||||
/// Render data grid with editing.
|
||||
class EditingDataGrid extends SampleView {
|
||||
/// Create data grid with editing.
|
||||
const EditingDataGrid({Key? key}) : super(key: key);
|
||||
|
||||
@override
|
||||
_EditingDataGridState createState() => _EditingDataGridState();
|
||||
}
|
||||
|
||||
class _EditingDataGridState extends SampleViewState {
|
||||
@override
|
||||
void initState() {
|
||||
super.initState();
|
||||
isWebOrDesktop = model.isWeb || model.isDesktop;
|
||||
editingDataGridSource = _EditingDataGridSource(model);
|
||||
panelOpen = frontPanelVisible.value;
|
||||
frontPanelVisible.addListener(_subscribeToValueNotifier);
|
||||
}
|
||||
|
||||
final ValueNotifier<bool> frontPanelVisible = ValueNotifier<bool>(true);
|
||||
void _subscribeToValueNotifier() => panelOpen = frontPanelVisible.value;
|
||||
bool panelOpen = false;
|
||||
|
||||
/// DataGridSource of [SfDataGrid]
|
||||
late _EditingDataGridSource editingDataGridSource;
|
||||
|
||||
/// Determine to decide whether the device in landscape or in portrait.
|
||||
late bool isLandscapeInMobileView;
|
||||
|
||||
/// Help to identify the desktop or mobile.
|
||||
late bool isWebOrDesktop;
|
||||
|
||||
/// Determine the editing action on [SfDataGrid]
|
||||
EditingGestureType editingGestureType = EditingGestureType.doubleTap;
|
||||
|
||||
SfDataGrid _buildDataGrid(BuildContext context) {
|
||||
return SfDataGrid(
|
||||
source: editingDataGridSource,
|
||||
allowEditing: true,
|
||||
navigationMode: GridNavigationMode.cell,
|
||||
selectionMode: SelectionMode.single,
|
||||
editingGestureType: editingGestureType,
|
||||
columnWidthMode: isWebOrDesktop
|
||||
? (isWebOrDesktop && model.isMobileResolution)
|
||||
? ColumnWidthMode.none
|
||||
: ColumnWidthMode.fill
|
||||
: isLandscapeInMobileView
|
||||
? ColumnWidthMode.fill
|
||||
: ColumnWidthMode.none,
|
||||
columns: <GridColumn>[
|
||||
GridColumn(
|
||||
columnName: 'productNo',
|
||||
width: isWebOrDesktop ? double.nan : 110,
|
||||
label: Container(
|
||||
padding: const EdgeInsets.all(8.0),
|
||||
alignment: Alignment.centerRight,
|
||||
child: const Text(
|
||||
'Product No',
|
||||
overflow: TextOverflow.ellipsis,
|
||||
),
|
||||
)),
|
||||
GridColumn(
|
||||
columnName: 'dealerName',
|
||||
width: isWebOrDesktop ? double.nan : 110,
|
||||
label: Container(
|
||||
padding: const EdgeInsets.all(8.0),
|
||||
alignment: Alignment.centerLeft,
|
||||
child: const Text(
|
||||
'Dealer Name',
|
||||
overflow: TextOverflow.ellipsis,
|
||||
),
|
||||
)),
|
||||
GridColumn(
|
||||
columnName: 'shippedDate',
|
||||
width: isWebOrDesktop ? double.nan : 110,
|
||||
label: Container(
|
||||
padding: const EdgeInsets.all(8.0),
|
||||
alignment: Alignment.centerRight,
|
||||
child: const Text(
|
||||
'Shipped Date',
|
||||
overflow: TextOverflow.ellipsis,
|
||||
),
|
||||
)),
|
||||
GridColumn(
|
||||
columnName: 'shipCountry',
|
||||
width: isWebOrDesktop ? double.nan : 110,
|
||||
label: Container(
|
||||
padding: const EdgeInsets.all(8.0),
|
||||
alignment: Alignment.centerLeft,
|
||||
child: const Text(
|
||||
'Ship Country',
|
||||
overflow: TextOverflow.ellipsis,
|
||||
),
|
||||
)),
|
||||
GridColumn(
|
||||
columnName: 'shipCity',
|
||||
width: isWebOrDesktop ? double.nan : 110,
|
||||
label: Container(
|
||||
padding: const EdgeInsets.all(8.0),
|
||||
alignment: Alignment.centerLeft,
|
||||
child: const Text(
|
||||
'Ship City',
|
||||
overflow: TextOverflow.ellipsis,
|
||||
),
|
||||
)),
|
||||
GridColumn(
|
||||
columnName: 'productPrice',
|
||||
label: Container(
|
||||
padding: const EdgeInsets.all(8.0),
|
||||
alignment: Alignment.centerRight,
|
||||
child: const Text(
|
||||
'Price',
|
||||
overflow: TextOverflow.ellipsis,
|
||||
),
|
||||
)),
|
||||
],
|
||||
);
|
||||
}
|
||||
|
||||
@override
|
||||
Widget buildSettings(BuildContext context) {
|
||||
return StatefulBuilder(
|
||||
builder: (BuildContext context, StateSetter stateSetter) {
|
||||
return ListView(shrinkWrap: true, children: <Widget>[
|
||||
ListTile(
|
||||
title: Text(
|
||||
model.isWebFullView
|
||||
? 'Editing \ngesture type'
|
||||
: 'Editing gesture type',
|
||||
softWrap: false,
|
||||
style: TextStyle(fontSize: 16.0, color: model.textColor),
|
||||
),
|
||||
trailing: Theme(
|
||||
data: ThemeData(canvasColor: model.bottomSheetBackgroundColor),
|
||||
child: DropdownButton<String>(
|
||||
value: editingGestureType.toString().split('.')[1],
|
||||
items: <String>['tap', 'doubleTap'].map((String value) {
|
||||
return DropdownMenuItem<String>(
|
||||
value: value,
|
||||
child: Text(value,
|
||||
textAlign: TextAlign.center,
|
||||
style: TextStyle(color: model.textColor)));
|
||||
}).toList(),
|
||||
onChanged: (dynamic value) {
|
||||
if (value == 'tap') {
|
||||
editingGestureType = EditingGestureType.tap;
|
||||
} else {
|
||||
editingGestureType = EditingGestureType.doubleTap;
|
||||
}
|
||||
stateSetter(() {});
|
||||
setState(() {});
|
||||
}),
|
||||
)),
|
||||
]);
|
||||
});
|
||||
}
|
||||
|
||||
@override
|
||||
void didChangeDependencies() {
|
||||
super.didChangeDependencies();
|
||||
editingDataGridSource.sampleModel = model;
|
||||
isLandscapeInMobileView = !isWebOrDesktop &&
|
||||
MediaQuery.of(context).orientation == Orientation.landscape;
|
||||
}
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Scaffold(body: _buildDataGrid(context));
|
||||
}
|
||||
}
|
||||
|
||||
class _EditingDataGridSource extends DataGridSource {
|
||||
_EditingDataGridSource(this.sampleModel) {
|
||||
textStyle = sampleModel.themeData.brightness == Brightness.light
|
||||
? const TextStyle(
|
||||
fontFamily: 'Roboto',
|
||||
fontWeight: FontWeight.w400,
|
||||
fontSize: 14,
|
||||
color: Colors.black87)
|
||||
: const TextStyle(
|
||||
fontFamily: 'Roboto',
|
||||
fontWeight: FontWeight.w400,
|
||||
fontSize: 14,
|
||||
color: Color.fromRGBO(255, 255, 255, 1));
|
||||
dealers = getDealerDetails(100);
|
||||
buildDataGridRows();
|
||||
}
|
||||
|
||||
/// Helps to change the widget appearance based on the sample browser theme.
|
||||
SampleModel sampleModel;
|
||||
|
||||
/// Collection of dealer info.
|
||||
late List<_DealerInfo> dealers;
|
||||
|
||||
/// Collection of [DataGridRow].
|
||||
late List<DataGridRow> dataGridRows;
|
||||
|
||||
/// Helps to change the [TextStyle] of editable widget.
|
||||
/// Decide the text appearance of editable widget based on [Brightness].
|
||||
late TextStyle textStyle;
|
||||
|
||||
/// Help to generate the random number.
|
||||
Random random = Random();
|
||||
|
||||
/// Help to control the editable text in [TextField] widget.
|
||||
TextEditingController editingController = TextEditingController();
|
||||
|
||||
/// Helps to hold the new value of all editable widget.
|
||||
/// Based on the new value we will commit the new value into the corresponding
|
||||
/// [DataGridCell] on [onSubmitCell] method.
|
||||
dynamic newCellValue;
|
||||
|
||||
/// Helps to prevent the multiple time calling of [showDatePicker] when focus
|
||||
/// get into it.By default, datagrid sets the focus to editable widget. As
|
||||
/// Date picker showing when the container got focused, this flag helps to
|
||||
/// prevent to show the date picker again after date is picked from popup.
|
||||
bool isDatePickerVisible = false;
|
||||
|
||||
/// Building the [DataGridRow]'s.
|
||||
void buildDataGridRows() {
|
||||
dataGridRows = dealers
|
||||
.map<DataGridRow>((_DealerInfo dealer) => dealer.getDataGridRow())
|
||||
.toList();
|
||||
}
|
||||
|
||||
@override
|
||||
List<DataGridRow> get rows => dataGridRows;
|
||||
|
||||
@override
|
||||
DataGridRowAdapter? buildRow(DataGridRow row) {
|
||||
return DataGridRowAdapter(
|
||||
cells: row.getCells().map<Widget>((DataGridCell dataGridCell) {
|
||||
final bool isRightAlign = dataGridCell.columnName == 'productNo' ||
|
||||
dataGridCell.columnName == 'shippedDate' ||
|
||||
dataGridCell.columnName == 'productPrice';
|
||||
|
||||
String value = dataGridCell.value.toString();
|
||||
|
||||
if (dataGridCell.columnName == 'productPrice') {
|
||||
value = NumberFormat.currency(locale: 'en_US', symbol: r'$')
|
||||
.format(dataGridCell.value)
|
||||
.toString();
|
||||
} else if (dataGridCell.columnName == 'shippedDate') {
|
||||
value = DateFormat('MM/dd/yyyy').format(dataGridCell.value).toString();
|
||||
}
|
||||
|
||||
return Container(
|
||||
padding: const EdgeInsets.all(8.0),
|
||||
alignment: isRightAlign ? Alignment.centerRight : Alignment.centerLeft,
|
||||
child: Text(
|
||||
value,
|
||||
overflow: TextOverflow.ellipsis,
|
||||
),
|
||||
);
|
||||
}).toList());
|
||||
}
|
||||
|
||||
@override
|
||||
Widget? buildEditWidget(DataGridRow dataGridRow,
|
||||
RowColumnIndex rowColumnIndex, GridColumn column, CellSubmit submitCell) {
|
||||
// Text going to display on editable widget
|
||||
final String displayText = dataGridRow
|
||||
.getCells()
|
||||
.firstWhereOrNull((DataGridCell dataGridCell) =>
|
||||
dataGridCell.columnName == column.columnName)
|
||||
?.value
|
||||
?.toString() ??
|
||||
'';
|
||||
|
||||
// The new cell value must be reset.
|
||||
// To avoid committing the [DataGridCell] value that was previously edited
|
||||
// into the current non-modified [DataGridCell].
|
||||
newCellValue = null;
|
||||
|
||||
if (column.columnName == 'shippedDate') {
|
||||
return _buildDateTimePicker(displayText, submitCell);
|
||||
} else if (column.columnName == 'shipCountry') {
|
||||
return _buildDropDownWidget(displayText, submitCell, shipCountry);
|
||||
} else if (column.columnName == 'shipCity') {
|
||||
final String shipCountry = dataGridRow
|
||||
.getCells()
|
||||
.firstWhereOrNull((DataGridCell dataGridCell) =>
|
||||
dataGridCell.columnName == 'shipCountry')
|
||||
?.value
|
||||
?.toString() ??
|
||||
'';
|
||||
|
||||
return _buildDropDownWidget(displayText == '' ? null : displayText,
|
||||
submitCell, shipCity[shipCountry]!);
|
||||
} else {
|
||||
return _buildTextFieldWidget(displayText, column, submitCell);
|
||||
}
|
||||
}
|
||||
|
||||
@override
|
||||
void onCellSubmit(DataGridRow dataGridRow, RowColumnIndex rowColumnIndex,
|
||||
GridColumn column) {
|
||||
final dynamic oldValue = dataGridRow
|
||||
.getCells()
|
||||
.firstWhereOrNull((DataGridCell dataGridCell) =>
|
||||
dataGridCell.columnName == column.columnName)
|
||||
?.value ??
|
||||
'';
|
||||
|
||||
final int dataRowIndex = dataGridRows.indexOf(dataGridRow);
|
||||
|
||||
if (newCellValue == null || oldValue == newCellValue) {
|
||||
return;
|
||||
}
|
||||
|
||||
if (column.columnName == 'shippedDate') {
|
||||
dataGridRows[dataRowIndex].getCells()[rowColumnIndex.columnIndex] =
|
||||
DataGridCell<DateTime>(
|
||||
columnName: 'shippedDate', value: newCellValue);
|
||||
dealers[dataRowIndex].shippedDate = newCellValue as DateTime;
|
||||
} else if (column.columnName == 'productNo') {
|
||||
dataGridRows[dataRowIndex].getCells()[rowColumnIndex.columnIndex] =
|
||||
DataGridCell<int>(columnName: 'productNo', value: newCellValue);
|
||||
dealers[dataRowIndex].productNo = newCellValue as int;
|
||||
} else if (column.columnName == 'productPrice') {
|
||||
dataGridRows[dataRowIndex].getCells()[rowColumnIndex.columnIndex] =
|
||||
DataGridCell<double>(columnName: 'productPrice', value: newCellValue);
|
||||
dealers[dataRowIndex].productPrice = newCellValue as double;
|
||||
} else if (column.columnName == 'dealerName') {
|
||||
dataGridRows[dataRowIndex].getCells()[rowColumnIndex.columnIndex] =
|
||||
DataGridCell<String>(columnName: 'dealerName', value: newCellValue);
|
||||
dealers[dataRowIndex].dealerName = newCellValue.toString();
|
||||
} else if (column.columnName == 'shipCountry') {
|
||||
dataGridRows[dataRowIndex].getCells()[rowColumnIndex.columnIndex] =
|
||||
DataGridCell<String>(columnName: 'shipCountry', value: newCellValue);
|
||||
final dynamic dataGridCell = dataGridRows[dataRowIndex]
|
||||
.getCells()
|
||||
.firstWhereOrNull(
|
||||
(DataGridCell element) => element.columnName == 'shipCity');
|
||||
final int dataCellIndex =
|
||||
dataGridRows[dataRowIndex].getCells().indexOf(dataGridCell);
|
||||
dataGridRows[dataRowIndex].getCells()[dataCellIndex] =
|
||||
const DataGridCell<String>(columnName: 'shipCity', value: '');
|
||||
dealers[dataRowIndex].shipCountry = newCellValue.toString();
|
||||
} else {
|
||||
dataGridRows[dataRowIndex].getCells()[rowColumnIndex.columnIndex] =
|
||||
DataGridCell<String>(columnName: 'shipCity', value: newCellValue);
|
||||
dealers[dataRowIndex].shipCity = newCellValue.toString();
|
||||
}
|
||||
}
|
||||
|
||||
RegExp _getRegExp(bool isNumericKeyBoard, String columnName) {
|
||||
return isNumericKeyBoard
|
||||
? columnName == 'productPrice'
|
||||
? RegExp('[0-9.]')
|
||||
: RegExp('[0-9]')
|
||||
: RegExp('[a-zA-Z ]');
|
||||
}
|
||||
|
||||
/// Building a [TextField] for numeric and text column.
|
||||
Widget _buildTextFieldWidget(
|
||||
String displayText, GridColumn column, CellSubmit submitCell) {
|
||||
final bool isTextAlignRight = column.columnName == 'productNo' ||
|
||||
column.columnName == 'shippedDate' ||
|
||||
column.columnName == 'productPrice';
|
||||
|
||||
final bool isNumericKeyBoardType =
|
||||
column.columnName == 'productNo' || column.columnName == 'productPrice';
|
||||
|
||||
// Holds regular expression pattern based on the column type.
|
||||
final RegExp regExp = _getRegExp(isNumericKeyBoardType, column.columnName);
|
||||
|
||||
return Container(
|
||||
padding: const EdgeInsets.all(8.0),
|
||||
alignment:
|
||||
isTextAlignRight ? Alignment.centerRight : Alignment.centerLeft,
|
||||
child: TextField(
|
||||
autofocus: true,
|
||||
controller: editingController..text = displayText,
|
||||
textAlign: isTextAlignRight ? TextAlign.right : TextAlign.left,
|
||||
autocorrect: false,
|
||||
keyboardAppearance: sampleModel.themeData.brightness,
|
||||
decoration: InputDecoration(
|
||||
contentPadding: const EdgeInsets.fromLTRB(0, 0, 0, 16.0),
|
||||
focusedBorder: UnderlineInputBorder(
|
||||
borderSide: BorderSide(color: sampleModel.backgroundColor))),
|
||||
style: textStyle,
|
||||
cursorColor: sampleModel.backgroundColor,
|
||||
inputFormatters: <TextInputFormatter>[
|
||||
FilteringTextInputFormatter.allow(regExp)
|
||||
],
|
||||
keyboardType:
|
||||
isNumericKeyBoardType ? TextInputType.number : TextInputType.text,
|
||||
onChanged: (String value) {
|
||||
if (value.isNotEmpty) {
|
||||
if (isNumericKeyBoardType) {
|
||||
newCellValue = column.columnName == 'productPrice'
|
||||
? double.parse(value)
|
||||
: int.parse(value);
|
||||
} else {
|
||||
newCellValue = value;
|
||||
}
|
||||
} else {
|
||||
newCellValue = null;
|
||||
}
|
||||
},
|
||||
onSubmitted: (String value) {
|
||||
/// Call [CellSubmit] callback to fire the canSubmitCell and
|
||||
/// onCellSubmit to commit the new value in single place.
|
||||
submitCell();
|
||||
},
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
/// Building a [DatePicker] for datetime column.
|
||||
Widget _buildDateTimePicker(String displayText, CellSubmit submitCell) {
|
||||
final DateTime selectedDate = DateTime.parse(displayText);
|
||||
final DateTime firstDate = DateTime.parse('1999-01-01');
|
||||
final DateTime lastDate = DateTime.parse('2016-12-31');
|
||||
|
||||
displayText =
|
||||
DateFormat('MM/dd/yyyy').format(DateTime.parse(displayText)).toString();
|
||||
return Builder(
|
||||
builder: (BuildContext context) {
|
||||
return Container(
|
||||
padding: const EdgeInsets.all(8.0),
|
||||
alignment: Alignment.centerRight,
|
||||
child: Focus(
|
||||
autofocus: true,
|
||||
focusNode: FocusNode()
|
||||
..addListener(() async {
|
||||
if (!isDatePickerVisible) {
|
||||
isDatePickerVisible = true;
|
||||
await showDatePicker(
|
||||
context: context,
|
||||
initialDate: selectedDate,
|
||||
firstDate: firstDate,
|
||||
lastDate: lastDate,
|
||||
builder: (BuildContext context, Widget? child) {
|
||||
return Theme(
|
||||
data: Theme.of(context).copyWith(
|
||||
colorScheme: sampleModel
|
||||
.themeData.brightness ==
|
||||
Brightness.light
|
||||
? ColorScheme.light(
|
||||
primary: sampleModel.backgroundColor)
|
||||
: ColorScheme.dark(
|
||||
primary: sampleModel.backgroundColor,
|
||||
)),
|
||||
child: child!,
|
||||
);
|
||||
},
|
||||
initialDatePickerMode: DatePickerMode.day)
|
||||
.then((DateTime? value) {
|
||||
newCellValue = value;
|
||||
|
||||
/// Call [CellSubmit] callback to fire the canSubmitCell and
|
||||
/// onCellSubmit to commit the new value in single place.
|
||||
submitCell();
|
||||
isDatePickerVisible = false;
|
||||
});
|
||||
}
|
||||
}),
|
||||
child: Text(
|
||||
displayText,
|
||||
textAlign: TextAlign.right,
|
||||
style: textStyle,
|
||||
),
|
||||
),
|
||||
);
|
||||
},
|
||||
);
|
||||
}
|
||||
|
||||
/// Building a [DropDown] for combo box column.
|
||||
Widget _buildDropDownWidget(String? displayText, CellSubmit submitCell,
|
||||
List<String> dropDownMenuItems) {
|
||||
return Container(
|
||||
padding: const EdgeInsets.all(8.0),
|
||||
alignment: Alignment.centerLeft,
|
||||
child: DropdownButton<String>(
|
||||
value: displayText,
|
||||
autofocus: true,
|
||||
focusColor: Colors.transparent,
|
||||
underline: const SizedBox.shrink(),
|
||||
icon: const Icon(Icons.arrow_drop_down_sharp),
|
||||
isExpanded: true,
|
||||
style: textStyle,
|
||||
onChanged: (String? value) {
|
||||
newCellValue = value;
|
||||
|
||||
/// Call [CellSubmit] callback to fire the canSubmitCell and
|
||||
/// onCellSubmit to commit the new value in single place.
|
||||
submitCell();
|
||||
},
|
||||
items:
|
||||
dropDownMenuItems.map<DropdownMenuItem<String>>((String value) {
|
||||
return DropdownMenuItem<String>(
|
||||
value: value,
|
||||
child: Text(value),
|
||||
);
|
||||
}).toList()),
|
||||
);
|
||||
}
|
||||
|
||||
// ------------- Populating the dealer info collection's. ----------------
|
||||
// ------------------------------------------------------------------------
|
||||
|
||||
List<_DealerInfo> getDealerDetails(int count) {
|
||||
final List<_DealerInfo> dealerDetails = <_DealerInfo>[];
|
||||
final List<DateTime> shippedDate = getDateBetween(2001, 2016, count);
|
||||
for (int i = 1; i <= count; i++) {
|
||||
final String selectedShipCountry = shipCountry[random.nextInt(5)];
|
||||
final List<String> selectedShipCities = shipCity[selectedShipCountry]!;
|
||||
final _DealerInfo ord = _DealerInfo(
|
||||
productNo[random.nextInt(15)],
|
||||
i.isEven
|
||||
? customersMale[random.nextInt(15)]
|
||||
: customersFemale[random.nextInt(14)],
|
||||
shippedDate[i - 1],
|
||||
selectedShipCountry,
|
||||
selectedShipCities[random.nextInt(selectedShipCities.length - 1)],
|
||||
next(2000, 10000).toDouble());
|
||||
dealerDetails.add(ord);
|
||||
}
|
||||
|
||||
return dealerDetails;
|
||||
}
|
||||
|
||||
/// Helps to populate the random number between the [min] and [max] value.
|
||||
int next(int min, int max) => min + random.nextInt(max - min);
|
||||
|
||||
/// Populate the random date between the [startYear] and [endYear]
|
||||
List<DateTime> getDateBetween(int startYear, int endYear, int count) {
|
||||
final List<DateTime> date = <DateTime>[];
|
||||
for (int i = 0; i < count; i++) {
|
||||
final int year = next(startYear, endYear);
|
||||
final int month = random.nextInt(12);
|
||||
final int day = random.nextInt(30);
|
||||
date.add(DateTime(year, month, day));
|
||||
}
|
||||
|
||||
return date;
|
||||
}
|
||||
|
||||
final Map<String, List<String>> shipCity = <String, List<String>>{
|
||||
'Argentina': <String>['Rosario', 'Catamarca', 'Formosa', 'Salta'],
|
||||
'Austria': <String>['Graz', 'Salzburg', 'Linz', 'Wels'],
|
||||
'Belgium': <String>['Bruxelles', 'Charleroi', 'Namur', 'Mons'],
|
||||
'Brazil': <String>[
|
||||
'Campinas',
|
||||
'Resende',
|
||||
'Recife',
|
||||
'Manaus',
|
||||
],
|
||||
'Canada': <String>[
|
||||
'Alberta',
|
||||
'Montreal',
|
||||
'Tsawwassen',
|
||||
'Vancouver',
|
||||
],
|
||||
'Denmark': <String>[
|
||||
'Svendborg',
|
||||
'Farum',
|
||||
'Åarhus',
|
||||
'København',
|
||||
],
|
||||
'Finland': <String>['Helsinki', 'Espoo', 'Oulu'],
|
||||
'France': <String>[
|
||||
'Lille',
|
||||
'Lyon',
|
||||
'Marseille',
|
||||
'Nantes',
|
||||
'Paris',
|
||||
'Reims',
|
||||
'Strasbourg',
|
||||
'Toulouse',
|
||||
'Versailles'
|
||||
],
|
||||
'Germany': <String>[
|
||||
'Aachen',
|
||||
'Berlin',
|
||||
'Brandenburg',
|
||||
'Cunewalde',
|
||||
'Frankfurt',
|
||||
'Köln',
|
||||
'Leipzig',
|
||||
'Mannheim',
|
||||
'München',
|
||||
'Münster',
|
||||
'Stuttgart'
|
||||
],
|
||||
'Ireland': <String>['Cork', 'Waterford', 'Bray', 'Athlone'],
|
||||
'Italy': <String>[
|
||||
'Bergamo',
|
||||
'Reggio Calabria',
|
||||
'Torino',
|
||||
'Genoa',
|
||||
],
|
||||
'Mexico': <String>[
|
||||
'Mexico City',
|
||||
'Puebla',
|
||||
'León',
|
||||
'Zapopan',
|
||||
],
|
||||
'Norway': <String>['Stavern', 'Hamar', 'Harstad', 'Narvik'],
|
||||
'Poland': <String>['Warszawa', 'Gdynia', 'Rybnik', 'Legnica'],
|
||||
'Portugal': <String>['Lisboa', 'Albufeira', 'Elvas', 'Estremoz'],
|
||||
'Spain': <String>[
|
||||
'Barcelona',
|
||||
'Madrid',
|
||||
'Sevilla',
|
||||
'Bilboa',
|
||||
],
|
||||
'Sweden': <String>['Bräcke', 'Piteå', 'Robertsfors', 'Luleå'],
|
||||
'Switzerland': <String>[
|
||||
'Bern',
|
||||
'Genève',
|
||||
'Charrat',
|
||||
'Châtillens',
|
||||
],
|
||||
'UK': <String>['Colchester', 'Hedge End', 'London', 'Bristol'],
|
||||
'USA': <String>[
|
||||
'Albuquerque',
|
||||
'Anchorage',
|
||||
'Boise',
|
||||
'Butte',
|
||||
'Elgin',
|
||||
'Eugene',
|
||||
'Kirkland',
|
||||
'Lander',
|
||||
'Portland',
|
||||
'San Francisco',
|
||||
'Seattle',
|
||||
],
|
||||
'Venezuela': <String>[
|
||||
'Barquisimeto',
|
||||
'Caracas',
|
||||
'Isla de Margarita',
|
||||
'San Cristóbal',
|
||||
'Cantaura',
|
||||
],
|
||||
};
|
||||
|
||||
List<String> customersMale = <String>[
|
||||
'Adams',
|
||||
'Owens',
|
||||
'Thomas',
|
||||
'Doran',
|
||||
'Jefferson',
|
||||
'Spencer',
|
||||
'Vargas',
|
||||
'Grimes',
|
||||
'Edwards',
|
||||
'Stark',
|
||||
'Cruise',
|
||||
'Fitz',
|
||||
'Chief',
|
||||
'Blanc',
|
||||
'Stone',
|
||||
'Williams',
|
||||
'Jobs',
|
||||
'Holmes'
|
||||
];
|
||||
|
||||
List<String> customersFemale = <String>[
|
||||
'Crowley',
|
||||
'Waddell',
|
||||
'Irvine',
|
||||
'Keefe',
|
||||
'Ellis',
|
||||
'Gable',
|
||||
'Mendoza',
|
||||
'Rooney',
|
||||
'Lane',
|
||||
'Landry',
|
||||
'Perry',
|
||||
'Perez',
|
||||
'Newberry',
|
||||
'Betts',
|
||||
'Fitzgerald',
|
||||
];
|
||||
|
||||
List<int> productNo = <int>[
|
||||
1803,
|
||||
1345,
|
||||
4523,
|
||||
4932,
|
||||
9475,
|
||||
5243,
|
||||
4263,
|
||||
2435,
|
||||
3527,
|
||||
3634,
|
||||
2523,
|
||||
3652,
|
||||
3524,
|
||||
6532,
|
||||
2123
|
||||
];
|
||||
|
||||
List<String> shipCountry = <String>[
|
||||
'Argentina',
|
||||
'Austria',
|
||||
'Belgium',
|
||||
'Brazil',
|
||||
'Canada',
|
||||
'Denmark',
|
||||
'Finland',
|
||||
'France',
|
||||
'Germany',
|
||||
'Ireland',
|
||||
'Italy',
|
||||
'Mexico',
|
||||
'Norway',
|
||||
'Poland',
|
||||
'Portugal',
|
||||
'Spain',
|
||||
'Sweden',
|
||||
'UK',
|
||||
'USA',
|
||||
];
|
||||
}
|
||||
|
||||
class _DealerInfo {
|
||||
_DealerInfo(this.productNo, this.dealerName, this.shippedDate,
|
||||
this.shipCountry, this.shipCity, this.productPrice);
|
||||
|
||||
int productNo;
|
||||
String dealerName;
|
||||
double productPrice;
|
||||
DateTime shippedDate;
|
||||
String shipCity;
|
||||
String shipCountry;
|
||||
|
||||
DataGridRow getDataGridRow() {
|
||||
return DataGridRow(cells: <DataGridCell>[
|
||||
DataGridCell<int>(columnName: 'productNo', value: productNo),
|
||||
DataGridCell<String>(columnName: 'dealerName', value: dealerName),
|
||||
DataGridCell<DateTime>(columnName: 'shippedDate', value: shippedDate),
|
||||
DataGridCell<String>(columnName: 'shipCountry', value: shipCountry),
|
||||
DataGridCell<String>(columnName: 'shipCity', value: shipCity),
|
||||
DataGridCell<double>(columnName: 'productPrice', value: productPrice),
|
||||
]);
|
||||
}
|
||||
}
|
||||
|
|
@ -1,10 +1,11 @@
|
|||
/// Dart import
|
||||
import 'dart:math' as math;
|
||||
|
||||
import 'package:flutter/foundation.dart';
|
||||
|
||||
/// Package imports
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:intl/intl.dart';
|
||||
import 'package:flutter/foundation.dart';
|
||||
|
||||
/// Barcode import
|
||||
import 'package:syncfusion_flutter_datagrid/datagrid.dart';
|
||||
|
|
@ -32,7 +33,7 @@ class _FreezePanesDataGridPageState extends SampleViewState {
|
|||
List<GridColumn> getColumns() {
|
||||
List<GridColumn> columns;
|
||||
columns = <GridColumn>[
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'id',
|
||||
width: isWebOrDesktop ? 140 : 90,
|
||||
label: Container(
|
||||
|
|
@ -43,7 +44,7 @@ class _FreezePanesDataGridPageState extends SampleViewState {
|
|||
overflow: TextOverflow.ellipsis,
|
||||
),
|
||||
)),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'productId',
|
||||
width: isWebOrDesktop ? 150 : 100,
|
||||
label: Container(
|
||||
|
|
@ -54,7 +55,7 @@ class _FreezePanesDataGridPageState extends SampleViewState {
|
|||
overflow: TextOverflow.ellipsis,
|
||||
),
|
||||
)),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'name',
|
||||
width: isWebOrDesktop ? 180 : 140,
|
||||
label: Container(
|
||||
|
|
@ -65,7 +66,7 @@ class _FreezePanesDataGridPageState extends SampleViewState {
|
|||
overflow: TextOverflow.ellipsis,
|
||||
),
|
||||
)),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'product',
|
||||
width: isWebOrDesktop ? 160 : 100,
|
||||
label: Container(
|
||||
|
|
@ -76,7 +77,7 @@ class _FreezePanesDataGridPageState extends SampleViewState {
|
|||
overflow: TextOverflow.ellipsis,
|
||||
),
|
||||
)),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'orderDate',
|
||||
width: isWebOrDesktop ? 140 : 110,
|
||||
label: Container(
|
||||
|
|
@ -87,7 +88,7 @@ class _FreezePanesDataGridPageState extends SampleViewState {
|
|||
overflow: TextOverflow.ellipsis,
|
||||
),
|
||||
)),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'quantity',
|
||||
width: isWebOrDesktop ? 150 : 90,
|
||||
label: Container(
|
||||
|
|
@ -98,7 +99,7 @@ class _FreezePanesDataGridPageState extends SampleViewState {
|
|||
overflow: TextOverflow.ellipsis,
|
||||
),
|
||||
)),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'city',
|
||||
width: isWebOrDesktop ? 140 : 100,
|
||||
label: Container(
|
||||
|
|
@ -109,7 +110,7 @@ class _FreezePanesDataGridPageState extends SampleViewState {
|
|||
overflow: TextOverflow.ellipsis,
|
||||
),
|
||||
)),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'unitPrice',
|
||||
width: isWebOrDesktop ? 140 : 100,
|
||||
label: Container(
|
||||
|
|
|
|||
|
|
@ -1,10 +1,11 @@
|
|||
///Dart import
|
||||
import 'dart:math' as math;
|
||||
|
||||
import 'package:flutter/foundation.dart';
|
||||
|
||||
/// Package imports
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:intl/intl.dart';
|
||||
import 'package:flutter/foundation.dart';
|
||||
|
||||
/// Barcode import
|
||||
import 'package:syncfusion_flutter_datagrid/datagrid.dart';
|
||||
|
|
@ -36,12 +37,12 @@ class _GettingStartedDataGridState extends SampleViewState {
|
|||
columnWidthMode: ColumnWidthMode.fill,
|
||||
rowHeight: 50,
|
||||
columns: <GridColumn>[
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'image',
|
||||
width: 51,
|
||||
label: const SizedBox.shrink(),
|
||||
),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'team',
|
||||
width: !isWebOrDesktop ? 90 : double.nan,
|
||||
label: Container(
|
||||
|
|
@ -49,20 +50,19 @@ class _GettingStartedDataGridState extends SampleViewState {
|
|||
child: const Text('Team'),
|
||||
),
|
||||
),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'wins',
|
||||
label: const Center(
|
||||
child: Text('W'),
|
||||
),
|
||||
),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'losses',
|
||||
label: const Center(
|
||||
child: Text('L'),
|
||||
)),
|
||||
GridTextColumn(
|
||||
columnName: 'pct', label: const Center(child: Text('WPCT'))),
|
||||
GridTextColumn(
|
||||
GridColumn(columnName: 'pct', label: const Center(child: Text('WPCT'))),
|
||||
GridColumn(
|
||||
columnName: 'gb',
|
||||
label: const Center(child: Text('GB')),
|
||||
),
|
||||
|
|
@ -104,7 +104,7 @@ class _GettingStartedDataGridState extends SampleViewState {
|
|||
return SfDataGrid(
|
||||
source: employeeDataGridSource,
|
||||
columns: <GridColumn>[
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
width: 130,
|
||||
columnName: 'employeeName',
|
||||
label: Container(
|
||||
|
|
@ -115,7 +115,7 @@ class _GettingStartedDataGridState extends SampleViewState {
|
|||
overflow: TextOverflow.ellipsis,
|
||||
),
|
||||
)),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'designation',
|
||||
width: (model.isWeb || model.isMacOS || model.isLinux) ? 150 : 130,
|
||||
label: Container(
|
||||
|
|
@ -127,7 +127,7 @@ class _GettingStartedDataGridState extends SampleViewState {
|
|||
),
|
||||
),
|
||||
),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'mail',
|
||||
width: 180.0,
|
||||
label: Container(
|
||||
|
|
@ -139,7 +139,7 @@ class _GettingStartedDataGridState extends SampleViewState {
|
|||
),
|
||||
),
|
||||
),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'location',
|
||||
width: model.isLinux ? 120.0 : 105.0,
|
||||
label: Container(
|
||||
|
|
@ -151,7 +151,7 @@ class _GettingStartedDataGridState extends SampleViewState {
|
|||
),
|
||||
),
|
||||
),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'status',
|
||||
label: Container(
|
||||
padding: const EdgeInsets.all(8.0),
|
||||
|
|
@ -161,7 +161,7 @@ class _GettingStartedDataGridState extends SampleViewState {
|
|||
overflow: TextOverflow.ellipsis,
|
||||
)),
|
||||
),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'trustworthiness',
|
||||
width: 130,
|
||||
label: Container(
|
||||
|
|
@ -171,7 +171,7 @@ class _GettingStartedDataGridState extends SampleViewState {
|
|||
'Trustworthiness',
|
||||
overflow: TextOverflow.ellipsis,
|
||||
))),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'softwareProficiency',
|
||||
width: 165,
|
||||
label: Container(
|
||||
|
|
@ -181,7 +181,7 @@ class _GettingStartedDataGridState extends SampleViewState {
|
|||
'Software Proficiency',
|
||||
overflow: TextOverflow.ellipsis,
|
||||
))),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'salary',
|
||||
label: Container(
|
||||
padding: const EdgeInsets.all(8.0),
|
||||
|
|
@ -191,7 +191,7 @@ class _GettingStartedDataGridState extends SampleViewState {
|
|||
overflow: TextOverflow.ellipsis,
|
||||
)),
|
||||
),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'address',
|
||||
width: 200,
|
||||
label: Container(
|
||||
|
|
|
|||
|
|
@ -1,10 +1,11 @@
|
|||
/// Dart import
|
||||
import 'dart:math';
|
||||
|
||||
import 'package:flutter/foundation.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
|
||||
/// Package import
|
||||
import 'package:intl/intl.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter/foundation.dart';
|
||||
|
||||
/// DataGrid import
|
||||
import 'package:syncfusion_flutter_datagrid/datagrid.dart';
|
||||
|
|
@ -91,7 +92,7 @@ class _LoadMoreInfiniteScrollingDataGridState extends SampleViewState {
|
|||
|
||||
List<GridColumn> _getColumns() {
|
||||
return <GridColumn>[
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'id',
|
||||
width:
|
||||
(isWebOrDesktop && model.isMobileResolution) ? 120 : double.nan,
|
||||
|
|
@ -104,7 +105,7 @@ class _LoadMoreInfiniteScrollingDataGridState extends SampleViewState {
|
|||
'Order ID',
|
||||
overflow: TextOverflow.ellipsis,
|
||||
))),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'customerId',
|
||||
columnWidthMode:
|
||||
!isWebOrDesktop ? ColumnWidthMode.none : ColumnWidthMode.fill,
|
||||
|
|
@ -120,7 +121,7 @@ class _LoadMoreInfiniteScrollingDataGridState extends SampleViewState {
|
|||
'Customer ID',
|
||||
overflow: TextOverflow.ellipsis,
|
||||
))),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'name',
|
||||
width:
|
||||
(isWebOrDesktop && model.isMobileResolution) ? 120 : double.nan,
|
||||
|
|
@ -131,7 +132,7 @@ class _LoadMoreInfiniteScrollingDataGridState extends SampleViewState {
|
|||
'Name',
|
||||
overflow: TextOverflow.ellipsis,
|
||||
))),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
width:
|
||||
(isWebOrDesktop && model.isMobileResolution) ? 110 : double.nan,
|
||||
columnName: 'freight',
|
||||
|
|
@ -142,7 +143,7 @@ class _LoadMoreInfiniteScrollingDataGridState extends SampleViewState {
|
|||
'Freight',
|
||||
overflow: TextOverflow.ellipsis,
|
||||
))),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'city',
|
||||
width:
|
||||
(isWebOrDesktop && model.isMobileResolution) ? 120 : double.nan,
|
||||
|
|
@ -155,7 +156,7 @@ class _LoadMoreInfiniteScrollingDataGridState extends SampleViewState {
|
|||
'City',
|
||||
overflow: TextOverflow.ellipsis,
|
||||
))),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
width:
|
||||
(isWebOrDesktop && model.isMobileResolution) ? 120 : double.nan,
|
||||
columnName: 'price',
|
||||
|
|
|
|||
|
|
@ -1,10 +1,11 @@
|
|||
/// Dart import
|
||||
import 'dart:math';
|
||||
|
||||
import 'package:flutter/foundation.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
|
||||
/// Package import
|
||||
import 'package:intl/intl.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter/foundation.dart';
|
||||
|
||||
/// DataGrid import
|
||||
import 'package:syncfusion_flutter_datagrid/datagrid.dart';
|
||||
|
|
@ -122,7 +123,7 @@ class _LoadMoreDataGridState extends SampleViewState {
|
|||
|
||||
List<GridColumn> _getColumns() {
|
||||
return <GridColumn>[
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'id',
|
||||
width:
|
||||
(isWebOrDesktop && model.isMobileResolution) ? 120.0 : double.nan,
|
||||
|
|
@ -135,7 +136,7 @@ class _LoadMoreDataGridState extends SampleViewState {
|
|||
'Order ID',
|
||||
overflow: TextOverflow.ellipsis,
|
||||
))),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'customerId',
|
||||
columnWidthMode:
|
||||
!isWebOrDesktop ? ColumnWidthMode.none : ColumnWidthMode.fill,
|
||||
|
|
@ -151,7 +152,7 @@ class _LoadMoreDataGridState extends SampleViewState {
|
|||
'Customer ID',
|
||||
overflow: TextOverflow.ellipsis,
|
||||
))),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'name',
|
||||
width:
|
||||
(isWebOrDesktop && model.isMobileResolution) ? 120.0 : double.nan,
|
||||
|
|
@ -162,7 +163,7 @@ class _LoadMoreDataGridState extends SampleViewState {
|
|||
'Name',
|
||||
overflow: TextOverflow.ellipsis,
|
||||
))),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'freight',
|
||||
width:
|
||||
(isWebOrDesktop && model.isMobileResolution) ? 110.0 : double.nan,
|
||||
|
|
@ -173,7 +174,7 @@ class _LoadMoreDataGridState extends SampleViewState {
|
|||
'Freight',
|
||||
overflow: TextOverflow.ellipsis,
|
||||
))),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'city',
|
||||
width:
|
||||
(isWebOrDesktop && model.isMobileResolution) ? 120.0 : double.nan,
|
||||
|
|
@ -186,7 +187,7 @@ class _LoadMoreDataGridState extends SampleViewState {
|
|||
'City',
|
||||
overflow: TextOverflow.ellipsis,
|
||||
))),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'price',
|
||||
width:
|
||||
(isWebOrDesktop && model.isMobileResolution) ? 120.0 : double.nan,
|
||||
|
|
|
|||
|
|
@ -1,17 +1,18 @@
|
|||
///Dart import
|
||||
import 'dart:math';
|
||||
|
||||
import 'package:flutter/foundation.dart';
|
||||
|
||||
/// Package imports
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:intl/intl.dart';
|
||||
import 'package:flutter/foundation.dart';
|
||||
|
||||
/// DataGrid Package
|
||||
import 'package:syncfusion_flutter_datagrid/datagrid.dart';
|
||||
|
||||
/// Core theme import
|
||||
import 'package:syncfusion_flutter_core/theme.dart';
|
||||
|
||||
/// DataGrid Package
|
||||
import 'package:syncfusion_flutter_datagrid/datagrid.dart';
|
||||
|
||||
/// Local import
|
||||
import '../../../model/sample_view.dart';
|
||||
|
||||
|
|
@ -56,7 +57,7 @@ class _PagingDataGridState extends SampleViewState {
|
|||
? ColumnWidthMode.none
|
||||
: ColumnWidthMode.fill,
|
||||
columns: <GridColumn>[
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'orderID',
|
||||
width: (isWebOrDesktop && model.isMobileResolution)
|
||||
? 120.0
|
||||
|
|
@ -72,7 +73,7 @@ class _PagingDataGridState extends SampleViewState {
|
|||
columnWidthMode: isLandscapeInMobileView
|
||||
? ColumnWidthMode.fill
|
||||
: ColumnWidthMode.none),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'customerID',
|
||||
width: 130.0,
|
||||
label: Container(
|
||||
|
|
@ -83,7 +84,7 @@ class _PagingDataGridState extends SampleViewState {
|
|||
overflow: TextOverflow.ellipsis,
|
||||
),
|
||||
)),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'orderDate',
|
||||
width: !isWebOrDesktop
|
||||
? 110
|
||||
|
|
@ -99,7 +100,7 @@ class _PagingDataGridState extends SampleViewState {
|
|||
),
|
||||
),
|
||||
),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'freight',
|
||||
width: (isWebOrDesktop && model.isMobileResolution)
|
||||
? 120.0
|
||||
|
|
@ -116,7 +117,7 @@ class _PagingDataGridState extends SampleViewState {
|
|||
? ColumnWidthMode.fill
|
||||
: ColumnWidthMode.none,
|
||||
),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'shippingDate',
|
||||
width: !isWebOrDesktop
|
||||
? 120
|
||||
|
|
@ -132,7 +133,7 @@ class _PagingDataGridState extends SampleViewState {
|
|||
),
|
||||
),
|
||||
),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'shipCountry',
|
||||
width: !isWebOrDesktop
|
||||
? 120
|
||||
|
|
|
|||
|
|
@ -1,10 +1,11 @@
|
|||
/// Dart import
|
||||
import 'dart:math';
|
||||
|
||||
import 'package:flutter/foundation.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
|
||||
/// Package import
|
||||
import 'package:intl/intl.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter/foundation.dart';
|
||||
|
||||
/// DataGrid import
|
||||
import 'package:syncfusion_flutter_datagrid/datagrid.dart';
|
||||
|
|
@ -29,7 +30,7 @@ class _PullToRefreshDataGridState extends SampleViewState {
|
|||
|
||||
List<GridColumn> _getColumns() {
|
||||
return <GridColumn>[
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'id',
|
||||
width:
|
||||
(isWebOrDesktop && model.isMobileResolution) ? 120.0 : double.nan,
|
||||
|
|
@ -43,7 +44,7 @@ class _PullToRefreshDataGridState extends SampleViewState {
|
|||
overflow: TextOverflow.ellipsis,
|
||||
),
|
||||
)),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'customerId',
|
||||
columnWidthMode:
|
||||
!isWebOrDesktop ? ColumnWidthMode.none : ColumnWidthMode.fill,
|
||||
|
|
@ -61,7 +62,7 @@ class _PullToRefreshDataGridState extends SampleViewState {
|
|||
),
|
||||
),
|
||||
),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'name',
|
||||
width:
|
||||
(isWebOrDesktop && model.isMobileResolution) ? 120.0 : double.nan,
|
||||
|
|
@ -74,7 +75,7 @@ class _PullToRefreshDataGridState extends SampleViewState {
|
|||
),
|
||||
),
|
||||
),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'freight',
|
||||
width:
|
||||
(isWebOrDesktop && model.isMobileResolution) ? 110.0 : double.nan,
|
||||
|
|
@ -87,7 +88,7 @@ class _PullToRefreshDataGridState extends SampleViewState {
|
|||
),
|
||||
),
|
||||
),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'city',
|
||||
width:
|
||||
(isWebOrDesktop && model.isMobileResolution) ? 120.0 : double.nan,
|
||||
|
|
@ -102,7 +103,7 @@ class _PullToRefreshDataGridState extends SampleViewState {
|
|||
),
|
||||
),
|
||||
),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'price',
|
||||
width:
|
||||
(isWebOrDesktop && model.isMobileResolution) ? 120.0 : double.nan,
|
||||
|
|
@ -130,7 +131,9 @@ class _PullToRefreshDataGridState extends SampleViewState {
|
|||
return Theme(
|
||||
data: ThemeData(
|
||||
brightness: model.themeData.brightness,
|
||||
accentColor: model.backgroundColor,
|
||||
colorScheme: model.themeData.brightness == Brightness.light
|
||||
? ColorScheme.light(primary: model.backgroundColor)
|
||||
: ColorScheme.dark(primary: model.backgroundColor),
|
||||
),
|
||||
child: SfDataGrid(
|
||||
source: employeeDataSource,
|
||||
|
|
|
|||
|
|
@ -2,9 +2,10 @@
|
|||
import 'dart:async';
|
||||
import 'dart:math' as math;
|
||||
|
||||
import 'package:flutter/foundation.dart';
|
||||
|
||||
/// Package imports
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter/foundation.dart';
|
||||
|
||||
/// Barcode import
|
||||
import 'package:syncfusion_flutter_datagrid/datagrid.dart';
|
||||
|
|
@ -52,7 +53,7 @@ class _RealTimeUpdateDataGridPageState extends SampleViewState {
|
|||
? ColumnWidthMode.fill
|
||||
: ColumnWidthMode.none,
|
||||
columns: <GridColumn>[
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'symbol',
|
||||
width: (isWebOrDesktop && model.isMobileResolution)
|
||||
? 150.0
|
||||
|
|
@ -61,7 +62,7 @@ class _RealTimeUpdateDataGridPageState extends SampleViewState {
|
|||
alignment: Alignment.center,
|
||||
child: const Text('Symbol'),
|
||||
)),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'stock',
|
||||
width:
|
||||
(isWebOrDesktop && model.isMobileResolution) ? 150.0 : double.nan,
|
||||
|
|
@ -70,7 +71,7 @@ class _RealTimeUpdateDataGridPageState extends SampleViewState {
|
|||
child: const Text('Stock'),
|
||||
),
|
||||
),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'open',
|
||||
width:
|
||||
(isWebOrDesktop && model.isMobileResolution) ? 150.0 : double.nan,
|
||||
|
|
@ -79,7 +80,7 @@ class _RealTimeUpdateDataGridPageState extends SampleViewState {
|
|||
child: const Text(' Open'),
|
||||
),
|
||||
),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
width: (isWebOrDesktop && model.isMobileResolution) ? 150.0 : 130.0,
|
||||
columnName: 'previousClose',
|
||||
label: Container(
|
||||
|
|
@ -87,7 +88,7 @@ class _RealTimeUpdateDataGridPageState extends SampleViewState {
|
|||
child: const Text('Previous Close'),
|
||||
),
|
||||
),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'lastTrade',
|
||||
width:
|
||||
(isWebOrDesktop && model.isMobileResolution) ? 150.0 : double.nan,
|
||||
|
|
|
|||
|
|
@ -1,10 +1,10 @@
|
|||
/// Flutter package imports
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter/foundation.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:syncfusion_flutter_core/theme.dart';
|
||||
|
||||
/// Barcode imports
|
||||
import 'package:syncfusion_flutter_datagrid/datagrid.dart';
|
||||
import 'package:syncfusion_flutter_core/theme.dart';
|
||||
|
||||
/// Local imports
|
||||
import '../../../model/sample_view.dart';
|
||||
|
|
@ -34,7 +34,7 @@ class _RowHeightDataGridState extends SampleViewState {
|
|||
source: rowHeightDataGridSource,
|
||||
rowHeight: 65.0,
|
||||
columns: <GridColumn>[
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'id',
|
||||
width: isWebOrDesktop ? 135 : 90,
|
||||
label: Container(
|
||||
|
|
@ -48,7 +48,7 @@ class _RowHeightDataGridState extends SampleViewState {
|
|||
),
|
||||
),
|
||||
),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'contactName',
|
||||
width: isWebOrDesktop ? 135 : 140,
|
||||
label: Container(
|
||||
|
|
@ -62,7 +62,7 @@ class _RowHeightDataGridState extends SampleViewState {
|
|||
),
|
||||
),
|
||||
),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'companyName',
|
||||
width: isWebOrDesktop ? 165 : 140,
|
||||
label: Container(
|
||||
|
|
@ -76,7 +76,7 @@ class _RowHeightDataGridState extends SampleViewState {
|
|||
),
|
||||
),
|
||||
),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'address',
|
||||
width: isWebOrDesktop ? 180 : 140,
|
||||
label: Container(
|
||||
|
|
@ -90,7 +90,7 @@ class _RowHeightDataGridState extends SampleViewState {
|
|||
),
|
||||
),
|
||||
),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'city',
|
||||
width: isWebOrDesktop ? 150 : 140,
|
||||
label: Container(
|
||||
|
|
@ -104,7 +104,7 @@ class _RowHeightDataGridState extends SampleViewState {
|
|||
),
|
||||
),
|
||||
),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'country',
|
||||
width: isWebOrDesktop ? 150 : 140,
|
||||
label: Container(
|
||||
|
|
@ -118,7 +118,7 @@ class _RowHeightDataGridState extends SampleViewState {
|
|||
),
|
||||
),
|
||||
),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'designation',
|
||||
width: isWebOrDesktop ? 150 : 140,
|
||||
label: Container(
|
||||
|
|
@ -132,7 +132,7 @@ class _RowHeightDataGridState extends SampleViewState {
|
|||
),
|
||||
),
|
||||
),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'postalCode',
|
||||
width: isWebOrDesktop ? 150 : 140,
|
||||
label: Container(
|
||||
|
|
@ -146,7 +146,7 @@ class _RowHeightDataGridState extends SampleViewState {
|
|||
),
|
||||
),
|
||||
),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'phoneNumber',
|
||||
width: isWebOrDesktop ? 150 : 140,
|
||||
label: Container(
|
||||
|
|
|
|||
|
|
@ -1,10 +1,11 @@
|
|||
/// Dart import
|
||||
import 'dart:math' as math;
|
||||
|
||||
import 'package:flutter/foundation.dart';
|
||||
|
||||
/// Package imports
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:intl/intl.dart';
|
||||
import 'package:flutter/foundation.dart';
|
||||
|
||||
/// Barcode import
|
||||
import 'package:syncfusion_flutter_datagrid/datagrid.dart';
|
||||
|
|
@ -42,16 +43,16 @@ class _SelectionDataGridPageState extends SampleViewState {
|
|||
|
||||
/// Selection modes for drop down widget
|
||||
final List<String> _encoding = <String>[
|
||||
'None',
|
||||
'Single',
|
||||
'Single Deselect',
|
||||
'Multiple',
|
||||
'none',
|
||||
'single',
|
||||
'singleDeselect',
|
||||
'multiple',
|
||||
];
|
||||
|
||||
/// Navigation modes for drop down widget
|
||||
final List<String> _navigation = <String>[
|
||||
'Cell',
|
||||
'Row',
|
||||
'cell',
|
||||
'row',
|
||||
];
|
||||
|
||||
/// DataGridController to do the programmatical selection.
|
||||
|
|
@ -68,16 +69,16 @@ class _SelectionDataGridPageState extends SampleViewState {
|
|||
void _onSelectionModeChanged(String item) {
|
||||
_selectionMode = item;
|
||||
switch (_selectionMode) {
|
||||
case 'None':
|
||||
case 'none':
|
||||
selectionMode = SelectionMode.none;
|
||||
break;
|
||||
case 'Single':
|
||||
case 'single':
|
||||
selectionMode = SelectionMode.single;
|
||||
break;
|
||||
case 'Single Deselect':
|
||||
case 'singleDeselect':
|
||||
selectionMode = SelectionMode.singleDeselect;
|
||||
break;
|
||||
case 'Multiple':
|
||||
case 'multiple':
|
||||
selectionMode = SelectionMode.multiple;
|
||||
break;
|
||||
}
|
||||
|
|
@ -89,10 +90,10 @@ class _SelectionDataGridPageState extends SampleViewState {
|
|||
void _onNavigationModeChanged(String item) {
|
||||
_navigationMode = item;
|
||||
switch (_navigationMode) {
|
||||
case 'Cell':
|
||||
case 'cell':
|
||||
navigationMode = GridNavigationMode.cell;
|
||||
break;
|
||||
case 'Row':
|
||||
case 'row':
|
||||
navigationMode = GridNavigationMode.row;
|
||||
break;
|
||||
}
|
||||
|
|
@ -106,7 +107,7 @@ class _SelectionDataGridPageState extends SampleViewState {
|
|||
|
||||
columns = isWebOrDesktop
|
||||
? <GridColumn>[
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
width: (isWebOrDesktop && model.isMobileResolution)
|
||||
? 120.0
|
||||
: double.nan,
|
||||
|
|
@ -120,7 +121,7 @@ class _SelectionDataGridPageState extends SampleViewState {
|
|||
),
|
||||
),
|
||||
),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
width: (isWebOrDesktop && model.isMobileResolution)
|
||||
? 150.0
|
||||
: double.nan,
|
||||
|
|
@ -134,7 +135,7 @@ class _SelectionDataGridPageState extends SampleViewState {
|
|||
),
|
||||
),
|
||||
),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
width: (isWebOrDesktop && model.isMobileResolution)
|
||||
? 120.0
|
||||
: double.nan,
|
||||
|
|
@ -148,7 +149,7 @@ class _SelectionDataGridPageState extends SampleViewState {
|
|||
),
|
||||
),
|
||||
),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
width: (isWebOrDesktop && model.isMobileResolution)
|
||||
? 110.0
|
||||
: double.nan,
|
||||
|
|
@ -162,7 +163,7 @@ class _SelectionDataGridPageState extends SampleViewState {
|
|||
),
|
||||
),
|
||||
),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
width: (isWebOrDesktop && model.isMobileResolution)
|
||||
? 120.0
|
||||
: double.nan,
|
||||
|
|
@ -176,7 +177,7 @@ class _SelectionDataGridPageState extends SampleViewState {
|
|||
),
|
||||
),
|
||||
),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
width: (isWebOrDesktop && model.isMobileResolution)
|
||||
? 120.0
|
||||
: double.nan,
|
||||
|
|
@ -191,7 +192,7 @@ class _SelectionDataGridPageState extends SampleViewState {
|
|||
))
|
||||
]
|
||||
: <GridColumn>[
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'id',
|
||||
label: Container(
|
||||
padding: const EdgeInsets.all(8),
|
||||
|
|
@ -202,7 +203,7 @@ class _SelectionDataGridPageState extends SampleViewState {
|
|||
),
|
||||
),
|
||||
),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'customerId',
|
||||
width: 110,
|
||||
label: Container(
|
||||
|
|
@ -214,7 +215,7 @@ class _SelectionDataGridPageState extends SampleViewState {
|
|||
),
|
||||
),
|
||||
),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'name',
|
||||
label: Container(
|
||||
padding: const EdgeInsets.all(8),
|
||||
|
|
@ -225,7 +226,7 @@ class _SelectionDataGridPageState extends SampleViewState {
|
|||
),
|
||||
),
|
||||
),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'city',
|
||||
label: Container(
|
||||
padding: const EdgeInsets.all(8),
|
||||
|
|
@ -258,9 +259,9 @@ class _SelectionDataGridPageState extends SampleViewState {
|
|||
void initState() {
|
||||
super.initState();
|
||||
isWebOrDesktop = model.isWeb || model.isDesktop;
|
||||
_selectionMode = 'Multiple';
|
||||
_selectionMode = 'multiple';
|
||||
selectionMode = SelectionMode.multiple;
|
||||
_navigationMode = isWebOrDesktop ? 'Cell' : 'Row';
|
||||
_navigationMode = isWebOrDesktop ? 'cell' : 'row';
|
||||
navigationMode =
|
||||
isWebOrDesktop ? GridNavigationMode.cell : GridNavigationMode.row;
|
||||
selectionDataGridSource =
|
||||
|
|
@ -279,11 +280,9 @@ class _SelectionDataGridPageState extends SampleViewState {
|
|||
children: <Widget>[
|
||||
Expanded(
|
||||
child: Text(
|
||||
'Selection mode:',
|
||||
style: TextStyle(
|
||||
fontSize: 16.0,
|
||||
fontWeight: FontWeight.bold,
|
||||
color: model.textColor),
|
||||
'Selection mode',
|
||||
softWrap: false,
|
||||
style: TextStyle(fontSize: 16.0, color: model.textColor),
|
||||
),
|
||||
),
|
||||
Expanded(
|
||||
|
|
@ -297,7 +296,7 @@ class _SelectionDataGridPageState extends SampleViewState {
|
|||
value: _selectionMode,
|
||||
items: _encoding.map((String value) {
|
||||
return DropdownMenuItem<String>(
|
||||
value: (value != null) ? value : 'Multiple',
|
||||
value: (value != null) ? value : 'multiple',
|
||||
child: Text(value,
|
||||
textAlign: TextAlign.center,
|
||||
style: TextStyle(color: model.textColor)));
|
||||
|
|
@ -319,11 +318,11 @@ class _SelectionDataGridPageState extends SampleViewState {
|
|||
children: <Widget>[
|
||||
Expanded(
|
||||
child: Text(
|
||||
'Navigation mode:',
|
||||
style: TextStyle(
|
||||
fontSize: 16.0,
|
||||
fontWeight: FontWeight.bold,
|
||||
color: model.textColor),
|
||||
model.isWebFullView
|
||||
? 'Navigation \nmode'
|
||||
: 'Navigation mode',
|
||||
softWrap: false,
|
||||
style: TextStyle(fontSize: 16.0, color: model.textColor),
|
||||
),
|
||||
),
|
||||
Expanded(
|
||||
|
|
|
|||
|
|
@ -80,8 +80,8 @@ class _SortingDataGridState extends SampleViewState {
|
|||
shrinkWrap: true,
|
||||
children: <Widget>[
|
||||
ListTile(
|
||||
title:
|
||||
Text('Allow sorting', style: TextStyle(color: model.textColor)),
|
||||
title: Text('Allow sorting',
|
||||
softWrap: false, style: TextStyle(color: model.textColor)),
|
||||
trailing: Transform.scale(
|
||||
scale: 0.8,
|
||||
child: CupertinoSwitch(
|
||||
|
|
@ -95,7 +95,11 @@ class _SortingDataGridState extends SampleViewState {
|
|||
)),
|
||||
),
|
||||
ListTile(
|
||||
title: Text('Allow multiple column sorting',
|
||||
title: Text(
|
||||
model.isWebFullView
|
||||
? 'Allow multiple \ncolumn sorting'
|
||||
: 'Allow multiple column sorting',
|
||||
softWrap: false,
|
||||
style: TextStyle(color: model.textColor)),
|
||||
trailing: Transform.scale(
|
||||
scale: 0.8,
|
||||
|
|
@ -109,7 +113,11 @@ class _SortingDataGridState extends SampleViewState {
|
|||
},
|
||||
))),
|
||||
ListTile(
|
||||
title: Text('Allow tri-state sorting',
|
||||
title: Text(
|
||||
model.isWebFullView
|
||||
? 'Allow tri-state \nsorting'
|
||||
: 'Allow tri-state sorting',
|
||||
softWrap: false,
|
||||
style: TextStyle(color: model.textColor)),
|
||||
trailing: Transform.scale(
|
||||
scale: 0.8,
|
||||
|
|
@ -134,11 +142,19 @@ class _SortingDataGridState extends SampleViewState {
|
|||
});
|
||||
},
|
||||
)),
|
||||
title: Text('Allow sorting for the Name column',
|
||||
title: Text(
|
||||
model.isWebFullView
|
||||
? 'Allow sorting for the \nName column'
|
||||
: 'Allow sorting for the Name column',
|
||||
softWrap: false,
|
||||
style: TextStyle(color: model.textColor)),
|
||||
),
|
||||
ListTile(
|
||||
title: Text('Display sort sequence numbers',
|
||||
title: Text(
|
||||
model.isWebFullView
|
||||
? 'Display sort \nsequence numbers'
|
||||
: 'Display sort sequence numbers',
|
||||
softWrap: false,
|
||||
style: TextStyle(color: model.textColor)),
|
||||
trailing: Transform.scale(
|
||||
scale: 0.8,
|
||||
|
|
@ -158,7 +174,7 @@ class _SortingDataGridState extends SampleViewState {
|
|||
|
||||
List<GridColumn> getColumns() {
|
||||
return <GridColumn>[
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'id',
|
||||
columnWidthMode:
|
||||
!isWebOrDesktop ? ColumnWidthMode.none : ColumnWidthMode.fill,
|
||||
|
|
@ -175,7 +191,7 @@ class _SortingDataGridState extends SampleViewState {
|
|||
overflow: TextOverflow.ellipsis,
|
||||
),
|
||||
)),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'customerId',
|
||||
columnWidthMode:
|
||||
!isWebOrDesktop ? ColumnWidthMode.none : ColumnWidthMode.fill,
|
||||
|
|
@ -192,7 +208,7 @@ class _SortingDataGridState extends SampleViewState {
|
|||
overflow: TextOverflow.ellipsis,
|
||||
),
|
||||
)),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'name',
|
||||
width: !isWebOrDesktop
|
||||
? 80
|
||||
|
|
@ -208,7 +224,7 @@ class _SortingDataGridState extends SampleViewState {
|
|||
),
|
||||
),
|
||||
allowSorting: allowColumnSorting),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'freight',
|
||||
width: !isWebOrDesktop
|
||||
? 120
|
||||
|
|
@ -224,7 +240,7 @@ class _SortingDataGridState extends SampleViewState {
|
|||
),
|
||||
),
|
||||
),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'city',
|
||||
width: !isWebOrDesktop
|
||||
? 90
|
||||
|
|
@ -242,7 +258,7 @@ class _SortingDataGridState extends SampleViewState {
|
|||
),
|
||||
),
|
||||
),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'price',
|
||||
width:
|
||||
(isWebOrDesktop && model.isMobileResolution) ? 120.0 : double.nan,
|
||||
|
|
|
|||
|
|
@ -1,13 +1,13 @@
|
|||
/// Dart import
|
||||
import 'dart:math';
|
||||
|
||||
import 'package:collection/collection.dart';
|
||||
import 'package:flutter/foundation.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter/services.dart';
|
||||
import 'package:flutter_examples/model/sample_view.dart';
|
||||
import 'package:intl/intl.dart';
|
||||
import 'package:syncfusion_flutter_datagrid/datagrid.dart';
|
||||
import 'package:collection/collection.dart';
|
||||
|
||||
/// Renders column type data grid
|
||||
class SwipingDataGrid extends SampleView {
|
||||
|
|
@ -51,6 +51,14 @@ class _SwipingDataGridState extends SampleViewState {
|
|||
priceController = TextEditingController();
|
||||
}
|
||||
|
||||
RegExp _getRegExp(TextInputType keyboardType, String columnName) {
|
||||
return keyboardType == TextInputType.number
|
||||
? columnName == 'Freight' || columnName == 'Price'
|
||||
? RegExp('[0-9.]')
|
||||
: RegExp('[0-9]')
|
||||
: RegExp('[a-zA-Z ]');
|
||||
}
|
||||
|
||||
/// Building the each field with label and TextFormField
|
||||
Widget _buildRow(
|
||||
{required TextEditingController controller, required String columnName}) {
|
||||
|
|
@ -58,10 +66,9 @@ class _SwipingDataGridState extends SampleViewState {
|
|||
<String>['City', 'Name'].contains(columnName)
|
||||
? TextInputType.text
|
||||
: TextInputType.number;
|
||||
final FilteringTextInputFormatter inputFormatter =
|
||||
<String>['City', 'Name'].contains(columnName)
|
||||
? FilteringTextInputFormatter.allow(RegExp('[a-zA-Z]'))
|
||||
: FilteringTextInputFormatter.allow(RegExp('[0-9]'));
|
||||
|
||||
// Holds the regular expression pattern based on the column type.
|
||||
final RegExp regExp = _getRegExp(keyboardType, columnName);
|
||||
|
||||
return Row(
|
||||
children: <Widget>[
|
||||
|
|
@ -80,7 +87,9 @@ class _SwipingDataGridState extends SampleViewState {
|
|||
},
|
||||
controller: controller,
|
||||
keyboardType: keyboardType,
|
||||
inputFormatters: <TextInputFormatter>[inputFormatter],
|
||||
inputFormatters: <TextInputFormatter>[
|
||||
FilteringTextInputFormatter.allow(regExp)
|
||||
],
|
||||
),
|
||||
)
|
||||
],
|
||||
|
|
@ -332,7 +341,7 @@ class _SwipingDataGridState extends SampleViewState {
|
|||
List<GridColumn> columns;
|
||||
columns = isWebOrDesktop
|
||||
? <GridColumn>[
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'id',
|
||||
width: (isWebOrDesktop && model.isMobileResolution)
|
||||
? 120.0
|
||||
|
|
@ -345,7 +354,7 @@ class _SwipingDataGridState extends SampleViewState {
|
|||
overflow: TextOverflow.ellipsis,
|
||||
),
|
||||
)),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'customerId',
|
||||
width: (isWebOrDesktop && model.isMobileResolution)
|
||||
? 150.0
|
||||
|
|
@ -358,7 +367,7 @@ class _SwipingDataGridState extends SampleViewState {
|
|||
overflow: TextOverflow.ellipsis,
|
||||
),
|
||||
)),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'name',
|
||||
width: (isWebOrDesktop && model.isMobileResolution)
|
||||
? 120.0
|
||||
|
|
@ -372,7 +381,7 @@ class _SwipingDataGridState extends SampleViewState {
|
|||
),
|
||||
),
|
||||
),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'freight',
|
||||
width: (isWebOrDesktop && model.isMobileResolution)
|
||||
? 110.0
|
||||
|
|
@ -386,7 +395,7 @@ class _SwipingDataGridState extends SampleViewState {
|
|||
),
|
||||
),
|
||||
),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'city',
|
||||
width: (isWebOrDesktop && model.isMobileResolution)
|
||||
? 120.0
|
||||
|
|
@ -400,7 +409,7 @@ class _SwipingDataGridState extends SampleViewState {
|
|||
),
|
||||
),
|
||||
),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'price',
|
||||
width: (isWebOrDesktop && model.isMobileResolution)
|
||||
? 120.0
|
||||
|
|
@ -416,7 +425,7 @@ class _SwipingDataGridState extends SampleViewState {
|
|||
)
|
||||
]
|
||||
: <GridColumn>[
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'id',
|
||||
label: Container(
|
||||
padding: const EdgeInsets.all(8),
|
||||
|
|
@ -427,7 +436,7 @@ class _SwipingDataGridState extends SampleViewState {
|
|||
),
|
||||
),
|
||||
),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'customerId',
|
||||
columnWidthMode: isLandscapeInMobileView
|
||||
? ColumnWidthMode.fill
|
||||
|
|
@ -441,7 +450,7 @@ class _SwipingDataGridState extends SampleViewState {
|
|||
),
|
||||
),
|
||||
),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'name',
|
||||
label: Container(
|
||||
padding: const EdgeInsets.all(8),
|
||||
|
|
@ -452,7 +461,7 @@ class _SwipingDataGridState extends SampleViewState {
|
|||
),
|
||||
),
|
||||
),
|
||||
GridTextColumn(
|
||||
GridColumn(
|
||||
columnName: 'city',
|
||||
label: Container(
|
||||
padding: const EdgeInsets.all(8),
|
||||
|
|
|
|||
|
|
@ -26,29 +26,31 @@ class _GettingStartedDatePickerState extends SampleViewState {
|
|||
|
||||
final DateRangePickerController _controller = DateRangePickerController();
|
||||
DateRangePickerSelectionMode _selectionMode =
|
||||
DateRangePickerSelectionMode.range;
|
||||
bool _showTrailingAndLeadingDates = true;
|
||||
DateRangePickerSelectionMode.extendableRange;
|
||||
bool _showTrailingAndLeadingDates = false;
|
||||
bool _enablePastDates = true;
|
||||
bool _enableSwipingSelection = true;
|
||||
bool _enableViewNavigation = true;
|
||||
bool _showActionButtons = true;
|
||||
bool _isWeb = false;
|
||||
late Orientation _deviceOrientation;
|
||||
bool _showWeekNumber = false;
|
||||
|
||||
String _selectionModeString = 'Range';
|
||||
String _selectionModeString = 'extendableRange';
|
||||
final List<String> _selectionModeList = <String>[
|
||||
'Single',
|
||||
'Multiple',
|
||||
'Range',
|
||||
'Multi Range',
|
||||
'single',
|
||||
'multiple',
|
||||
'range',
|
||||
'multiRange',
|
||||
'extendableRange'
|
||||
].toList();
|
||||
|
||||
String _viewModeString = 'Month';
|
||||
String _viewModeString = 'month';
|
||||
final List<String> _viewModeList = <String>[
|
||||
'Month',
|
||||
'Year',
|
||||
'Decade',
|
||||
'Century',
|
||||
'month',
|
||||
'year',
|
||||
'decade',
|
||||
'century',
|
||||
].toList();
|
||||
|
||||
@override
|
||||
|
|
@ -105,7 +107,8 @@ class _GettingStartedDatePickerState extends SampleViewState {
|
|||
Widget build(BuildContext context) {
|
||||
final bool _enableMultiView = _isWeb &&
|
||||
(_selectionMode == DateRangePickerSelectionMode.range ||
|
||||
_selectionMode == DateRangePickerSelectionMode.multiRange);
|
||||
_selectionMode == DateRangePickerSelectionMode.multiRange ||
|
||||
_selectionMode == DateRangePickerSelectionMode.extendableRange);
|
||||
final Widget cardView = Card(
|
||||
elevation: 10,
|
||||
margin: model.isWebFullView
|
||||
|
|
@ -128,6 +131,7 @@ class _GettingStartedDatePickerState extends SampleViewState {
|
|||
DateTime.now().subtract(const Duration(days: 200)),
|
||||
DateTime.now().add(const Duration(days: 200)),
|
||||
_enableMultiView,
|
||||
_showWeekNumber,
|
||||
context)),
|
||||
));
|
||||
return Scaffold(
|
||||
|
|
@ -141,7 +145,7 @@ class _GettingStartedDatePickerState extends SampleViewState {
|
|||
child: model.isWebFullView
|
||||
? Center(
|
||||
child: Container(
|
||||
width: !_enableMultiView ? 400 : 700,
|
||||
width: !_enableMultiView ? 550 : 700,
|
||||
height: 600,
|
||||
child: cardView))
|
||||
: ListView(children: <Widget>[
|
||||
|
|
@ -166,13 +170,13 @@ class _GettingStartedDatePickerState extends SampleViewState {
|
|||
/// selected in the dropdown menu set to the view property of the controller.
|
||||
void onPickerViewChange(String value) {
|
||||
_viewModeString = value;
|
||||
if (value == 'Month') {
|
||||
if (value == 'month') {
|
||||
_controller.view = DateRangePickerView.month;
|
||||
} else if (value == 'Year') {
|
||||
} else if (value == 'year') {
|
||||
_controller.view = DateRangePickerView.year;
|
||||
} else if (value == 'Decade') {
|
||||
} else if (value == 'decade') {
|
||||
_controller.view = DateRangePickerView.decade;
|
||||
} else if (value == 'Century') {
|
||||
} else if (value == 'century') {
|
||||
_controller.view = DateRangePickerView.century;
|
||||
}
|
||||
setState(() {
|
||||
|
|
@ -185,14 +189,16 @@ class _GettingStartedDatePickerState extends SampleViewState {
|
|||
/// which is set to the selection mode property of date range picker.
|
||||
void onSelectionModeChange(String value) {
|
||||
_selectionModeString = value;
|
||||
if (value == 'Single') {
|
||||
if (value == 'single') {
|
||||
_selectionMode = DateRangePickerSelectionMode.single;
|
||||
} else if (value == 'Multiple') {
|
||||
} else if (value == 'multiple') {
|
||||
_selectionMode = DateRangePickerSelectionMode.multiple;
|
||||
} else if (value == 'Range') {
|
||||
} else if (value == 'range') {
|
||||
_selectionMode = DateRangePickerSelectionMode.range;
|
||||
} else if (value == 'Multi Range') {
|
||||
} else if (value == 'multiRange') {
|
||||
_selectionMode = DateRangePickerSelectionMode.multiRange;
|
||||
} else if (value == 'extendableRange') {
|
||||
_selectionMode = DateRangePickerSelectionMode.extendableRange;
|
||||
}
|
||||
setState(() {
|
||||
/// update the date range picker selection mode changes
|
||||
|
|
@ -213,6 +219,8 @@ class _GettingStartedDatePickerState extends SampleViewState {
|
|||
_enableViewNavigation = value;
|
||||
} else if (property == 'ShowActionButtons') {
|
||||
_showActionButtons = value;
|
||||
} else if (property == 'ShowWeekNumber') {
|
||||
_showWeekNumber = value;
|
||||
}
|
||||
setState(() {
|
||||
/// update the bool value changes
|
||||
|
|
@ -223,6 +231,20 @@ class _GettingStartedDatePickerState extends SampleViewState {
|
|||
Widget buildSettings(BuildContext context) {
|
||||
return StatefulBuilder(
|
||||
builder: (BuildContext context, StateSetter stateSetter) {
|
||||
_controller.addPropertyChangedListener((String value) {
|
||||
if (value == 'view') {
|
||||
if (_controller.view == DateRangePickerView.month) {
|
||||
_viewModeString = 'month';
|
||||
} else if (_controller.view == DateRangePickerView.year) {
|
||||
_viewModeString = 'year';
|
||||
} else if (_controller.view == DateRangePickerView.decade) {
|
||||
_viewModeString = 'decade';
|
||||
} else if (_controller.view == DateRangePickerView.century) {
|
||||
_viewModeString = 'century';
|
||||
}
|
||||
stateSetter(() {});
|
||||
}
|
||||
});
|
||||
final List<Widget> propertyOptions = <Widget>[];
|
||||
propertyOptions.add(Container(
|
||||
height: 50,
|
||||
|
|
@ -231,11 +253,11 @@ class _GettingStartedDatePickerState extends SampleViewState {
|
|||
mainAxisAlignment: MainAxisAlignment.start,
|
||||
children: <Widget>[
|
||||
Expanded(
|
||||
flex: 6,
|
||||
flex: 5,
|
||||
child: Text('Picker view',
|
||||
style: TextStyle(fontSize: 16.0, color: model.textColor))),
|
||||
Expanded(
|
||||
flex: 4,
|
||||
flex: 5,
|
||||
child: Container(
|
||||
alignment: Alignment.bottomLeft,
|
||||
child: DropdownButton<String>(
|
||||
|
|
@ -244,7 +266,7 @@ class _GettingStartedDatePickerState extends SampleViewState {
|
|||
value: _viewModeString,
|
||||
items: _viewModeList.map((String value) {
|
||||
return DropdownMenuItem<String>(
|
||||
value: (value != null) ? value : 'Month',
|
||||
value: (value != null) ? value : 'month',
|
||||
child: Text(value,
|
||||
textAlign: TextAlign.center,
|
||||
style: TextStyle(color: model.textColor)));
|
||||
|
|
@ -265,11 +287,11 @@ class _GettingStartedDatePickerState extends SampleViewState {
|
|||
mainAxisAlignment: MainAxisAlignment.start,
|
||||
children: <Widget>[
|
||||
Expanded(
|
||||
flex: 6,
|
||||
flex: model.isWebFullView ? 4 : 5,
|
||||
child: Text('Selection mode',
|
||||
style: TextStyle(fontSize: 16.0, color: model.textColor))),
|
||||
Expanded(
|
||||
flex: 4,
|
||||
flex: model.isWebFullView ? 6 : 5,
|
||||
child: Container(
|
||||
padding: const EdgeInsets.all(0),
|
||||
alignment: Alignment.bottomLeft,
|
||||
|
|
@ -279,7 +301,7 @@ class _GettingStartedDatePickerState extends SampleViewState {
|
|||
value: _selectionModeString,
|
||||
items: _selectionModeList.map((String value) {
|
||||
return DropdownMenuItem<String>(
|
||||
value: (value != null) ? value : 'Range',
|
||||
value: (value != null) ? value : 'extendableRange',
|
||||
child: Text(value,
|
||||
textAlign: TextAlign.center,
|
||||
style: TextStyle(color: model.textColor)));
|
||||
|
|
@ -300,11 +322,11 @@ class _GettingStartedDatePickerState extends SampleViewState {
|
|||
mainAxisAlignment: MainAxisAlignment.start,
|
||||
children: <Widget>[
|
||||
Expanded(
|
||||
flex: 6,
|
||||
flex: 5,
|
||||
child: Text('Display date',
|
||||
style: TextStyle(fontSize: 16.0, color: model.textColor))),
|
||||
Expanded(
|
||||
flex: 4,
|
||||
flex: 5,
|
||||
child: Container(
|
||||
padding: const EdgeInsets.all(0),
|
||||
alignment: Alignment.centerLeft,
|
||||
|
|
@ -325,11 +347,11 @@ class _GettingStartedDatePickerState extends SampleViewState {
|
|||
mainAxisAlignment: MainAxisAlignment.start,
|
||||
children: <Widget>[
|
||||
Expanded(
|
||||
flex: 6,
|
||||
flex: 7,
|
||||
child: Text('Show action buttons',
|
||||
style: TextStyle(fontSize: 16.0, color: model.textColor))),
|
||||
Expanded(
|
||||
flex: 4,
|
||||
flex: 3,
|
||||
child: Container(
|
||||
padding: const EdgeInsets.all(0),
|
||||
child: Theme(
|
||||
|
|
@ -361,11 +383,11 @@ class _GettingStartedDatePickerState extends SampleViewState {
|
|||
mainAxisAlignment: MainAxisAlignment.start,
|
||||
children: <Widget>[
|
||||
Expanded(
|
||||
flex: 6,
|
||||
flex: 7,
|
||||
child: Text('Enable view navigation',
|
||||
style: TextStyle(fontSize: 16.0, color: model.textColor))),
|
||||
Expanded(
|
||||
flex: 4,
|
||||
flex: 3,
|
||||
child: Container(
|
||||
padding: const EdgeInsets.all(0),
|
||||
child: Theme(
|
||||
|
|
@ -398,46 +420,11 @@ class _GettingStartedDatePickerState extends SampleViewState {
|
|||
mainAxisAlignment: MainAxisAlignment.start,
|
||||
children: <Widget>[
|
||||
Expanded(
|
||||
flex: 6,
|
||||
child: Text('Show trailing/leading dates',
|
||||
style: TextStyle(fontSize: 16.0, color: model.textColor))),
|
||||
Expanded(
|
||||
flex: 4,
|
||||
child: Container(
|
||||
padding: const EdgeInsets.all(0),
|
||||
child: Theme(
|
||||
data: Theme.of(context).copyWith(
|
||||
canvasColor: model.bottomSheetBackgroundColor),
|
||||
child: Container(
|
||||
alignment: Alignment.centerLeft,
|
||||
child: Transform.scale(
|
||||
scale: 0.8,
|
||||
child: CupertinoSwitch(
|
||||
value: _showTrailingAndLeadingDates,
|
||||
onChanged: (dynamic value) {
|
||||
onBoolValueChange(
|
||||
'ShowLeadingTrailingDates', value);
|
||||
stateSetter(() {});
|
||||
},
|
||||
activeColor: model.backgroundColor,
|
||||
))),
|
||||
),
|
||||
))
|
||||
],
|
||||
),
|
||||
));
|
||||
propertyOptions.add(Container(
|
||||
height: 50,
|
||||
child: Row(
|
||||
crossAxisAlignment: CrossAxisAlignment.center,
|
||||
mainAxisAlignment: MainAxisAlignment.start,
|
||||
children: <Widget>[
|
||||
Expanded(
|
||||
flex: 6,
|
||||
flex: 7,
|
||||
child: Text('Enable past dates',
|
||||
style: TextStyle(fontSize: 16.0, color: model.textColor))),
|
||||
Expanded(
|
||||
flex: 4,
|
||||
flex: 3,
|
||||
child: Container(
|
||||
padding: const EdgeInsets.all(0),
|
||||
child: Theme(
|
||||
|
|
@ -467,11 +454,11 @@ class _GettingStartedDatePickerState extends SampleViewState {
|
|||
mainAxisAlignment: MainAxisAlignment.start,
|
||||
children: <Widget>[
|
||||
Expanded(
|
||||
flex: 6,
|
||||
flex: 7,
|
||||
child: Text('Enable swipe selection',
|
||||
style: TextStyle(fontSize: 16.0, color: model.textColor))),
|
||||
Expanded(
|
||||
flex: 4,
|
||||
flex: 3,
|
||||
child: Container(
|
||||
padding: const EdgeInsets.all(0),
|
||||
child: Theme(
|
||||
|
|
@ -497,8 +484,79 @@ class _GettingStartedDatePickerState extends SampleViewState {
|
|||
],
|
||||
),
|
||||
));
|
||||
propertyOptions.add(Container(
|
||||
height: 50,
|
||||
child: Row(
|
||||
crossAxisAlignment: CrossAxisAlignment.center,
|
||||
mainAxisAlignment: MainAxisAlignment.start,
|
||||
children: <Widget>[
|
||||
Expanded(
|
||||
flex: 7,
|
||||
child: Text('Show week number',
|
||||
style: TextStyle(fontSize: 16.0, color: model.textColor))),
|
||||
Expanded(
|
||||
flex: 3,
|
||||
child: Container(
|
||||
padding: const EdgeInsets.all(0),
|
||||
child: Theme(
|
||||
data: Theme.of(context).copyWith(
|
||||
canvasColor: model.bottomSheetBackgroundColor),
|
||||
child: Container(
|
||||
alignment: Alignment.centerLeft,
|
||||
child: Transform.scale(
|
||||
scale: 0.8,
|
||||
child: CupertinoSwitch(
|
||||
value: _showWeekNumber,
|
||||
onChanged: (dynamic value) {
|
||||
setState(() {
|
||||
onBoolValueChange('ShowWeekNumber', value);
|
||||
stateSetter(() {});
|
||||
});
|
||||
},
|
||||
activeColor: model.backgroundColor,
|
||||
))),
|
||||
),
|
||||
))
|
||||
],
|
||||
),
|
||||
));
|
||||
propertyOptions.add(Container(
|
||||
height: 50,
|
||||
child: Row(
|
||||
crossAxisAlignment: CrossAxisAlignment.center,
|
||||
mainAxisAlignment: MainAxisAlignment.start,
|
||||
children: <Widget>[
|
||||
Expanded(
|
||||
flex: 7,
|
||||
child: Text('Show trailing and leading dates',
|
||||
style: TextStyle(fontSize: 16.0, color: model.textColor))),
|
||||
Expanded(
|
||||
flex: 3,
|
||||
child: Container(
|
||||
padding: const EdgeInsets.all(0),
|
||||
child: Theme(
|
||||
data: Theme.of(context).copyWith(
|
||||
canvasColor: model.bottomSheetBackgroundColor),
|
||||
child: Container(
|
||||
alignment: Alignment.centerLeft,
|
||||
child: Transform.scale(
|
||||
scale: 0.8,
|
||||
child: CupertinoSwitch(
|
||||
value: _showTrailingAndLeadingDates,
|
||||
onChanged: (dynamic value) {
|
||||
onBoolValueChange(
|
||||
'ShowLeadingTrailingDates', value);
|
||||
stateSetter(() {});
|
||||
},
|
||||
activeColor: model.backgroundColor,
|
||||
))),
|
||||
),
|
||||
))
|
||||
],
|
||||
),
|
||||
));
|
||||
return Padding(
|
||||
padding: const EdgeInsets.fromLTRB(15, 10, 0, 5),
|
||||
padding: const EdgeInsets.fromLTRB(0, 10, 0, 5),
|
||||
child: model.isWebFullView
|
||||
? Column(
|
||||
children: propertyOptions,
|
||||
|
|
@ -608,6 +666,7 @@ SfDateRangePicker _getGettingStartedDatePicker(
|
|||
DateTime minDate,
|
||||
DateTime maxDate,
|
||||
bool enableMultiView,
|
||||
bool showWeekNumber,
|
||||
BuildContext context) {
|
||||
return SfDateRangePicker(
|
||||
enablePastDates: enablePastDates,
|
||||
|
|
@ -638,6 +697,7 @@ SfDateRangePicker _getGettingStartedDatePicker(
|
|||
},
|
||||
monthViewSettings: DateRangePickerMonthViewSettings(
|
||||
enableSwipeSelection: enableSwipingSelection,
|
||||
showTrailingAndLeadingDates: showLeading),
|
||||
showTrailingAndLeadingDates: showLeading,
|
||||
showWeekNumber: showWeekNumber),
|
||||
);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -27,27 +27,29 @@ class _HijriDatePickerState extends SampleViewState {
|
|||
|
||||
final HijriDatePickerController _controller = HijriDatePickerController();
|
||||
DateRangePickerSelectionMode _selectionMode =
|
||||
DateRangePickerSelectionMode.range;
|
||||
DateRangePickerSelectionMode.extendableRange;
|
||||
bool _enablePastDates = true;
|
||||
bool _enableSwipingSelection = true;
|
||||
bool _enableViewNavigation = true;
|
||||
bool _showActionButtons = true;
|
||||
bool _isWeb = false;
|
||||
bool _showWeekNumber = false;
|
||||
late Orientation _deviceOrientation;
|
||||
|
||||
String _selectionModeString = 'Range';
|
||||
String _selectionModeString = 'extendableRange';
|
||||
final List<String> _selectionModeList = <String>[
|
||||
'Single',
|
||||
'Multiple',
|
||||
'Range',
|
||||
'Multi Range',
|
||||
'single',
|
||||
'multiple',
|
||||
'range',
|
||||
'multiRange',
|
||||
'extendableRange'
|
||||
].toList();
|
||||
|
||||
String _viewModeString = 'Month';
|
||||
String _viewModeString = 'month';
|
||||
final List<String> _viewModeList = <String>[
|
||||
'Month',
|
||||
'Year',
|
||||
'Decade',
|
||||
'month',
|
||||
'year',
|
||||
'decade',
|
||||
].toList();
|
||||
|
||||
@override
|
||||
|
|
@ -104,7 +106,8 @@ class _HijriDatePickerState extends SampleViewState {
|
|||
Widget build(BuildContext context) {
|
||||
final bool enableMultiView = _isWeb &&
|
||||
(_selectionMode == DateRangePickerSelectionMode.range ||
|
||||
_selectionMode == DateRangePickerSelectionMode.multiRange);
|
||||
_selectionMode == DateRangePickerSelectionMode.multiRange ||
|
||||
_selectionMode == DateRangePickerSelectionMode.extendableRange);
|
||||
final Widget cardView = Card(
|
||||
elevation: 10,
|
||||
margin: model.isWebFullView
|
||||
|
|
@ -126,6 +129,7 @@ class _HijriDatePickerState extends SampleViewState {
|
|||
HijriDateTime.now().subtract(const Duration(days: 200)),
|
||||
HijriDateTime.now().add(const Duration(days: 200)),
|
||||
enableMultiView,
|
||||
_showWeekNumber,
|
||||
context)),
|
||||
));
|
||||
return Scaffold(
|
||||
|
|
@ -139,7 +143,7 @@ class _HijriDatePickerState extends SampleViewState {
|
|||
child: model.isWebFullView
|
||||
? Center(
|
||||
child: Container(
|
||||
width: !enableMultiView ? 400 : 700,
|
||||
width: !enableMultiView ? 550 : 700,
|
||||
height: 600,
|
||||
child: cardView))
|
||||
: ListView(padding: EdgeInsets.zero, children: <Widget>[
|
||||
|
|
@ -164,11 +168,11 @@ class _HijriDatePickerState extends SampleViewState {
|
|||
/// selected in the dropdown menu set to the view property of the controller.
|
||||
void onPickerViewChange(String value) {
|
||||
_viewModeString = value;
|
||||
if (value == 'Month') {
|
||||
if (value == 'month') {
|
||||
_controller.view = HijriDatePickerView.month;
|
||||
} else if (value == 'Year') {
|
||||
} else if (value == 'year') {
|
||||
_controller.view = HijriDatePickerView.year;
|
||||
} else if (value == 'Decade') {
|
||||
} else if (value == 'decade') {
|
||||
_controller.view = HijriDatePickerView.decade;
|
||||
}
|
||||
setState(() {
|
||||
|
|
@ -181,14 +185,16 @@ class _HijriDatePickerState extends SampleViewState {
|
|||
/// which is set to the selection mode property of date range picker.
|
||||
void onSelectionModeChange(String value) {
|
||||
_selectionModeString = value;
|
||||
if (value == 'Single') {
|
||||
if (value == 'single') {
|
||||
_selectionMode = DateRangePickerSelectionMode.single;
|
||||
} else if (value == 'Multiple') {
|
||||
} else if (value == 'multiple') {
|
||||
_selectionMode = DateRangePickerSelectionMode.multiple;
|
||||
} else if (value == 'Range') {
|
||||
} else if (value == 'range') {
|
||||
_selectionMode = DateRangePickerSelectionMode.range;
|
||||
} else if (value == 'Multi Range') {
|
||||
} else if (value == 'multiRange') {
|
||||
_selectionMode = DateRangePickerSelectionMode.multiRange;
|
||||
} else if (value == 'extendableRange') {
|
||||
_selectionMode = DateRangePickerSelectionMode.extendableRange;
|
||||
}
|
||||
setState(() {
|
||||
/// update the date range picker selection mode changes
|
||||
|
|
@ -207,6 +213,8 @@ class _HijriDatePickerState extends SampleViewState {
|
|||
_enableViewNavigation = value;
|
||||
} else if (property == 'ShowActionButtons') {
|
||||
_showActionButtons = value;
|
||||
} else if (property == 'showWeekNumber') {
|
||||
_showWeekNumber = value;
|
||||
}
|
||||
|
||||
setState(() {
|
||||
|
|
@ -218,6 +226,18 @@ class _HijriDatePickerState extends SampleViewState {
|
|||
Widget buildSettings(BuildContext context) {
|
||||
return StatefulBuilder(
|
||||
builder: (BuildContext context, StateSetter stateSetter) {
|
||||
_controller.addPropertyChangedListener((String value) {
|
||||
if (value == 'view') {
|
||||
if (_controller.view == HijriDatePickerView.month) {
|
||||
_viewModeString = 'month';
|
||||
} else if (_controller.view == HijriDatePickerView.year) {
|
||||
_viewModeString = 'year';
|
||||
} else if (_controller.view == HijriDatePickerView.decade) {
|
||||
_viewModeString = 'decade';
|
||||
}
|
||||
stateSetter(() {});
|
||||
}
|
||||
});
|
||||
final List<Widget> propertyOptions = <Widget>[];
|
||||
propertyOptions.add(Container(
|
||||
height: 50,
|
||||
|
|
@ -226,11 +246,11 @@ class _HijriDatePickerState extends SampleViewState {
|
|||
mainAxisAlignment: MainAxisAlignment.start,
|
||||
children: <Widget>[
|
||||
Expanded(
|
||||
flex: 6,
|
||||
flex: 5,
|
||||
child: Text('Picker view',
|
||||
style: TextStyle(fontSize: 16.0, color: model.textColor))),
|
||||
Expanded(
|
||||
flex: 4,
|
||||
flex: 5,
|
||||
child: Container(
|
||||
alignment: Alignment.bottomLeft,
|
||||
child: DropdownButton<String>(
|
||||
|
|
@ -239,7 +259,7 @@ class _HijriDatePickerState extends SampleViewState {
|
|||
value: _viewModeString,
|
||||
items: _viewModeList.map((String value) {
|
||||
return DropdownMenuItem<String>(
|
||||
value: (value != null) ? value : 'Month',
|
||||
value: (value != null) ? value : 'month',
|
||||
child: Text(value,
|
||||
textAlign: TextAlign.center,
|
||||
style: TextStyle(color: model.textColor)));
|
||||
|
|
@ -260,11 +280,11 @@ class _HijriDatePickerState extends SampleViewState {
|
|||
mainAxisAlignment: MainAxisAlignment.start,
|
||||
children: <Widget>[
|
||||
Expanded(
|
||||
flex: 6,
|
||||
flex: model.isWebFullView ? 4 : 5,
|
||||
child: Text('Selection mode',
|
||||
style: TextStyle(fontSize: 16.0, color: model.textColor))),
|
||||
Expanded(
|
||||
flex: 4,
|
||||
flex: model.isWebFullView ? 6 : 5,
|
||||
child: Container(
|
||||
padding: const EdgeInsets.all(0),
|
||||
alignment: Alignment.bottomLeft,
|
||||
|
|
@ -274,7 +294,7 @@ class _HijriDatePickerState extends SampleViewState {
|
|||
value: _selectionModeString,
|
||||
items: _selectionModeList.map((String value) {
|
||||
return DropdownMenuItem<String>(
|
||||
value: (value != null) ? value : 'Range',
|
||||
value: (value != null) ? value : 'extendableRange',
|
||||
child: Text(value,
|
||||
textAlign: TextAlign.center,
|
||||
style: TextStyle(color: model.textColor)));
|
||||
|
|
@ -295,11 +315,11 @@ class _HijriDatePickerState extends SampleViewState {
|
|||
mainAxisAlignment: MainAxisAlignment.start,
|
||||
children: <Widget>[
|
||||
Expanded(
|
||||
flex: 6,
|
||||
flex: 5,
|
||||
child: Text('Display date',
|
||||
style: TextStyle(fontSize: 16.0, color: model.textColor))),
|
||||
Expanded(
|
||||
flex: 4,
|
||||
flex: 5,
|
||||
child: Container(
|
||||
padding: const EdgeInsets.all(0),
|
||||
alignment: Alignment.centerLeft,
|
||||
|
|
@ -323,11 +343,11 @@ class _HijriDatePickerState extends SampleViewState {
|
|||
mainAxisAlignment: MainAxisAlignment.start,
|
||||
children: <Widget>[
|
||||
Expanded(
|
||||
flex: 6,
|
||||
flex: 7,
|
||||
child: Text('Show action buttons',
|
||||
style: TextStyle(fontSize: 16.0, color: model.textColor))),
|
||||
Expanded(
|
||||
flex: 4,
|
||||
flex: 3,
|
||||
child: Container(
|
||||
padding: const EdgeInsets.all(0),
|
||||
child: Theme(
|
||||
|
|
@ -359,11 +379,11 @@ class _HijriDatePickerState extends SampleViewState {
|
|||
mainAxisAlignment: MainAxisAlignment.start,
|
||||
children: <Widget>[
|
||||
Expanded(
|
||||
flex: 6,
|
||||
flex: 7,
|
||||
child: Text('Enable view navigation',
|
||||
style: TextStyle(fontSize: 16.0, color: model.textColor))),
|
||||
Expanded(
|
||||
flex: 4,
|
||||
flex: 3,
|
||||
child: Container(
|
||||
padding: const EdgeInsets.all(0),
|
||||
child: Theme(
|
||||
|
|
@ -396,11 +416,11 @@ class _HijriDatePickerState extends SampleViewState {
|
|||
mainAxisAlignment: MainAxisAlignment.start,
|
||||
children: <Widget>[
|
||||
Expanded(
|
||||
flex: 6,
|
||||
flex: 7,
|
||||
child: Text('Enable past dates',
|
||||
style: TextStyle(fontSize: 16.0, color: model.textColor))),
|
||||
Expanded(
|
||||
flex: 4,
|
||||
flex: 3,
|
||||
child: Container(
|
||||
padding: const EdgeInsets.all(0),
|
||||
child: Theme(
|
||||
|
|
@ -430,11 +450,11 @@ class _HijriDatePickerState extends SampleViewState {
|
|||
mainAxisAlignment: MainAxisAlignment.start,
|
||||
children: <Widget>[
|
||||
Expanded(
|
||||
flex: 6,
|
||||
flex: 7,
|
||||
child: Text('Enable swipe selection',
|
||||
style: TextStyle(fontSize: 16.0, color: model.textColor))),
|
||||
Expanded(
|
||||
flex: 4,
|
||||
flex: 3,
|
||||
child: Container(
|
||||
padding: const EdgeInsets.all(0),
|
||||
child: Theme(
|
||||
|
|
@ -460,9 +480,45 @@ class _HijriDatePickerState extends SampleViewState {
|
|||
],
|
||||
),
|
||||
));
|
||||
propertyOptions.add(Container(
|
||||
height: 50,
|
||||
child: Row(
|
||||
crossAxisAlignment: CrossAxisAlignment.center,
|
||||
mainAxisAlignment: MainAxisAlignment.start,
|
||||
children: <Widget>[
|
||||
Expanded(
|
||||
flex: 7,
|
||||
child: Text('Show week number',
|
||||
style: TextStyle(fontSize: 16.0, color: model.textColor))),
|
||||
Expanded(
|
||||
flex: 3,
|
||||
child: Container(
|
||||
padding: const EdgeInsets.all(0),
|
||||
child: Theme(
|
||||
data: Theme.of(context).copyWith(
|
||||
canvasColor: model.bottomSheetBackgroundColor),
|
||||
child: Container(
|
||||
alignment: Alignment.centerLeft,
|
||||
child: Transform.scale(
|
||||
scale: 0.8,
|
||||
child: CupertinoSwitch(
|
||||
value: _showWeekNumber,
|
||||
onChanged: (dynamic value) {
|
||||
setState(() {
|
||||
onBoolValueChange('showWeekNumber', value);
|
||||
stateSetter(() {});
|
||||
});
|
||||
},
|
||||
activeColor: model.backgroundColor,
|
||||
))),
|
||||
),
|
||||
))
|
||||
],
|
||||
),
|
||||
));
|
||||
|
||||
return Padding(
|
||||
padding: const EdgeInsets.fromLTRB(15, 10, 0, 5),
|
||||
padding: const EdgeInsets.fromLTRB(0, 10, 0, 5),
|
||||
child: model.isWebFullView
|
||||
? Column(
|
||||
children: propertyOptions,
|
||||
|
|
@ -575,6 +631,7 @@ SfHijriDateRangePicker _getGettingStartedDatePicker(
|
|||
HijriDateTime minDate,
|
||||
HijriDateTime maxDate,
|
||||
bool enableMultiView,
|
||||
bool showWeekNumber,
|
||||
BuildContext context) {
|
||||
return SfHijriDateRangePicker(
|
||||
enablePastDates: enablePastDates,
|
||||
|
|
@ -604,6 +661,7 @@ SfHijriDateRangePicker _getGettingStartedDatePicker(
|
|||
));
|
||||
},
|
||||
monthViewSettings: HijriDatePickerMonthViewSettings(
|
||||
enableSwipeSelection: _enableSwipingSelection),
|
||||
enableSwipeSelection: _enableSwipingSelection,
|
||||
showWeekNumber: showWeekNumber),
|
||||
);
|
||||
}
|
||||
|
|
|
|||
Некоторые файлы не были показаны из-за слишком большого количества измененных файлов Показать больше
Загрузка…
Ссылка в новой задаче