base on This repository contains the Syncfusion Flutter UI widgets examples and the guide to use them. # Syncfusion Flutter 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. <img src="images/flutter_examples.png"/> ## Table of contents * [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) ## <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 | [3.24.0]([https://code.visualstudio.com/download](https://storage.googleapis.com/flutter_infra_release/releases/stable/windows/flutter_windows_3.24.0-stable.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. ## <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, Web, Windows, Linux, iOS, and Mac 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) | | Chat | [Link](https://github.com/syncfusion/flutter-examples/tree/master/lib/samples/chat) | | 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 using the following commands: **Windows & Linux** Run code: Ctrl + F5 Run with debugging: F5 or Run > Start Debugging Stop debugging: Shift + F5 Restart debugging: Ctrl + Shift + F5 **MacOS** Run code: Cmd + F5 Run with debugging: F5 or Run > Start Debugging Stop debugging: Shift + Cmd + F5 Restart debugging: Cmd + Shift + F5 **Web (VS Code in the Browser)** Run code: Ctrl + F5 Run with debugging: 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://flutter.syncfusion.com"><img src="https://cdn.syncfusion.com/content/images/FTControl/web-sample-browser.png"/></a> <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> </p> <p align="center"> <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> <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 [email protected] | 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) and [WinUI](https://www.syncfusion.com/winui-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. ", Assign "at most 3 tags" to the expected json: {"id":"9648","tags":[]} "only from the tags list I provide: [{"id":77,"name":"3d"},{"id":89,"name":"agent"},{"id":17,"name":"ai"},{"id":54,"name":"algorithm"},{"id":24,"name":"api"},{"id":44,"name":"authentication"},{"id":3,"name":"aws"},{"id":27,"name":"backend"},{"id":60,"name":"benchmark"},{"id":72,"name":"best-practices"},{"id":39,"name":"bitcoin"},{"id":37,"name":"blockchain"},{"id":1,"name":"blog"},{"id":45,"name":"bundler"},{"id":58,"name":"cache"},{"id":21,"name":"chat"},{"id":49,"name":"cicd"},{"id":4,"name":"cli"},{"id":64,"name":"cloud-native"},{"id":48,"name":"cms"},{"id":61,"name":"compiler"},{"id":68,"name":"containerization"},{"id":92,"name":"crm"},{"id":34,"name":"data"},{"id":47,"name":"database"},{"id":8,"name":"declarative-gui "},{"id":9,"name":"deploy-tool"},{"id":53,"name":"desktop-app"},{"id":6,"name":"dev-exp-lib"},{"id":59,"name":"dev-tool"},{"id":13,"name":"ecommerce"},{"id":26,"name":"editor"},{"id":66,"name":"emulator"},{"id":62,"name":"filesystem"},{"id":80,"name":"finance"},{"id":15,"name":"firmware"},{"id":73,"name":"for-fun"},{"id":2,"name":"framework"},{"id":11,"name":"frontend"},{"id":22,"name":"game"},{"id":81,"name":"game-engine "},{"id":23,"name":"graphql"},{"id":84,"name":"gui"},{"id":91,"name":"http"},{"id":5,"name":"http-client"},{"id":51,"name":"iac"},{"id":30,"name":"ide"},{"id":78,"name":"iot"},{"id":40,"name":"json"},{"id":83,"name":"julian"},{"id":38,"name":"k8s"},{"id":31,"name":"language"},{"id":10,"name":"learning-resource"},{"id":33,"name":"lib"},{"id":41,"name":"linter"},{"id":28,"name":"lms"},{"id":16,"name":"logging"},{"id":76,"name":"low-code"},{"id":90,"name":"message-queue"},{"id":42,"name":"mobile-app"},{"id":18,"name":"monitoring"},{"id":36,"name":"networking"},{"id":7,"name":"node-version"},{"id":55,"name":"nosql"},{"id":57,"name":"observability"},{"id":46,"name":"orm"},{"id":52,"name":"os"},{"id":14,"name":"parser"},{"id":74,"name":"react"},{"id":82,"name":"real-time"},{"id":56,"name":"robot"},{"id":65,"name":"runtime"},{"id":32,"name":"sdk"},{"id":71,"name":"search"},{"id":63,"name":"secrets"},{"id":25,"name":"security"},{"id":85,"name":"server"},{"id":86,"name":"serverless"},{"id":70,"name":"storage"},{"id":75,"name":"system-design"},{"id":79,"name":"terminal"},{"id":29,"name":"testing"},{"id":12,"name":"ui"},{"id":50,"name":"ux"},{"id":88,"name":"video"},{"id":20,"name":"web-app"},{"id":35,"name":"web-server"},{"id":43,"name":"webassembly"},{"id":69,"name":"workflow"},{"id":87,"name":"yaml"}]" returns me the "expected json"