adeptabhi_widgets 1.4.0 copy "adeptabhi_widgets: ^1.4.0" to clipboard
adeptabhi_widgets: ^1.4.0 copied to clipboard

A customizable data table, dropdowns, and auto complete textfields. For any queries or updates, feel free to reach out at adeptabhi0808@gmail.com

example/example.md

✨ How To Use #

✅ AdeptDataTable #

import 'package:flutter/material.dart';
import 'package:adeptabhi_widgets/view/adept_data_table.dart';

final List<Map<String, String>> students1 = [
  {'id': '1', 'name': 'Rahul', 'class': '12'},
  {'id': '2', 'name': 'Sneha', 'class': '11'},
  {'id': '3', 'name': 'Vikas', 'class': '10'},
  {'id': '4', 'name': 'Anjali', 'class': '9'},
  {'id': '5', 'name': 'Rohit', 'class': '10'},
  {'id': '6', 'name': 'Neha', 'class': '11'},
  {'id': '7', 'name': 'Aman', 'class': '12'},
  {'id': '8', 'name': 'Kajal', 'class': '10'},
  {'id': '9', 'name': 'Raj', 'class': '9'},
  {'id': '10', 'name': 'Divya', 'class': '11'},
  {'id': '11', 'name': 'Manoj', 'class': '12'},
  {'id': '12', 'name': 'Rekha', 'class': '10'},
  {'id': '13', 'name': 'Suresh', 'class': '9'},
  {'id': '14', 'name': 'Megha', 'class': '11'},
  {'id': '15', 'name': 'Deepak', 'class': '12'},
  {'id': '16', 'name': 'Priya', 'class': '10'},
  {'id': '17', 'name': 'Karan', 'class': '11'},
  {'id': '18', 'name': 'Riya', 'class': '12'},
  {'id': '19', 'name': 'Ishaan', 'class': '10'},
  {'id': '20', 'name': 'Tanvi', 'class': '9'},
];

List<Map<String, String>> students2 = [
  {'id': '1','name': 'Rahul','roll': '12','status': 'Pass','remark': 'Good','address': 'Delhi'},
  {'id': '2','name': 'Sneha','roll': '13','status': 'Pass','remark': 'Excellent','address': 'Mumbai'},
  {'id': '3','name': 'Vikas','roll': '10','status': 'Fail','remark': 'Needs Improvement','address': 'Pune'},
  {'id': '4','name': 'Anjali','roll': '14','status': 'Pass','remark': 'Very Good','address': 'Lucknow'},
  {'id': '5','name': 'Rohit','roll': '11','status': 'Pass','remark': 'Good','address': 'Kolkata'},
  {'id': '6','name': 'Neha','roll': '9','status': 'Fail','remark': 'Poor','address': 'Chennai'},
  {'id': '7','name': 'Aman','roll': '15','status': 'Pass','remark': 'Good','address': 'Hyderabad'},
  {'id': '8','name': 'Kajal','roll': '16','status': 'Pass','remark': 'Very Good','address': 'Ahmedabad'},
  {'id': '9','name': 'Raj','roll': '7','status': 'Fail','remark': 'Needs Improvement','address': 'Jaipur'},
  {'id': '10','name': 'Divya','roll': '13','status': 'Pass','remark': 'Good','address': 'Indore'},
  {'id': '11','name': 'Manoj','roll': '12','status': 'Pass','remark': 'Excellent','address': 'Patna'},
  {'id': '12','name': 'Rekha','roll': '8','status': 'Fail','remark': 'Poor','address': 'Bhopal'},
  {'id': '13','name': 'Suresh','roll': '14','status': 'Pass','remark': 'Good','address': 'Nashik'},
  {'id': '14','name': 'Megha','roll': '15','status': 'Pass','remark': 'Very Good','address': 'Amritsar'},
  {'id': '15','name': 'Deepak','roll': '10','status': 'Fail','remark': 'Needs Attention','address': 'Varanasi'},
  {'id': '16','name': 'Priya','roll': '11','status': 'Pass','remark': 'Good','address': 'Nagpur'},
  {'id': '17','name': 'Karan','roll': '9','status': 'Fail','remark': 'Below Average','address': 'Ranchi'},
  {'id': '18','name': 'Riya','roll': '13','status': 'Pass','remark': 'Excellent','address': 'Surat'},
  {'id': '19','name': 'Ishaan','roll': '12','status': 'Pass','remark': 'Very Good','address': 'Kanpur'},
  {'id': '20','name': 'Tanvi','roll': '10','status': 'Fail','remark': 'Poor','address': 'Jodhpur'},
];

Widget build(BuildContext context) {
  return ListView(
    children: [
      //FIRST EXAMPLE
      AdeptDataTable(
        theme: AdeptDataTableTheme(
          headerBgColor: Colors.purpleAccent.shade100,
          headerTextStyle: const TextStyle(color: Colors.black),
        ),
        label: 'Data Table 1',
        onSearch: (searchText) {
          // Your search function logic here
        },
        dataTableMdlList: [
          AdeptDataTableMdl(
            columnNames: ['ID', 'Name', 'Class'],
            dataRows: students1.map((student) {
              return AdeptDataRow(
                rowCellsTheme: AdeptDataTableCellTheme(
                  color: Colors.lightBlue.shade100,
                ),
                cells: [
                  AdeptDataTableCell(text: student['id'].toString()),
                  AdeptDataTableCell(text: student['name'] ?? ''),
                  AdeptDataTableCell(text: student['class'] ?? ''),
                ],
              );
            }).toList(),
          ),
        ],
      ),

      //SECOND EXAMPLE

      AdeptDataTable(
          noOfRowInPage: 5,
          label: 'Data Table 2',
          theme: AdeptDataTableTheme(headerBgColor: Colors.purple.shade200),
          onSearch: (searchText) {
            // Your search function logic here
          },
          dataTableMdlList: [
            AdeptDataTableMdl(
                columnNames: ['ID', 'Name', 'Roll No', 'Status'],
                dataRows: students2.map((student) {
                  return AdeptDataRow(
                    rowCellsTheme: AdeptDataTableCellTheme(
                      color: student['status'] == 'Pass'
                          ? Colors.green.shade100
                          : Colors.red.shade100,
                    ),
                    cells: [
                      AdeptDataTableCell(text: student['id'].toString()),
                      AdeptDataTableCell(text: student['name'].toString()),
                      AdeptDataTableCell(text: student['roll'].toString()),
                      AdeptDataTableCell(text: student['status'].toString()),
                    ],
                  );
                }).toList()),
            AdeptDataTableMdl(
                parentHeaderName: 'Details',
                columnNames: ['Remark', 'Address'],
                dataRows: students2.map((student) {
                  return AdeptDataRow(
                    rowCellsTheme: AdeptDataTableCellTheme(
                      color: student['status'] == 'Pass'
                          ? Colors.green.shade100
                          : Colors.red.shade100,
                    ),
                    cells: [
                      AdeptDataTableCell(text: student['remark'].toString()),
                      AdeptDataTableCell(text: student['address'].toString()),
                    ],
                  );
                }).toList()),
          ])
    ],
  );
}

📸 DataTable 1 #

DataTable 1

📸 DataTable 2 #

DataTable 2

✅ AdeptDropDown #

import 'package:adeptabhi_widgets/view/adept_drop_down.dart';
class SingleDropDownMdl {
  int id;
  String name;
  SingleDropDownMdl({
    required this.id,
    required this.name,
  });
}

class MultiDropDownMdl {
  int id;
  String name;
  bool isVisible;
  MultiDropDownMdl({
    required this.id,
    required this.name,
    required this.isVisible,
  });
}

ValueNotifier<SingleDropDownMdl?> singleDropDownEx = ValueNotifier(null);

List<SingleDropDownMdl> list1 = [
  SingleDropDownMdl(id: 1, name: "Rohan"),
  SingleDropDownMdl(id: 2, name: "Sneha"),
  SingleDropDownMdl(id: 3, name: "Aman"),
  SingleDropDownMdl(id: 4, name: "Divya"),
  SingleDropDownMdl(id: 5, name: "Vikas"),
];

List<MultiDropDownMdl> list2 = [
  MultiDropDownMdl(id: 1, name: "Rohan", isVisible: false),
  MultiDropDownMdl(id: 2, name: "Sneha", isVisible: false),
  MultiDropDownMdl(id: 3, name: "Aman", isVisible: false),
  MultiDropDownMdl(id: 4, name: "Divya", isVisible: false),
  MultiDropDownMdl(id: 5, name: "Vikas", isVisible: false),
];

Widget build(BuildContext context) {
  return ListView(children: [
    //SINGLE DROP DOWN EXAMPLE
    AdeptDropDown<SingleDropDownMdl>(
        label: 'DropDown',
        valueNotifier: singleDropDownEx,
        getList: (lable) => list1,
        getText: (mdl) => mdl.name),
    const SizedBox(height: 700),

    //MULTI DROP DOWN EXAMPLE
    AdeptMultiDropDown<MultiDropDownMdl>(
      label: 'Multi DropDown',
      getList: (label) => list2,
      getText: (mdl) => mdl.name,
      onChanged: (label) {},
    ),
  ]);
}

📸 DropDown #

DropDown DropDown2
Before Selection After Selection

📸 Multi DropDown #

MultiDropDown MultiDropDown2
Before Selection After Selection

✅ AdeptAutoComplete #

import 'package:adeptabhi_widgets/view/adept_text_auto_complete.dart';
class IdNameMdl {
  int id;
  String name;
  IdNameMdl({
    required this.id,
    required this.name,
  });
}

TextEditingController txtCon = TextEditingController();

List<IdNameMdl> list = [
  IdNameMdl(id: 1, name: "Aman"),
  IdNameMdl(id: 2, name: "Anjali"),
  IdNameMdl(id: 3, name: "Aarti"),
  IdNameMdl(id: 4, name: "Sneha"),
  IdNameMdl(id: 5, name: "Saurabh"),
  IdNameMdl(id: 6, name: "Sumit"),
  IdNameMdl(id: 7, name: "Rohan"),
  IdNameMdl(id: 8, name: "Raj"),
  IdNameMdl(id: 9, name: "Ritika"),
];

Widget build(BuildContext context) {
  return AdeptTextAutoComplete<IdNameMdl>(
                label: 'Auto Complete',
                hintText: 'Please Enter',
                txtCon: txtCon,
                getList:(label)=> list,
                getText: (mdl) => mdl.name,
                filterCondition: (mdl, txt) =>
                    mdl.name.toLowerCase().startsWith(txt.toLowerCase()),
                onChanged: (IdNameMdl? mdl) {});
}

📸 AutoComplete #

MultiDropDown MultiDropDown2
Before Selection After Selection
4
likes
135
points
145
downloads

Publisher

unverified uploader

Weekly Downloads

A customizable data table, dropdowns, and auto complete textfields. For any queries or updates, feel free to reach out at adeptabhi0808@gmail.com

Repository (GitHub)

Documentation

API reference

License

MIT (license)

Dependencies

cupertino_icons, flutter

More

Packages that depend on adeptabhi_widgets