Skip to content

A Flutter Path object with superpowers, including re-sampling, dashed lines and a lot more!

License

Notifications You must be signed in to change notification settings

biocarl/extended_path

Repository files navigation

extended_path Pub

This library encapsulates the PathExtended object which serves as a extension to the parent Path class of Flutter. Internally a sampled representation of the Path is stored and updated, allowing to manipulate the Path object in powerful ways.

🚧 This library is still at early-stage development and might be subject to breaking API changes!!! 🚧

Supported PathEffects

Here is increasingly growing list with all available parameters and their visual effects. The animation serves for illustration purposes only. For creating such animations I would like to refer to drawing_animation, another package of mine.

Effect Example
ContinousLine
(default)
DiscretePathEffect
DashPathEffect
PathDashPathEffect

Getting Started

    Path p = Path()..addRect(Rect.fromCircle(center: Offset.zero, radius: 2.0));
    PathExtended pp = PathExtended(p)
      ..applyPathEffect(DashPathEffect([10,2], dashOffset: -1))
      ..addPath(circle(0,30.0),Offset.zero);

Design

The API design for the PathEffect classes is inspired by PathEffect for native Android but with some differences:

  • A PathEffect is applied to each Path object and not to the Paint object
  • Additionally a PathModifier is introduced. Contrary to the PathEffect the overall contour of the Path is changed. Internally a PathModifier manipulates the sampled representation directly while a PathEffect only changes the way how the sampling points are connected. This allows to combine a PathModifier with a PathEffect: For instance, a straight line can be transformed into a dashed sinus-curve. Soon a PathExtendedBuilder will be exposed which allows to set up a PathExtended object without rebuilding the internal structure every time.
  • Any feedback on the overall API design is really appreciated!

Current limitations

Internal sampling rate for the path data is currently hardcoded. This might noticeable when sampling a big amount of path data (bad performance) and also for very small paths (edgy lines).

TODO

  • PathEffect: How to determine optimal _delta value for sampling. Also consider defining _delta over amount of resulting sampling points (required for path morping). Your Path is discrete now: What happens when the Path is scaled, consider resampling dynamically.
  • PathDashPathEffect: Rotate Path elements according to normal of current Offset (see PathDashPathEffect.Style)
  • PathDashPathEffect: Implement advance field of PathDashPathEffect by setting inital offset to -dashOffset
  • DashPathEffect: Double dash pattern when odd (for now blocked by assert)

Milestones

  • PathEffect: DashPathEffect
  • PathEffect: DiscretePathEffect
  • PathEffect: PathDashPathEffect
  • PathModifier: sin-wave
  • PathModifier: zick-zack
  • PathModifier: smoothing/simplify
  • (static) Lerp between two Paths/ Morphing
  • PathExtendedBuilder for better performance

About

A Flutter Path object with superpowers, including re-sampling, dashed lines and a lot more!

Topics

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published