Flutter, How to make partially dark UI?-CodePudding

I just want these black dots to be slightly darker (light/dark), not black.

And it's actually not a circle, it's slightly sprayed with an irregular shape (like a light)

is there a smooth way?? thanks!

(I actually want to put this effects light/dark but it is not exactly shadow, So no need for shadow physics.)

CodePudding user response：

What you can do is simply give an opacity for the color you are applying. Colors.black.withOpacity(0.5)

 Widget blackCircle (){
    return Container(
      width: 70,
      height: 70,
      decoration: BoxDecoration(
        color: Colors.black.withOpacity(0.5),
        borderRadius: BorderRadius.all(Radius.circular(50))
      ),
    );
   }

CodePudding user response：

Use Opacity widget, which adds Opacity to child widget, in below example it's the Container widget. Opacity is given from values 0.0 to 1.0.

0.0 means no opacity which means the widget will not be visible, 1.0 means the widget will be visible as given, in-between values make it partially dark.

Opacity(opacity: 0.2, child: Container(
      width: 60,
      height: 60,
      decoration: BoxDecoration(
          shape: BoxShape.circle,
          color: Colors.black),
    ),);