Skip to content

Background Grid Customization

The LukeFlowCanvas provides a customizable background grid that can enhance the visual structure of your diagrams. You can adjust the grid's density, visibility of lines and dots, and colors to fit your application's design.

Background Grid Settings

The canvas can be customized to fit your application's needs.

User BackgroundGridSettings to control the appearance of the background grid, including density, visibility of lines and dots, and colors.

BackgroundGridSettings(
    xDensity: 50,
    yDensity: 50,
    showDots: true,
    lineColor: const Color.fromARGB(82, 0, 0, 0),
    lineWidth: 2,
    dotColor: const Color.fromARGB(255, 0, 0, 0),
    dotRadius: 2,
    showLines: true,
)

If you don't provide any BackgroundGridSettings, the canvas will not display a background grid with the default settings.

Example Usage

As you can see in the example above, the canvas is highly customizable and can be adapted to various use cases.

Background Grid with Secondary Settings

You can also provide a secondary background grid with different settings. This can be useful for creating a more complex visual structure.

Example