Add branding to status bar

This commit is contained in:
vishnukvmd 2022-06-12 21:40:38 +05:30
parent 48e5333d8d
commit ec136bec2b

View file

@ -6,23 +6,82 @@ import 'package:photos/events/sync_status_update_event.dart';
import 'package:photos/services/sync_service.dart';
import 'package:photos/ui/header/header_error_widget.dart';
const double kContainerHeight = 48;
class StatusBarWidget extends StatefulWidget {
const StatusBarWidget({Key key}) : super(key: key);
@override
_StatusBarWidgetState createState() => _StatusBarWidgetState();
State<StatusBarWidget> createState() => _StatusBarWidgetState();
}
class _StatusBarWidgetState extends State<StatusBarWidget> {
static const kSleepDuration = Duration(milliseconds: 3000);
SyncStatusUpdate _event;
double _containerHeight = 48;
StreamSubscription<SyncStatusUpdate> _subscription;
bool _showStatus = false;
@override
void initState() {
_subscription = Bus.instance.on<SyncStatusUpdate>().listen((event) {
if (event.status == SyncStatus.completed_first_gallery_import ||
event.status == SyncStatus.completed_backup) {
Future.delayed(Duration(milliseconds: 2000), () {
if (mounted) {
setState(() {
_showStatus = false;
});
}
});
} else {
setState(() {
_showStatus = true;
});
}
});
super.initState();
}
@override
void dispose() {
_subscription.cancel();
super.dispose();
}
@override
Widget build(BuildContext context) {
return Stack(
children: [
AnimatedOpacity(
opacity: _showStatus ? 0 : 1,
duration: Duration(milliseconds: 1000),
child: StatusBarBrandingWidget(),
),
AnimatedOpacity(
opacity: _showStatus ? 1 : 0,
duration: Duration(milliseconds: 1000),
child: SyncStatusWidget(),
),
],
);
}
}
class SyncStatusWidget extends StatefulWidget {
const SyncStatusWidget({Key key}) : super(key: key);
@override
_SyncStatusWidgetState createState() => _SyncStatusWidgetState();
}
class _SyncStatusWidgetState extends State<SyncStatusWidget> {
static const Duration kSleepDuration = Duration(milliseconds: 3000);
static const _inProgressIcon = CircularProgressIndicator(
strokeWidth: 2,
valueColor: AlwaysStoppedAnimation<Color>(Color.fromRGBO(45, 194, 98, 1.0)),
);
SyncStatusUpdate _event;
StreamSubscription<SyncStatusUpdate> _subscription;
@override
void initState() {
_subscription = Bus.instance.on<SyncStatusUpdate>().listen((event) {
@ -42,6 +101,17 @@ class _StatusBarWidgetState extends State<StatusBarWidget> {
@override
Widget build(BuildContext context) {
return Align(
alignment: Alignment.topRight,
child: Container(
height: kContainerHeight,
color: Colors.transparent,
child: _getContents(),
),
);
}
Widget _getContents() {
bool isNotOutdatedEvent = _event != null &&
(_event.status == SyncStatus.completed_backup ||
_event.status == SyncStatus.completed_first_gallery_import) &&
@ -53,29 +123,12 @@ class _StatusBarWidgetState extends State<StatusBarWidget> {
if (_event.status == SyncStatus.error) {
return HeaderErrorWidget(error: _event.error);
}
if (_event.status == SyncStatus.completed_first_gallery_import ||
_event.status == SyncStatus.completed_backup) {
Future.delayed(kSleepDuration, () {
if (mounted) {
setState(() {
_containerHeight = 0;
});
}
});
} else {
_containerHeight = 48;
if (_event.status == SyncStatus.completed_backup) {
return SyncStatusCompletedWidget();
}
final icon = _event.status == SyncStatus.completed_backup
? Icon(
Icons.cloud_done_outlined,
color: Theme.of(context).buttonColor,
)
: _inProgressIcon;
return AnimatedContainer(
duration: Duration(milliseconds: 300),
height: _containerHeight,
return Container(
height: kContainerHeight,
width: double.infinity,
padding: EdgeInsets.all(8),
alignment: Alignment.center,
child: SingleChildScrollView(
physics: NeverScrollableScrollPhysics(),
@ -91,7 +144,7 @@ class _StatusBarWidgetState extends State<StatusBarWidget> {
padding: EdgeInsets.all(2),
width: 22,
height: 22,
child: icon,
child: _inProgressIcon,
),
Padding(
padding: const EdgeInsets.fromLTRB(12, 4, 0, 0),
@ -138,3 +191,62 @@ class _StatusBarWidgetState extends State<StatusBarWidget> {
return _event.reason ?? "Upload failed";
}
}
class StatusBarBrandingWidget extends StatelessWidget {
const StatusBarBrandingWidget({Key key}) : super(key: key);
@override
Widget build(BuildContext context) {
return Container(
height: kContainerHeight,
padding: EdgeInsets.only(left: 12),
child: Align(
alignment: Alignment.topLeft,
child: Text(
"ente",
style: TextStyle(
fontWeight: FontWeight.bold,
fontFamily: 'Montserrat',
fontSize: 28,
height: 1,
),
),
),
);
}
}
class SyncStatusCompletedWidget extends StatelessWidget {
const SyncStatusCompletedWidget({Key key}) : super(key: key);
@override
Widget build(BuildContext context) {
return Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Row(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Container(
padding: EdgeInsets.all(2),
width: 22,
height: 22,
child: Icon(
Icons.cloud_done_outlined,
color: Theme.of(context).buttonColor,
),
),
Padding(
padding: const EdgeInsets.fromLTRB(12, 4, 0, 0),
child: Text("All memories preserved"),
),
],
),
Padding(padding: EdgeInsets.all(4)),
Divider(),
],
);
}
}