show bottom action bar on selecting files

This commit is contained in:
ashilkn 2022-11-29 16:11:26 +05:30
parent 701ebe5e3f
commit f69975d2a6

View file

@ -1,5 +1,6 @@
import 'package:expandable/expandable.dart';
import 'package:flutter/material.dart';
import 'package:photos/models/selected_files.dart';
import 'package:photos/theme/ente_theme.dart';
import 'package:photos/ui/components/bottom_action_bar/action_bar_widget.dart';
import 'package:photos/ui/components/icon_button_widget.dart';
@ -9,8 +10,12 @@ class BottomActionBarWidget extends StatefulWidget {
final String? text;
final List<Widget>? iconButtons;
final Widget expandedMenu;
final bool showBottomActionBarByDefault;
final SelectedFiles? selectedFiles;
const BottomActionBarWidget({
required this.expandedMenu,
required this.showBottomActionBarByDefault,
this.selectedFiles,
this.text,
this.iconButtons,
super.key,
@ -21,57 +26,78 @@ class BottomActionBarWidget extends StatefulWidget {
}
class _BottomActionBarWidgetState extends State<BottomActionBarWidget> {
late bool _showBottomActionBar;
final ExpandableController _expandableController =
ExpandableController(initialExpanded: false);
@override
void initState() {
_showBottomActionBar = widget.showBottomActionBarByDefault;
widget.selectedFiles?.addListener(_selectedFilesListener);
super.initState();
}
@override
void dispose() {
widget.selectedFiles?.removeListener(_selectedFilesListener);
super.dispose();
}
@override
Widget build(BuildContext context) {
final colorScheme = getEnteColorScheme(context);
final textTheme = getEnteTextTheme(context);
//todo : restrict width of column
return Container(
padding: const EdgeInsets.only(top: 4, bottom: 36),
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
ExpandableNotifier(
controller: _expandableController,
child: ExpandablePanel(
theme: getExpandableTheme(context),
header: Padding(
padding: EdgeInsets.symmetric(
horizontal: widget.text == null ? 12 : 0,
),
child: ActionBarWidget(
text: widget.text,
iconButtons: _iconButtons(),
),
return AnimatedSwitcher(
duration: const Duration(milliseconds: 200),
child: _showBottomActionBar
? Container(
padding: const EdgeInsets.only(top: 4, bottom: 36),
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
ExpandableNotifier(
controller: _expandableController,
child: ExpandablePanel(
theme: getExpandableTheme(context),
header: Padding(
padding: EdgeInsets.symmetric(
horizontal: widget.text == null ? 12 : 0,
),
child: ActionBarWidget(
text: widget.text,
iconButtons: _iconButtons(),
),
),
expanded: widget.expandedMenu,
collapsed: const SizedBox.shrink(),
controller: _expandableController,
),
),
GestureDetector(
onTap: () {
//unselect all files here
//or collapse the expansion panel
_expandableController.value = false;
},
child: Container(
width: double.infinity,
padding: const EdgeInsets.symmetric(
horizontal: 16,
vertical: 14,
),
child: Center(
child: Text(
"Cancel",
style: textTheme.bodyBold
.copyWith(color: colorScheme.blurTextBase),
),
),
),
)
],
),
expanded: widget.expandedMenu,
collapsed: const SizedBox.shrink(),
controller: _expandableController,
),
),
GestureDetector(
onTap: () {
//unselect all files here
//or collapse the expansion panel
_expandableController.value = false;
},
child: Container(
width: double.infinity,
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 14),
child: Center(
child: Text(
"Cancel",
style: textTheme.bodyBold
.copyWith(color: colorScheme.blurTextBase),
),
),
),
)
],
),
)
: const SizedBox.shrink(),
);
}
@ -83,6 +109,18 @@ class _BottomActionBarWidgetState extends State<BottomActionBarWidget> {
iconButtons.removeWhere((element) => element == null);
return iconButtons as List<Widget>;
}
_selectedFilesListener() {
if (mounted) {
setState(() {
if (widget.selectedFiles!.files.isNotEmpty) {
_showBottomActionBar = true;
} else {
_showBottomActionBar = false;
}
});
}
}
}
class ExpansionIconWidget extends StatefulWidget {