Svg Clip

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>

Preview

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.