dotted_separator 1.0.6 copy "dotted_separator: ^1.0.6" to clipboard
dotted_separator: ^1.0.6 copied to clipboard

A Flutter package that provides a customizable Dotted Separator and Dotted widgets.

dotted_separator #

A Flutter package that provides a customizable Dotted separator and Dotted widgets.

Screenshots #

Home Screen

Installation #

Add the following dependency to your pubspec.yaml file:

dependencies:
  dotter_separator: ^1.0.6

Then run flutter pub get to install the package.

Usage #

Import the package in your Dart code:

import 'package:dotter_separator/dotter_separator.dart';

Use the DottedSeparator widget to create a dotted line separator:

  DottedSeparator(
      height: 2,
      width: double.infinity,
      axis: Axis.horizontal,
      dashWidth: 5,
      dashSpace: 3,
      strokeWidth: 1.5,
      dashColor: Colors.black,
      padding: EdgeInsets.symmetric(vertical: 8),
    ),     

In this example, the DottedSeparator widget is used to create a horizontal dotted line separator. You can customize its appearance by adjusting the height, width, axis, dashWidth, dashSpace, strokeWidth, dashColor, and padding properties.

Parameters #

  • height (double): The height of the separator.
  • width (double): The width of the separator.
  • axis (Axis): The axis direction of the separator (horizontal or vertical).
  • dashWidth (double): The width of each dash in the separator.
  • dashSpace (double): The space between two consecutive dashes.
  • strokeWidth (double): The thickness of each dash in the separator.
  • dashColor (Color): The color of each dash in the separator.
  • padding (EdgeInsetsGeometry): Optional padding for the separator.
  DottedContainer(
      height: 100,
      width: 100,
      linePosition: LinePosition.bottom,
      shape: Shape.line,
      color: Colors.black,
      borderRadius: BorderRadius.circular(10),
      dash: [4, 4],
      strokeWidth: 1,
      child: Center(
        child: Text(
          'Dotted Container',
          style: TextStyle(fontSize: 16),
        ),
      ),
    ),

In this example, the DottedContainer widget is used to create a container with a dotted border. You can customize its appearance by adjusting the height, width, linePosition, shape, color, borderRadius, dash, strokeWidth, and child properties.

Parameters #

  • height (double): The height of the container.
  • width (double): The width of the container.
  • linePosition (LinePosition): The position of the dotted line (top, bottom, left, right).
  • shape (Shape): The shape of the container (rectangle or circle).
  • color (Color): The color of the dotted line.
  • borderRadius (BorderRadius): The border radius of the container.
  • dash (List
  • strokeWidth (double): The width of the dotted line.
  • child (Widget): The child widget to be placed inside the container.
  • padding (EdgeInsetsGeometry): Optional padding for the container's content.
  • margin (EdgeInsetsGeometry): Optional margin for the container.

Compatibility #

This package supports both Android and iOS devices.

Issues and Contributions #

If you encounter any issues or would like to contribute to this package, please visit the GitHub repository for more information.

License #

This package is released under the MIT License.

9
likes
160
points
714
downloads

Publisher

unverified uploader

Weekly Downloads

A Flutter package that provides a customizable Dotted Separator and Dotted widgets.

Repository (GitHub)

Documentation

API reference

License

MIT (license)

Dependencies

flutter

More

Packages that depend on dotted_separator