Skip to content

Instantly share code, notes, and snippets.

@GAM3RG33K
Created August 20, 2021 08:51
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save GAM3RG33K/80d119c0d86556e8d190f001405ddaf6 to your computer and use it in GitHub Desktop.
Save GAM3RG33K/80d119c0d86556e8d190f001405ddaf6 to your computer and use it in GitHub Desktop.
[UI - Hack] Circular loading of an image
import 'dart:async';
import 'package:flutter/material.dart';
final Color darkBlue = Color.fromARGB(255, 18, 32, 47);
void main() {
runApp(MyApp());
}
Color get _backgroundColor => Colors.white;
int _index = 5;
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
theme: ThemeData.dark().copyWith(scaffoldBackgroundColor: darkBlue),
debugShowCheckedModeBanner: false,
home: Scaffold(
backgroundColor: _backgroundColor,
body: Center(
child: MyWidget(),
),
),
);
}
}
class MyWidget extends StatefulWidget {
@override
_MyWidgetState createState() => _MyWidgetState();
}
class _MyWidgetState extends State<MyWidget> {
late Timer _timer;
@override
initState() {
super.initState();
_timer = Timer.periodic(const Duration(seconds: 1), (timer) {
if (!mounted) return;
setState(() {
_index--;
print('_index: $_index');
if (_index == 0) {
_timer.cancel();
_index = 5;
}
});
});
}
@override
Widget build(BuildContext context) {
return Stack(
children: [
Positioned.fill(
child: Center(
child: Container(
height: 150,
width: 150,
decoration: BoxDecoration(
// color: Colors.red,
borderRadius: BorderRadius.circular(75),
image: DecorationImage(
image: NetworkImage( 'https://media.istockphoto.com/vectors/pie-icon-on-white-round-vector-button-vector-id520295912?s=612x612'),
),
),
),
),
),
Positioned.fill(
child: Center(
child: SizedBox(
height: 150,
width: 150,
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Row(
children: [
_index > 4
? Container(
color: _backgroundColor,
height: 75,
width: 75,
)
: const SizedBox(
height: 75,
width: 75,
),
_index > 3
? Container(
color: _backgroundColor,
height: 75,
width: 75,
)
: const SizedBox(
height: 75,
width: 75,
),
],
),
Row(
children: [
_index > 1
? Container(
color: _backgroundColor,
height: 75,
width: 75,
)
: const SizedBox(
height: 75,
width: 75,
),
_index > 2
? Container(
color: _backgroundColor,
height: 75,
width: 75,
)
: const SizedBox(
height: 75,
width: 75,
),
],
),
],
),
),
),
),
],
);
}
}
@GAM3RG33K
Copy link
Author

Update image url if not working

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment