svg_clip 0.0.2 copy "svg_clip: ^0.0.2" to clipboard
svg_clip: ^0.0.2 copied to clipboard

A flutter package that allows to use an SVG as a clip path

Svg Clip #

GitHub stars GitHub forks Latest release GitHub license

The Svg Clip library provides a simple way to use an SVG file as a mask for clipping a Flutter widget. This allows you to create visually appealing designs by applying convenient shapes as masks to your widgets.

Installation #

To use this library in your Flutter project, follow these steps:

  1. Add the following dependency to your pubspec.yaml file:

    dependencies:
      svg_clip: <latest-version>
    

Usage #

SvgClip(
asset: ClipAsset.local(path: "assets/images/cloud.svg"),
child: const _ColoredBox(
   color: Colors.green,
   width: 300,
   height: 100,
 ),
)

Full Example #

import 'package:flutter/material.dart';
import 'package:svg_clip/svg_clip.dart';

void main() {
 runApp(MyApp());
}

class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
 return MaterialApp(
   title: 'SVG Mask Clipper Demo',
   home: Scaffold(
     appBar: AppBar(
       title: Text('SVG Mask Clipper Demo'),
     ),
     body: Center(
       child: SvgClip(
         asset: ClipAsset.local(path: "assets/images/cloud.svg"),
         child: const _ColoredBox(
           color: Colors.green,
           width: 300,
           height: 100,
         ),
       ),
     ),
   ),
 );
}
}

Limitations #

  • Supports local svgs only.
  • Certain complex svg may not work as expected.

License #

This library is licensed under the MIT License.

2
likes
130
pub points
74%
popularity

Publisher

verified publisheranvith.dev

A flutter package that allows to use an SVG as a clip path

Repository (GitHub)
View/report issues

Documentation

API reference

License

MIT (license)

Dependencies

flutter, path_drawing

More

Packages that depend on svg_clip