CODEWITHSUNDEEP
flutterdartflutter-layoutflutter-web
shalu j
shalu j

Reputation: 337

How to create a transparent container in flutter

I want to make a container transparent like this: enter image description here

Here's the container code:

: Container(child: Column(
    children: [
             Container(child: Text('Address: '), alignment: Alignment.centerLeft,),
             Divider(color: Colors.grey,),
             Container(child: Text('$address'), alignment: Alignment.centerLeft,),
             ],
            ),
   color: Color(0xFF005D6C),
   );

If I give color: Color(0xFF005D6C).withOpacity(0.5) then, it is just making the color light like this enter image description here

How can I make the container transparent?

Upvotes: 1

Views: 7386

Answers (2)

Tirth Patel
Tirth Patel

Reputation: 5736

Try using Colors.transparent + withOpacity for Container.

Container(
  color: Colors.transparent.withOpacity(0.5),
  child: Column(
    children: [
      Container(
        child: Text('Address: '),
        alignment: Alignment.centerLeft,
      ),
      Divider(
        color: Colors.grey,
      ),
      Container(
        child: Text('$address'),
        alignment: Alignment.centerLeft,
      ),
   ],
),

Upvotes: 3

pedro pimont
pedro pimont

Reputation: 3084

try wrapping it inside the Opacity Widget

Opacity(
  opacity: 0.5,
  child: Container(child: Column(
    children: [
             Container(child: Text('Address: '), alignment: Alignment.centerLeft,),
             Divider(color: Colors.grey,),
             Container(child: Text('$address'), alignment: Alignment.centerLeft,),
             ],
            ),
   color: Color(0xFF005D),
   ),
)

Upvotes: 4

Related Questions