Skip to content

Instantly share code, notes, and snippets.

Show Gist options
  • Save gazialankus/ae5686f3f760e7a37b682039f546a784 to your computer and use it in GitHub Desktop.
Save gazialankus/ae5686f3f760e7a37b682039f546a784 to your computer and use it in GitHub Desktop.
import 'package:flutter/material.dart';
// This example showcases how, by using functions over classes,
// this _can_ break features such as AnimatedSwitcher
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
@override
Widget build(context) {
return MaterialApp(
home: Home(),
);
}
}
class Home extends StatefulWidget {
@override
_HomeState createState() => _HomeState();
}
class _HomeState extends State<Home> {
bool showCircle = false;
@override
Widget build(BuildContext context) {
return Scaffold(
body: Center(
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
AnimatedSwitcher(
duration: const Duration(seconds: 1),
child: showCircle ? Circle() : Square(),
// Uncomment to break the animation
// child: showCircle
// ? Container(
// width: 50,
// height: 50,
// child: Material(
// shape: RoundedRectangleBorder(
// borderRadius: BorderRadius.all(Radius.circular(50)),
// ),
// color: Colors.red,
// clipBehavior: Clip.hardEdge,
// ),
// )
// : Container(
// width: 50,
// height: 50,
// color: Colors.red,
// ),
),
RaisedButton(
onPressed: () => setState(() => showCircle = !showCircle),
child: Text(
'Click me to do a fade transition between square and a circle',
),
)
],
),
),
);
}
}
class Square extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Container(
width: 50,
height: 50,
color: Colors.red,
);
}
}
class Circle extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Container(
width: 50,
height: 50,
child: Material(
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.all(Radius.circular(50)),
),
color: Colors.red,
clipBehavior: Clip.hardEdge,
),
);
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment