Skip to content

Icons

Icon specifications tell the generator which icons to register for use in XML fragments. Registered icons can be referenced by their qualified name (e.g., Icons.add) in fragment attributes.

Defining an Icon Spec

Create an icon spec file (e.g., lib/xwidget/icon_spec.dart):

import 'package:flutter/material.dart';

const icons = [
  Icons.add,
  Icons.arrow_back,
  Icons.check,
  Icons.close,
  Icons.delete,
  Icons.edit,
  Icons.home,
  Icons.menu,
  Icons.search,
  Icons.settings,
];

Then reference it in xwidget_config.yaml:

icons:
  sources: [ "lib/xwidget/icon_spec.dart" ]

Individual Icons vs. Icon Sets

Individual icons (recommended):

const icons = [
  Icons.add,
  Icons.delete,
  Icons.home,
];

This only includes the icons you need, keeping your app lean.

Entire icon sets (not recommended):

import 'package:flutter/cupertino.dart';

const iconSets = [
  CupertinoIcons,
];

This registers every IconData constant in the class. While convenient, it bloats app size because tree-shaking is bypassed for all registered icons.

Tip

List icons individually whenever possible. Only use icon sets during early prototyping, and switch to individual icons before release.

Generated Output

The generator creates a registerXWidgetIcons() function that registers each icon:

void registerXWidgetIcons() {
  XWidget.registerIcon('Icons.add', Icons.add);
  XWidget.registerIcon('Icons.delete', Icons.delete);
  XWidget.registerIcon('Icons.home', Icons.home);
}

Icons can then be referenced in XML fragments by their qualified name:

<Icon icon="Icons.home" />