Stack is a multi-child widget like Row and Column.
Properties
- alignment
- fit
- overflow
- clipBehaviour
- textDirection
Example:
import 'dart:html';
import 'package:flutter/material.dart';
void main() => DemoApp();
class DemoApp extends StatefulWidget {
@override
State<StatefulWidget> createState() {
return DemoAppState();
}
}
class DemoAppState extends State<DemoApp> {
final item = List<String>.generate(30, (i) => 'Item $i');
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
appBar: AppBar(
title: const Text("Demo App"),
),
body: Center(
child: Container(
child: Stack(
textDirection: TextDirection.rtl,
clipBehavior: Clip.none,
fit: StackFit.expand,
children: [
Container(
height: 250,
width: 250,
color: Colors.tealAccent,
),
Container(
height: 200,
width: 200,
color: Colors.limeAccent,
),
Positioned(
bottom: -15,
right: -25,
child: Container(
height: 150,
width: 150,
color: Colors.blueAccent,
),
),
],
),
),
),
),
);
}
}
Video Link: