How to Add a Ribbon Decoration to a Widget in Flutter

A ribbon decoration is a type of decoration that is floating above a container that shows an emphasized label. In design, ribbons are often used as header graphics, and they can also be used as borders, dividers, and background elements.

There are several benefits to using ribbon decorations in your app design. Ribbons are a great way to add a touch of elegance and visual interest, and they can help to emphasize important information or callouts. They can also be used to create an overall feeling of polish and professionalism.

You can use any of the following 2 packages to add ribbon to a widget.

ribbon_widget

Ribbon(
    title: '',
    titleStyle: const TextStyle(color: Colors.white, fontSize: 12),
    color: Colors.purple,
    location: RibbonLocation.topStart,
    farLength: 15,
    nearLength: 0,
    child: TextButton(
      onPressed: () {
       
      },
      child: Text("${index + 1}"),      
    ),
  )

super_banners

CornerBanner(
  bannerPosition: CornerBannerPosition.topLeft,
  bannerColor: Colors.blue,
  child: Text("New"),
);