pit_components 0.2.0

  • README.md
  • CHANGELOG.md
  • Example
  • Installing
  • Versions
  • 78

Components by PIT #

A bundle that contains our custom components, mostly just override the default Flutter widgets and custom its style and some of its functional.

Note: This plugin is still under development, and some Components might not be available yet or still has so many bugs.

  • The date picker components inspired by flutter_calendar_carousel, I clone it and override some of its functional and add selection types (single, multi or range)

Installation #

First, add pit_components as a dependency in your pubspec.yaml file.

pit_components: ^0.0.18

Example #

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);

  final String title;

  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  DateTime _date;
  String _radioButtonValue = "";
  List<String> possibleValue = [];

  double _lowerValue = 0.0;
  double _upperValue = 100.0;

  @override
  void initState() {
    super.initState();
    possibleValue.add("Possible Value 1");
    possibleValue.add("Possible Value 2");
  }

  Widget _buildRadioButton(Widget icon, String value) {
    return AdvRow(divider: RowDivider(12.0), children: [
      icon,
      Text(value,
          style: ts.fw700.merge(ts.fs12).copyWith(
              color:
                  _radioButtonValue == value ? Colors.black87 : Colors.black38))
    ]);
  }

  @override
  Widget build(BuildContext context) {
    AdvTextFieldController controller = AdvTextFieldController(
        label: "Just TextField MaxLines 1",
        hint: "TextField MaxLines 1 Example",
        maxLines: 1 /*,
        text: "00\\00\\0000 ~ 00(00)00®000"*/
        );
    AdvTextFieldController plainController = AdvTextFieldController(
        enable: false,
        hint: "Plain TextField Example",
        label: "Plain TextField");

    AdvRadioGroupController radioButtonController = new AdvRadioGroupController(
        checkedValue: _radioButtonValue,
        itemList: possibleValue.map((value) {
          IconData activeIconData;
          IconData inactiveIconData;

          if (value == possibleValue[0]) {
            activeIconData = Icons.cloud;
            inactiveIconData = Icons.cloud_off;
          } else {
            activeIconData = Icons.alarm;
            inactiveIconData = Icons.alarm_off;
          }

          return RadioGroupItem(value,
              activeItem: _buildRadioButton(Icon(activeIconData), value),
              inactiveItem: _buildRadioButton(Icon(inactiveIconData), value));
        }).toList());

    AdvRangeSliderController sliderController = AdvRangeSliderController(
        lowerValue: _lowerValue,
        upperValue: _upperValue,
        min: 0.0,
        max: 100.0,
        divisions: 10,
        hint: "Advanced Slider");

    AdvGroupCheckController groupCheckController = AdvGroupCheckController(
        checkedValue: "",
        itemList: [
          GroupCheckItem('Image', 'Image'),
          GroupCheckItem('Document', 'Document')
        ]);

    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: SingleChildScrollView(
        child: Container(
          color: Color(0xffFCF6E8),
          child: AdvColumn(
            padding: EdgeInsets.symmetric(horizontal: 16.0),
            onlyInner: false,
            divider: ColumnDivider(16.0),
            children: [
              AdvRow(divider: RowDivider(8.0), children: [
                Expanded(
                    child: AdvTextField(
                  controller: controller,
//                  inputFormatters: [
//                    DateTextFormatter("dd\\MM\\yyyy ~ HH(mm)ss®SSS")
//                  ],
                )),
                Expanded(
                    child: AdvTextFieldPlain(
                  controller: plainController,
                )),
              ]),
              AdvRow(divider: RowDivider(8.0), children: [
                Expanded(child: AdvButton("Normal", enable: false)),
                Expanded(
                    child:
                        AdvButton("Outlined", onlyBorder: true, enable: false)),
                Expanded(
                    child: AdvButton("Reverse", reverse: true, enable: false))
              ]),
              AdvButton(
                "Go to List View with Bottom Button",
                width: double.infinity,
                buttonSize: ButtonSize.small,
                onPressed: () {
                  Navigator.push(
                    context,
                    MaterialPageRoute(
                        builder: (context) => AnotherPage(),
                        settings:
                            RouteSettings(name: widget.runtimeType.toString())),
                  );
                },
              ),
              AdvRow(divider: RowDivider(8.0), children: [
                Expanded(
                  child: AdvButtonWithIcon(
                      "", Icon(Icons.ring_volume), Axis.vertical),
                ),
                Expanded(
                    child: AdvButtonWithIcon(
                        "", Icon(Icons.airline_seat_flat_angled), Axis.vertical,
                        onPressed: () {}, onlyBorder: true)),
                Expanded(
                    child: AdvButtonWithIcon(
                        "", Icon(Icons.headset), Axis.vertical,
                        onPressed: () {}, reverse: true)),
              ]),
              Visibility(
                  visible: _date != null,
                  child: AdvText("You picked date => $_date")),
              AdvDatePicker(
                onChanged: (List value) {
                  if (value.length == 0) return;

                  setState(() {
                    _date = value[0];
                  });
                },
//                markedDates: [
//                  MarkedDate(DateTime(2018, 11, 20),
//                      "20th November - Maulid Nabi Muhammad")
//                ],
                controller: AdvDatePickerController(
                    label: "Just TextField MaxLines 1",
                    enable: false,
                    hint: "test",
                    initialValue: _date ?? DateTime.now(),
                    dates: [_date ?? DateTime.now()]),
              ),
              AdvDropDown(
                onChanged: (String value) {},
                items: {
                  "data 1": "display 1",
                  "data 2": "display 2",
                  "data 3": "display 3"
                },
              ),
              AdvSingleDigitInputter(
                text: "12345",
                digitCount: 5,
              ),
              AdvRadioGroup(
                direction: Axis.vertical,
                controller: radioButtonController,
                divider: 8.0,
                callback: _handleRadioValueChange,
              ),
              AdvRangeSlider(
                controller: sliderController,
                onChanged: (low, high) {
                  setState(() {
                    _lowerValue = low;
                    _upperValue = high;
                  });
                },
              ),
              AdvBadge(
                size: 50.0,
                text: "5,000.00",
              ),
              AdvGroupCheck(
                controller: groupCheckController,
                callback: (itemSelected) async {},
              ),
              AdvChooser(
                enable: false,
                label: "Chooser Example",
                hint: "This is chooser example",
                items: {
                  "data 1": "display 1",
                  "data 2": "display 2",
                  "data 3": "display 3",
                  "data 4": "display 4",
                  "data 5": "display 5",
                  "data 6": "display 6",
                  "data 7": "display 7",
                  "data 8": "display 8",
                  "data 9": "display 9",
                  "data 10": "display 10",
                  "data 11": "display 11",
                  "data 12": "display 12",
                  "data 13": "display 13",
                  "data 14": "display 14",
                  "data 15": "display 15",
                  "data 16": "display 16",
                  "data 17": "display 17",
                  "data 18": "display 18",
                  "data 19": "display 19",
                  "data 20": "display 20",
                  "data 21": "display 21",
                  "data 22": "display 22",
                  "data 23": "display 24 ",
                  "data 24": "display 24",
                  "data 25": "display 25"
                },
              )
            ],
          ),
        ),
      ),
    );
  }

  void _handleRadioValueChange(String value) {
    setState(() {
      _radioButtonValue = value;
    });
  }
}

0.0.1 #

  • Test Release

0.0.2 #

  • Initial Release (with Button, Column, DatePicker, Dropdown, Row, SingleDigitInputter, Text with Ellipsis, TextField)

0.0.3 #

  • intl dependency issue fixed

0.0.4 #

  • More components added (Badge, GroupCheck, ListTile, ListView, ListView with Buttom Section, Radio Button, Range Slider, Visibility, Date Formatter for TextField))

0.0.5 #

  • More component added (FutureBuider)

0.0.6 #

  • More component added (ExpansionPanel)

0.0.7 #

  • Bug fix for ExpansionPanel

0.0.8 #

  • Bug fix for ExpansionPanel and more component added (TextWithNumber)

0.0.9 #

  • Bug fixes

0.0.10 #

  • Bug fixes

0.0.11 #

  • Bug fixes and more component added (Chooser)

0.0.12 #

  • Bug fixes

0.0.13 #

  • Bug fixes and more component added (ScrollableBottomSheet)

0.0.14 #

  • Pick date & Pick from Chooser now can be used independently

0.0.15 #

  • More component added (InfiniteListView)

0.0.16 #

  • Bug fixes

0.0.17 #

  • Bug fixes

0.0.18 #

  • More component added (RatingBar)

0.0.19 #

  • Bug fixes

0.0.20 #

  • Bug fixes

0.0.21 #

  • Bug fixes

0.0.22 #

  • Bug fixes and more component added (Increment, TextField with Button)

0.0.23 #

  • Bug fixes

0.0.24 #

  • Bug fixes

0.0.25 #

  • Text Field excess padding fixed

0.0.26 #

  • Text Field's line expansion improved, Text maxLines improved (not only constraint to maxLines, but also maxHeight from LayoutBuilder)

0.0.27 #

  • Text Field's null icons error fixed

0.0.28 #

  • Row, Column and ListView now can have null as children, will be ignored if it is null and will despise the divider

0.0.29 #

  • Bug fixes

0.0.30 #

  • Single Digit Inputer bug fix

0.0.31 #

  • Text Field controller bug fix

0.0.31+1 #

  • Adv State first trial

0.0.31+2 #

  • Adv Future Builder remake trial

0.0.32 #

  • Adv Image Preview added

0.0.33 #

  • Adv Loading with Barrier added

0.0.33+1 #

  • Adv Loading with Barrier bug fixes

0.0.33+2 #

  • Bug fixes

0.0.33+3 #

  • Bug fixes

0.0.34 #

  • Bug fixes

0.0.35 #

  • Bug fixes

0.0.35+1 #

  • Bug fixes

0.0.35+2 #

  • Bug fixes AdvTextField, AdvTextFieldPlain, AdvTextFieldWithButton

0.0.36 #

  • New component added AdvChooserPlain

0.0.36+1 #

  • Bug fix (AdvTextFieldPlain maxHeight issue)

0.0.36+2 #

  • Bug fix (all AdvTextField text length issue regarding selection changing)

0.1.0 #

  • Date Picker and Adv State improved while Loading with Barrier's changed

0.1.0+1 #

  • Bug fix (some warnings and bugs)

0.1.0+2 #

  • Changes were made (chooser and pick from chooser now will use GroupCheckItem to be its argument to support icon in each items), and bug fix (some warnings and bugs)

0.1.0+3 #

  • Bug fix several fixes

0.2.0 #

  • Refactor to Flutter 0.1.0 stable channel

example/README.md

import 'package:flutter/material.dart';
import 'package:pit_components/components/adv_badge.dart';
import 'package:pit_components/components/adv_button.dart';
import 'package:pit_components/components/adv_chooser.dart';
import 'package:pit_components/components/adv_column.dart';
import 'package:pit_components/components/adv_date_picker.dart';
import 'package:pit_components/components/adv_drop_down.dart';
import 'package:pit_components/components/adv_group_check.dart';
import 'package:pit_components/components/adv_list_view_with_bottom.dart';
import 'package:pit_components/components/adv_radio_button.dart';
import 'package:pit_components/components/adv_range_slider.dart';
import 'package:pit_components/components/adv_row.dart';
import 'package:pit_components/components/adv_single_digit_inputter.dart';
import 'package:pit_components/components/adv_text.dart';
import 'package:pit_components/components/adv_text_field.dart';
import 'package:pit_components/components/adv_text_field_plain.dart';
import 'package:pit_components/components/controllers/adv_date_picker_controller.dart';
import 'package:pit_components/components/controllers/adv_text_field_controller.dart';
import 'package:pit_components/consts/textstyles.dart' as ts;

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'PIT Components Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(title: 'PIT Components Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);

  final String title;

  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  DateTime _date;
  String _radioButtonValue = "";
  List<String> possibleValue = [];

  double _lowerValue = 0.0;
  double _upperValue = 100.0;

  @override
  void initState() {
    super.initState();
    possibleValue.add("Possible Value 1");
    possibleValue.add("Possible Value 2");
  }

  Widget _buildRadioButton(Widget icon, String value) {
    return AdvRow(divider: RowDivider(12.0), children: [
      icon,
      Text(value,
          style: ts.fw700.merge(ts.fs12).copyWith(
              color:
                  _radioButtonValue == value ? Colors.black87 : Colors.black38))
    ]);
  }

  @override
  Widget build(BuildContext context) {
    AdvTextFieldController controller = AdvTextFieldController(
        label: "Just TextField MaxLines 1",
        hint: "TextField MaxLines 1 Example",
        maxLines: 1 /*,
        text: "00\\00\\0000 ~ 00(00)00®000"*/
        );
    AdvTextFieldController plainController = AdvTextFieldController(
        enable: false,
        hint: "Plain TextField Example",
        label: "Plain TextField");

    AdvRadioGroupController radioButtonController = new AdvRadioGroupController(
        checkedValue: _radioButtonValue,
        itemList: possibleValue.map((value) {
          IconData activeIconData;
          IconData inactiveIconData;

          if (value == possibleValue[0]) {
            activeIconData = Icons.cloud;
            inactiveIconData = Icons.cloud_off;
          } else {
            activeIconData = Icons.alarm;
            inactiveIconData = Icons.alarm_off;
          }

          return RadioGroupItem(value,
              activeItem: _buildRadioButton(Icon(activeIconData), value),
              inactiveItem: _buildRadioButton(Icon(inactiveIconData), value));
        }).toList());

    AdvRangeSliderController sliderController = AdvRangeSliderController(
        lowerValue: _lowerValue,
        upperValue: _upperValue,
        min: 0.0,
        max: 100.0,
        divisions: 10,
        hint: "Advanced Slider");

    AdvGroupCheckController groupCheckController = AdvGroupCheckController(
        checkedValue: "",
        itemList: [
          GroupCheckItem('Image', 'Image'),
          GroupCheckItem('Document', 'Document')
        ]);

    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: SingleChildScrollView(
        child: Container(
          color: Color(0xffFCF6E8),
          child: AdvColumn(
            padding: EdgeInsets.symmetric(horizontal: 16.0),
            onlyInner: false,
            divider: ColumnDivider(16.0),
            children: [
              AdvRow(divider: RowDivider(8.0), children: [
                Expanded(
                    child: AdvTextField(
                  controller: controller,
//                  inputFormatters: [
//                    DateTextFormatter("dd\\MM\\yyyy ~ HH(mm)ss®SSS")
//                  ],
                )),
                Expanded(
                    child: AdvTextFieldPlain(
                  controller: plainController,
                )),
              ]),
              AdvRow(divider: RowDivider(8.0), children: [
                Expanded(child: AdvButton("Normal", enable: false)),
                Expanded(
                    child:
                        AdvButton("Outlined", onlyBorder: true, enable: false)),
                Expanded(
                    child: AdvButton("Reverse", reverse: true, enable: false))
              ]),
              AdvButton(
                "Go to List View with Bottom Button",
                width: double.infinity,
                buttonSize: ButtonSize.small,
                onPressed: () {
                  Navigator.push(
                    context,
                    MaterialPageRoute(
                        builder: (context) => AnotherPage(),
                        settings:
                            RouteSettings(name: widget.runtimeType.toString())),
                  );
                },
              ),
              AdvRow(divider: RowDivider(8.0), children: [
                Expanded(
                  child: AdvButtonWithIcon(
                      "", Icon(Icons.ring_volume), Axis.vertical),
                ),
                Expanded(
                    child: AdvButtonWithIcon(
                        "", Icon(Icons.airline_seat_flat_angled), Axis.vertical,
                        onPressed: () {}, onlyBorder: true)),
                Expanded(
                    child: AdvButtonWithIcon(
                        "", Icon(Icons.headset), Axis.vertical,
                        onPressed: () {}, reverse: true)),
              ]),
              Visibility(
                  visible: _date != null,
                  child: AdvText("You picked date => $_date")),
              AdvDatePicker(
                onChanged: (List value) {
                  if (value.length == 0) return;

                  setState(() {
                    _date = value[0];
                  });
                },
//                markedDates: [
//                  MarkedDate(DateTime(2018, 11, 20),
//                      "20th November - Maulid Nabi Muhammad")
//                ],
                controller: AdvDatePickerController(
                    label: "Just TextField MaxLines 1",
                    enable: false,
                    hint: "test",
                    initialValue: _date ?? DateTime.now(),
                    dates: [_date ?? DateTime.now()]),
              ),
              AdvDropDown(
                onChanged: (String value) {},
                items: {
                  "data 1": "display 1",
                  "data 2": "display 2",
                  "data 3": "display 3"
                },
              ),
              AdvSingleDigitInputter(
                text: "12345",
                digitCount: 5,
              ),
              AdvRadioGroup(
                direction: Axis.vertical,
                controller: radioButtonController,
                divider: 8.0,
                callback: _handleRadioValueChange,
              ),
              AdvRangeSlider(
                controller: sliderController,
                onChanged: (low, high) {
                  setState(() {
                    _lowerValue = low;
                    _upperValue = high;
                  });
                },
              ),
              AdvBadge(
                size: 50.0,
                text: "5,000.00",
              ),
              AdvGroupCheck(
                controller: groupCheckController,
                callback: (itemSelected) async {},
              ),
              AdvChooser(
                enable: false,
                label: "Chooser Example",
                hint: "This is chooser example",
                items: {
                  "data 1": "display 1",
                  "data 2": "display 2",
                  "data 3": "display 3",
                  "data 4": "display 4",
                  "data 5": "display 5",
                  "data 6": "display 6",
                  "data 7": "display 7",
                  "data 8": "display 8",
                  "data 9": "display 9",
                  "data 10": "display 10",
                  "data 11": "display 11",
                  "data 12": "display 12",
                  "data 13": "display 13",
                  "data 14": "display 14",
                  "data 15": "display 15",
                  "data 16": "display 16",
                  "data 17": "display 17",
                  "data 18": "display 18",
                  "data 19": "display 19",
                  "data 20": "display 20",
                  "data 21": "display 21",
                  "data 22": "display 22",
                  "data 23": "display 24 ",
                  "data 24": "display 24",
                  "data 25": "display 25"
                },
              )
            ],
          ),
        ),
      ),
    );
  }

  void _handleRadioValueChange(String value) {
    setState(() {
      _radioButtonValue = value;
    });
  }
}

class AnotherPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return Scaffold(
      appBar: AppBar(
        title: Text("Another Page"),
      ),
      body: AdvListViewWithBottom(
        divider: ListViewDivider(
          1.0,
          color: Colors.grey,
        ),
        children: List.generate(100, (index) {
          return Text("Text $index");
        }),
        footerItem: Container(
          alignment: Alignment.center,
          child: Material(
              clipBehavior: Clip.antiAlias,
              borderRadius: BorderRadius.all(Radius.circular(25.0)),
              child: InkWell(
                onTap: () {},
                child: Container(
                    padding:
                        EdgeInsets.symmetric(horizontal: 16.0, vertical: 8.0),
                    child: AdvRow(
                        divider: RowDivider(4.0),
                        mainAxisSize: MainAxisSize.min,
                        children: [
                          Icon(Icons.filter_list,
                              size: 16.0, color: Colors.purple),
                          Text("Filter",
                              style: ts.fs12.copyWith(color: Colors.purple))
                        ])),
              ),
              elevation: 4.0),
          margin: EdgeInsets.only(bottom: 20.0),
        ),
      ),
    );
  }
}

Use this package as a library

1. Depend on it

Add this to your package's pubspec.yaml file:


dependencies:
  pit_components: ^0.2.0

2. Install it

You can install packages from the command line:

with Flutter:


$ flutter packages get

Alternatively, your editor might support flutter packages get. Check the docs for your editor to learn more.

3. Import it

Now in your Dart code, you can use:


import 'package:pit_components/pit_components.dart';
  
Version Uploaded Documentation Archive
0.2.0 Feb 8, 2019 Go to the documentation of pit_components 0.2.0 Download pit_components 0.2.0 archive
0.1.0+3 Feb 6, 2019 Go to the documentation of pit_components 0.1.0+3 Download pit_components 0.1.0+3 archive
0.1.0+2 Jan 29, 2019 Go to the documentation of pit_components 0.1.0+2 Download pit_components 0.1.0+2 archive
0.1.0+1 Jan 25, 2019 Go to the documentation of pit_components 0.1.0+1 Download pit_components 0.1.0+1 archive
0.1.0 Jan 25, 2019 Go to the documentation of pit_components 0.1.0 Download pit_components 0.1.0 archive
0.0.36+2 Jan 17, 2019 Go to the documentation of pit_components 0.0.36+2 Download pit_components 0.0.36+2 archive
0.0.36+1 Jan 15, 2019 Go to the documentation of pit_components 0.0.36+1 Download pit_components 0.0.36+1 archive
0.0.36 Jan 15, 2019 Go to the documentation of pit_components 0.0.36 Download pit_components 0.0.36 archive
0.0.35+2 Jan 15, 2019 Go to the documentation of pit_components 0.0.35+2 Download pit_components 0.0.35+2 archive
0.0.35+1 Jan 14, 2019 Go to the documentation of pit_components 0.0.35+1 Download pit_components 0.0.35+1 archive

All 50 versions...

Popularity:
Describes how popular the package is relative to other packages. [more]
73
Health:
Code health derived from static analysis. [more]
72
Maintenance:
Reflects how tidy and up-to-date the package is. [more]
100
Overall:
Weighted score of the above. [more]
78
Learn more about scoring.

We analyzed this package on Feb 16, 2019, and provided a score, details, and suggestions below. Analysis was completed with status completed using:

  • Dart: 2.1.0
  • pana: 0.12.13
  • Flutter: 1.2.0

Platforms

Detected platforms: Flutter

References Flutter, and has no conflicting libraries.

Health issues and suggestions

Fix lib/mods/mod_editable_text.dart. (-25.38 points)

Analysis of lib/mods/mod_editable_text.dart failed with 1 error, 1 hint:

line 435 col 7: Missing concrete implementation of TextInputClient.updateFloatingCursor.

line 12 col 8: Unused import: 'package:flutter/gestures.dart'.

Fix lib/components/extras/com_calendar_carousel.dart. (-2.48 points)

Analysis of lib/components/extras/com_calendar_carousel.dart reported 5 hints:

line 2 col 8: Unused import: 'package:flutter/scheduler.dart'.

line 576 col 21: Avoid using braces in interpolation when not needed.

line 576 col 37: Avoid using braces in interpolation when not needed.

line 576 col 55: Avoid using braces in interpolation when not needed.

line 577 col 44: Avoid using braces in interpolation when not needed.

Fix lib/components/adv_state.dart. (-0.50 points)

Analysis of lib/components/adv_state.dart reported 1 hint:

line 23 col 3: The class 'Future' was not exported from 'dart:core' until version 2.1, but this code is required to be able to run on earlier versions.

Fix additional 3 files with analysis or formatting issues.

Additional issues in the following files:

  • lib/components/adv_text_field.dart (Run flutter format to format lib/components/adv_text_field.dart.)
  • lib/mods/mod_checkbox.dart (Run flutter format to format lib/mods/mod_checkbox.dart.)
  • lib/pit_components.dart (Run flutter format to format lib/pit_components.dart.)

Dependencies

Package Constraint Resolved Available
Direct dependencies
Dart SDK >=2.0.0-dev.68.0 <3.0.0
flutter 0.0.0
flutter_range_slider ^1.0.1 1.1.0
intl ^0.15.7 0.15.7
photo_view ^0.1.2 0.1.3 0.2.0
Transitive dependencies
after_layout 1.0.7
collection 1.14.11
meta 1.1.6 1.1.7
path 1.6.2
sky_engine 0.0.99
typed_data 1.1.6
vector_math 2.0.8
Dev dependencies
flutter_test