FlutterArtist Scalar External Shelf Event ex1

Structure of the example
SystemReport24aShelf
SystemReport24aScalar
SystemReport24aButtons

In the FlutterArtist, the power of broadcasting is not limited to Blocks. Scalar — the component representing single values or aggregate reports — also possesses the ability to listen and react intelligently to events from other Shelves:

For simplicity consider the illustration below:

When you try to add, delete or modify an ItemA1 on BlockA1 (Of ShelfA), an event will be emitted outside of ShelfA and sent to ShelfB. Suppose that ScalarB1 has heard this event. ScalarB1's SCALAR-level reaction can be a requery.

Note: You should see a basic Scalar example in the article below before continuing with this article:
FlutterArtist Scalar ex1
FlutterArtist SingleItemBlock ex1 (***)

Example Scenario: Demo24a

SystemReport24aScalar displays aggregate system metrics such as: category count (categoryCount), employee count (employeeCount), and supplier count (supplierCount).

Scalar Value

{
   "categoryCount": 3,
   "employeeCount": 20,
   "noteCount": 8,
   "productCount": 31,
   "supplierCount": 4,
   "saleOrderCount": 304
}

From the SystemReport24aScalar interface, the user clicks the "Create Supplier" button to invoke the SingleSupplierBlock Form (belonging to SingleSupplierShelf) to create a new supplier. A successful save action on this Shelf will broadcast an external event. SystemReport24aScalar listens for that event and automatically triggers a re-query to update the latest report figures.

No ADS

Download FlutterArtist Demo
FlutterArtist Block External Shelf Event ex1

1. Structure of the example

2. SystemReport24aShelf

Use the ScalarConfig.onExternalShelfEvents property to define the event "frequencies" this Scalar will respond to.

No ADS

system_report24a_shelf.dart

class SystemReport24aShelf extends Shelf {
  @override
  ShelfStructure defineShelfStructure() {
    return ShelfStructure(
      filterModels: {},
      blocks: [],
      scalars: [
        SystemReport24aScalar(
          name: SystemReport24aScalar.scalarName,
          description: null,
          filterModelName: null,
          config: ScalarConfig(
            onExternalShelfEvents: ExternalShelfEventScalarRecipient(
              scalarLevelReactionOn: [
                Event(SupplierInfo), //
                Event(SupplierData), //
                Event(ProductData), // Others...
              ],
            ),
          ),
        ),
      ],
    );
  }

  SystemReport24aScalar findSystemReport24aScalar() {
    return findScalar(SystemReport24aScalar.scalarName)
        as SystemReport24aScalar;
  }
}

FlutterArtist Projections (***)

3. SystemReport24aScalar

The Scalar performs the actual query logic via the performQuery() method. When a matching external event occurs, the Framework automatically triggers this method.

system_report24a_scalar.dart

class SystemReport24aScalar extends Scalar<
    SystemReportData, // VALUE
    EmptyFilterInput,
    EmptyFilterCriteria> {
  static const scalarName = "system-report24a-scalar";

  final systemReportRestProvider = SystemReportRestProvider();

  SystemReport24aScalar({
    required super.name,
    required super.description,
    required super.config,
    required super.filterModelName,
  }) : super(childScalars: const []);

  @override
  Future<ApiResult<SystemReportData>> performQuery({
    required Object? parentScalarValue,
    required EmptyFilterCriteria filterCriteria,
  }) async {
    return await systemReportRestProvider.query();
  }
}

4. SystemReport24aButtons

system_report24a_buttons.dart

class SystemReport24aButtons extends ScalarSectionView<SystemReport24aScalar> {
  const SystemReport24aButtons({super.key, required super.scalar});

  @override
  Widget buildContent(BuildContext context) {
    return Row(
      mainAxisAlignment: MainAxisAlignment.start,
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        ElevatedButton(
          onPressed: () {
            _onPressCreateSupplierBtn(context);
          },
          child: Text("Create Supplier"),
        ),
      ],
    );
  }

  Future<void> _onPressCreateSupplierBtn(BuildContext context) async {
    FlutterArtist.codeFlowLogger.addMethodCall(
      ownerClassInstance: this,
      currentStackTrace: StackTrace.current,
      parameters: null,
    );
    //
    Coordinator coordinator = SingleSupplierCreationCoordinator(
      config: CoordinatorConfig(),
      customNavigate: (BuildContext context, bool success) {
        if (success) {
          Scaffold.of(context).openEndDrawer();
        }
      },
    );
    await coordinator.execute(context);
  }
}

No ADS

FlutterArtist Scalar External Shelf Event ex1

1. Structure of the example

2. SystemReport24aShelf

3. SystemReport24aScalar

4. SystemReport24aButtons

FlutterArtist

FlutterArtist

Newest Articles