Turtle graphics for Flutter. It simply uses a custom painter to draw graphics by a series of Logo-like commands.

Overview

flutter_turtle

pub package

flutter_turtle is a simple implementation of turtle graphics for Flutter. It simply uses a custom painter to draw graphics by a series of Logo-like commands.

For further information about turtle graphics, please visit Wikipedia:

Why I make this?

It is always fun to make your own DSL!

Example

screenshot.png

A quick example:

@override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text(widget.title)),
      body: TurtleView(
        child: Container(),
        commands: [
          PenDown(),
          SetColor((_) => Color(0xffff9933)),
          SetStrokeWidth((_) => 2),
          Repeat((_) => 20, [
            Repeat((_) => 180, [
              Forward((_) => 25.0),
              Right((_) => 20),
            ]),
            Right((_) => 18),
          ]),
          PenUp(),
        ],
      ),
    );
  }

A Flutter web app example is available at https://zonble.github.io/flutter_turtle/

Usage

flutter_turtle provides two class, TurtleView, which is your canvas and accepts a list of commands to draw your graphics, and AnimatedTurtleView, which is an animating version of TurtleView.

Just create an instance of TurtleView or AnimatedTurtleView, pass the commands in the commands parameter, and insert it to your widget tree.

Flutter Turtle DSL

flutter_turtle a set of Dart classes to represents commands to control your turtle. Using them is quite alike to calling functions when you are doing turtle graphics in Logo language, however, you are still coding in Dart and actually composing a list of Dart objects, and then TurtleView runs them one by another.

In other words, flutter_turtle built a DSL over Dart and Flutter.

If you have code in Logo like this:

repeat 5 [ fd 100 rt 144 ]

It would be like the following code in Flutter Turtle DSL:

[
  Repeat((_) => 5, [
    Forward((_) => 200),
    Right((_) => 144),
  ]),
];

Flow control

There are some commands help you to do flow controls. You can use the IfElse class like using 'if..else..' in Dart, and you can use Repeat for loops.

An example of IfElse:

// If it is true, go forward for 10 pixels, otherwise go back for 10 pixels.
IfElse((_)=>true, [Forward((_)=>10.0)], [Back(()=>10.0)]),

An example of Repeat:

// Repeat 10 times.
Repeat((_)=>10, [Forward((_)=>10.0)]),

Macros

Flutter Turtle DSL does not have somehow REAL functions, but somehow you can use macros instead. You can use the SetMacro to add macros to your turtle:

SetMacro('macro', [Forward((_)=>10.0)]), // A new macro named "macro".

Then you can use RunMacro to run the macro:

RunMacro('macro', (_)=>{'arg1': 'value1', 'arg2': 'value2'}),

You can pass arguments while calling a macro. These arguments would be a map sent to each Flutter Turtle command. For example:

SetMacro('macro', [Forward((_)=>_['arg1'])]), // A new macro named "macro".
RunMacro('macro', (_)=>{'arg1': 10.0}),

Commands

Currently supported commands are including:

Turtle motion

  • PenDown
  • PenUp
  • Left
  • Right
  • Forward
  • Back
  • SetColor
  • SetStrokeWidth
  • GoTo
  • ResetPosition
  • ResetHeading
  • Label
  • SetLabelHeight

Flow control

  • If
  • IfElse
  • Repeat

Macros

  • SetMacro
  • RunMacro
You might also like...

Flutter package for displaying and animating Scalable Vector Graphics 1.1 files. The package has been written solely in Dart Language.

Flutter package for displaying and animating Scalable Vector   Graphics 1.1 files. The package has been written solely in Dart Language.

Animated SVG | Flutter Package Flutter package for displaying and animating Scalable Vector Graphics 1.1 files. The package has been written solely in

Jul 19, 2022

A simple sprite format for building 1bit styled graphics.

A simple sprite format for building 1bit styled graphics.

Mini Sprite Mini sprite is a simple, matrix based format for creating 1bit styled graphics. Project structure Mini Sprite is composed of several proje

Dec 15, 2022

Sample Flutter Drawing App which allows the user to draw onto the canvas along with color picker and brush thickness slider.

Sample Flutter Drawing App which allows the user to draw onto the canvas along with color picker and brush thickness slider.

DrawApp Sample Flutter Drawing App which allows the user to draw onto the canvas along with color picker and brush thickness slider. All code free to

Nov 3, 2022

Draw perfect freehand lines—in Flutter.

Draw perfect freehand lines—in Flutter.

Draw perfect pressure-sensitive freehand lines. 🔗 A port of the perfect-freehand JavaScript library. Try out that demo. 💕 Love this library? Conside

Jan 2, 2023

A flutter plugin to draw the coordinates on the widget and as well as to find the given point is inside a list of coordinates or not.

A flutter plugin to draw the coordinates on the widget and as well as to find the given point is inside a list of coordinates or not.

Draw On A flutter plugin to draw the coordinates on widget and as well as to find the given point is inside a list of coordinates or not. For Draw on

Apr 5, 2022

This package allows you to draw dotted lines with Flutter.

This package allows you to draw dotted lines with Flutter.

About This package allows you to draw dotted lines with Flutter. Usage Parameter Default Description direction Axis.horizontal The direction of the en

Nov 16, 2022

Grad text package - A Flutter Widget to draw gradients into text

Grad text package - A Flutter Widget to draw gradients into text

grad_text A Flutter Widget to draw gradients into text.(Null safe) Demo Install

Jan 31, 2022

Doddle - A Flutter app where you can draw symmetrical drawing

Doddle - A Flutter app where you can draw symmetrical drawing

doddle - (still under development) Amazing magical doodle game provide a creativ

Dec 28, 2022

A #Flutter package that let you draw a flow chart diagram with different kind of customizable elements

A #Flutter package that let you draw a flow chart diagram with different kind of customizable elements

Flutter Flow Chart A package that let you draw a flow chart diagram with different kind of customizable elements. Dashboards can be saved for later us

Jan 1, 2023
Comments
  • Time control ?

    Time control ?

    I want to be able to draw things over time do it plays back drawing the lines on the screen one at a time.

    In the demo it shows them finished as if the turtle has already walked the path.

    Does this make sense ?

    opened by winwisely99 2
Owner
Weizhong Yang a.k.a zonble
Developer Manager @ Cerence / Taipei, Taiwan / Flutter GDE
Weizhong Yang a.k.a zonble
best flutter / dart practices + Custom Painter + Sliver App Bar + Custom Scrollview

Weekly Budget Flutter App A new Flutter project. Getting Started This project is a starting point for a Flutter application. A few resources to get yo

Mohamed Awnallah 4 Oct 21, 2021
QR.Flutter is a Flutter library for simple and fast QR code rendering via a Widget or custom painter.

QR.Flutter is a Flutter library for simple and fast QR code rendering via a Widget or custom painter. Need help? Please do not submit an issue for a "

Yakka 614 Jan 8, 2023
Flutter POS Printer - A library to discover printers, and send printer commands

Flutter POS Printer - A library to discover printers, and send printer commands

Nguyễn Đức Hiếu 2 Oct 5, 2022
Google logo animation reproduction made with Flutter

Google logo animation This project is a reproduction of a piece of the Google logo animation using pure Flutter animations Preview output.mp4 iOS & An

Jorge Damian Diaz Morejon 3 May 17, 2022
Flutter plugin to simply integrate Agora Video Calling or Live Video Streaming to your app with just a few lines of code.

Agora UI Kit for Flutter Instantly integrate Agora video calling or video streaming into your Flutter application. Getting started Requirements An Ago

Agora.io Community 106 Dec 16, 2022
A Flutter widget that simply balances the lines of two-line text

Flutter Balanced Text ⚖️ A Flutter widget that simply balances the lines of two-line text, especially useful on long titles or short descriptions. Doe

Raşit Ayaz 3 Nov 10, 2022
(RPG maker) Create RPG-style or similar games more simply with Flame.

Bonfire Build RPG games and similar with the power of FlameEngine! Bonfire is ideal for building games from the following perspectives: Test our onlin

Rafael Almeida Barbosa 787 Jan 7, 2023
Dumbo - A collection of all dumb stuff at one place, this repo is to be maintained for people who just simply are taking break from huge stuff and practicing something.

dumbo A new Flutter project. Getting Started This project is a starting point for a Flutter application. A few resources to get you started if this is

Krish Bhanushali 1 Jan 3, 2022
Dart package for Async Data Loading and Caching. Combine local (DB, cache) and network data simply and safely.

Stock is a dart package for loading data from both remote and local sources. It is inspired by the Store Kotlin library.

xmartlabs 59 Dec 24, 2022
This Crypto App is Simply Showing data and chart by using coin gecko api.

crypto_app This is Simple Crypto Currency analytics showing app using coingecko api. You Can Use this if you want to show simply crypto currency analy

null 2 Oct 7, 2022