Opacity Widget

What is Opacity Widget?

The Opacity is to makes its child partially transparent.

Default Constructor

The default constructor creates a widget that makes its child partially transparent.

Opacity(
    opacity: // required argument
    alwaysIncludeSemantics: false,
    child:
)

Constructor Parameters

It contains many input parameters which can be configured to change its behavior and appearance.

The opacity parameter is to scale the child's alpha value. An opacity of 1.0 is fully opaque and 0.0 is fully transparent (i.e., invisible). The opacity is required argument must not be null.

The alwaysIncludeSemantics parameter is to whether always include semantic formation of the children's. Defaults to false.

The child parameter is to add the widget below the Opacity widget in a tree.

Code snippet

This code snippet shows how to configure Opacity widget.

static const _visible = true;

Opacity(
          opacity: _visible ? 1.0 : 0.0,
          child: const Text('Hello world!'),
        )

Demo Code

This example shows Text widget when the _visible member field is true, and hides it when it is false.

import 'package:flutter/material.dart';

class OpacityDemo extends StatelessWidget {
  static const _visible = true;

  @override
  Widget build(BuildContext context) {
    return Material(
      child: Center(
        child: Opacity(
          opacity: _visible ? 1.0 : 0.0,
          child: const Text('Hello world!'),
        ),
      ),
    );
  }
}

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('Opacity Demo'),
        ),
        body: OpacityDemo(),
      ),
    );
  }
}

void main() => runApp(MyApp());