flutter – Container gradient

main.dart

import 'package:flutter/material.dart';

void main() => runApp(const FlutterExample());

class FlutterExample extends StatelessWidget {
  const FlutterExample({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
        title: 'Flutter Example',
        theme: ThemeData(primarySwatch: Colors.blue),
        home: const StateExample()
    );
  }
}

class StateExample extends StatefulWidget {
  const StateExample({Key? key}) : super(key: key);

  @override
  _StateExampleState createState() => _StateExampleState();
}

class _StateExampleState extends State<StateExample>{

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: const Color(0xFFFEFEFA),
      appBar: AppBar(
          title: const Text("Flutter - Container Gradient")
      ),
      body: bodyContent(),
    );
  }


  bodyContent() {
    return Center(
        child: Container(
            child: const Text(
              "I am a Text",
              style: TextStyle(fontSize: 28),
            ),
            padding: EdgeInsets.all(30),
            margin: EdgeInsets.all(10),
            decoration: BoxDecoration(
                shape: BoxShape.rectangle,
                color: Colors.redAccent,
                borderRadius: const BorderRadius.all(Radius.circular(10)),
                boxShadow: [BoxShadow(
                    color: Colors.grey.withOpacity(0.5),
                    offset: const Offset(0,3),
                    blurRadius: 7.0,
                    spreadRadius: 5.0
                )],
                gradient: const LinearGradient(
                    begin: Alignment.centerLeft,
                    end: Alignment.centerRight,
                    colors: [Colors.red,Colors.amber,Colors.white70],
                    tileMode: TileMode.clamp
                )
            )
        )
    );
  }
}

More flutter tutorials

• flutter – Container shadow only bottom
• flutter – Container elevation
• flutter – Container decoration
• flutter – Container onPressed
• flutter – RotatedBox example
• flutter – AnimatedPadding example
• flutter – How to use OutlinedButton
• flutter – How to add a border to DropdownButton
• flutter – How to change DropdownButton height
• flutter – DropdownButton style
• flutter – Stack alignment
• flutter – Stack positioned
• flutter – Stack clipBehavior
• flutter – CircularProgressIndicator color
• flutter – CircularProgressIndicator value