import 'package:flutter/material.dart';
void main() => runApp(const MyApp());
class MyApp extends StatelessWidget {
const MyApp({super.key});
@override
Widget build(BuildContext context) {
return MaterialApp(
theme: ThemeData(
primarySwatch: Colors.blue,
),
title: 'Flutter Expanded Sample',
home: const AnimatedContainerSample(),
);
}
}
class AnimatedContainerSample extends StatefulWidget {
const AnimatedContainerSample({super.key});
@override
State<AnimatedContainerSample> createState() =>
_AnimatedContainerSampleState();
}
class _AnimatedContainerSampleState extends State<AnimatedContainerSample> {
bool selected = false;
double _radians = 0;
void _onTap() {
if (!selected) {
_radians = 45;
selected = true;
} else {
_radians = 0;
selected = false;
}
setState(() {});
}
@override
Widget build(BuildContext context) {
return Scaffold(
body: Container(
alignment: Alignment.center,
child: AnimatedContainer(
alignment: Alignment.center,
width: 100,
height: 100,
color: Colors.blue,
duration: const Duration(seconds: 1),
transform: Matrix4.rotationZ(_radians),
child: const FlutterLogo(size: 75),
),
),
floatingActionButton: FloatingActionButton(onPressed: _onTap),
);
}
}
View Compiled
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.