Skip to content

Commit

Permalink
fix: #1292 Changed Appbar into Sliver appbar (#1339)
Browse files Browse the repository at this point in the history 
* intial commit

* Changed appbar into sliverbarr

* Removed filter from empty screen

* Removed unused controller
  • Loading branch information
@vik4114
vik4114 authored Mar 26, 2022
1 parent 7e8fd55 commit 5ca9607
Showing 1 changed file with 115 additions and 122 deletions.
237 changes: 115 additions & 122 deletions packages/smooth_app/lib/pages/product/common/product_query_page.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -43,27 +43,12 @@ class _ProductQueryPageState extends State<ProductQueryPage> {

late ProductQueryModel _model;
int? _lastUpdate;
final ScrollController _scrollController = ScrollController();
bool _showTitle = true;

@override
void initState() {
super.initState();
_lastUpdate = widget.lastUpdate;
_model = ProductQueryModel(widget.productListSupplier);
_scrollController.addListener(() {
if (_scrollController.offset <=
_scrollController.position.minScrollExtent &&
!_scrollController.position.outOfRange) {
if (!_showTitle) {
setState(() => _showTitle = true);
}
} else {
if (_showTitle) {
setState(() => _showTitle = false);
}
}
});
}

@override
Expand Down Expand Up @@ -136,16 +121,33 @@ class _ProductQueryPageState extends State<ProductQueryPage> {
children: <Widget>[
_getHero(screenSize, themeData),
Center(child: emptiness),
AnimatedOpacity(
opacity: _showTitle ? 1.0 : 0.0,
duration: const Duration(milliseconds: 250),
child: Row(
mainAxisSize: MainAxisSize.max,
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: <Widget>[
getBackArrow(context, widget.mainColor),
],
),
CustomScrollView(
slivers: <Widget>[
SliverAppBar(
backgroundColor: themeData.scaffoldBackgroundColor,
expandedHeight: screenSize.height * 0.15,
collapsedHeight: screenSize.height * 0.09,
pinned: true,
elevation: 0,
automaticallyImplyLeading: false,
title: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: <Widget>[
getBackArrow(context, widget.mainColor),
]),
flexibleSpace: LayoutBuilder(builder:
(BuildContext context, BoxConstraints constraints) {
return FlexibleSpaceBar(
centerTitle: true,
title: Text(
widget.name,
textAlign: TextAlign.center,
style: themeData.textTheme.headline1!
.copyWith(color: widget.mainColor),
),
background: _getHero(screenSize, themeData));
})),
],
),
],
),
Expand Down Expand Up @@ -174,112 +176,103 @@ class _ProductQueryPageState extends State<ProductQueryPage> {
body: Stack(
children: <Widget>[
_getHero(screenSize, themeData),
ListView.builder(
itemCount: _model.displayProducts!.length,
itemBuilder: (BuildContext context, int index) {
return Padding(
padding: const EdgeInsets.symmetric(
horizontal: 12.0, vertical: 8.0),
child: SmoothProductCardFound(
heroTag: _model.displayProducts![index].barcode!,
product: _model.displayProducts![index],
elevation:
Theme.of(context).brightness == Brightness.light
? 0.0
: 4.0,
).build(context),
);
},
padding: EdgeInsets.only(
top: screenSize.height * 0.25, bottom: 80.0),
controller: _scrollController,
),
AnimatedOpacity(
opacity: _showTitle ? 1.0 : 0.0,
duration: const Duration(milliseconds: 250),
child: Row(
mainAxisSize: MainAxisSize.max,
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: <Widget>[
getBackArrow(context, widget.mainColor),
Padding(
padding: const EdgeInsets.only(top: 24.0),
child: TextButton.icon(
icon: Icon(
Icons.filter_list,
color: widget.mainColor,
),
label: Text(AppLocalizations.of(context)!.filter),
style: TextButton.styleFrom(
textStyle: TextStyle(
color: widget.mainColor,
),
),
onPressed: () {
showCupertinoModalBottomSheet<Widget>(
expand: false,
context: context,
backgroundColor: Colors.transparent,
bounce: true,
builder: (BuildContext context) =>
GroupQueryFilterView(
categories: _model.categories,
categoriesList: _model.sortedCategories,
callback: (String category) {
_model.selectCategory(category);
setState(() {});
},
CustomScrollView(
slivers: <Widget>[
SliverAppBar(
backgroundColor: themeData.scaffoldBackgroundColor,
expandedHeight: screenSize.height * 0.15,
collapsedHeight: screenSize.height * 0.09,
pinned: true,
elevation: 0,
automaticallyImplyLeading: false,
title: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: <Widget>[
getBackArrow(context, widget.mainColor),
Padding(
padding: const EdgeInsets.only(top: 24.0),
child: TextButton.icon(
icon: Icon(
Icons.filter_list,
color: widget.mainColor,
),
label: Text(
AppLocalizations.of(context)!.filter,
style: themeData.textTheme.subtitle1!
.copyWith(color: widget.mainColor)),
style: TextButton.styleFrom(
textStyle: TextStyle(
color: widget.mainColor,
),
),
onPressed: () {
showCupertinoModalBottomSheet<Widget>(
expand: false,
context: context,
backgroundColor: Colors.transparent,
bounce: true,
builder: (BuildContext context) =>
GroupQueryFilterView(
categories: _model.categories,
categoriesList: _model.sortedCategories,
callback: (String category) {
_model.selectCategory(category);
setState(() {});
},
),
);
},
),
)
]),
flexibleSpace: LayoutBuilder(builder:
(BuildContext context, BoxConstraints constraints) {
return FlexibleSpaceBar(
centerTitle: true,
title: Text(
widget.name,
textAlign: TextAlign.center,
style: themeData.textTheme.headline1!
.copyWith(color: widget.mainColor),
),
);
},
),
background: _getHero(screenSize, themeData));
})),
SliverList(
delegate: SliverChildBuilderDelegate(
(_, int index) {
return Padding(
padding: const EdgeInsets.symmetric(
horizontal: 12.0, vertical: 8.0),
child: SmoothProductCardFound(
heroTag: _model.displayProducts![index].barcode!,
product: _model.displayProducts![index],
elevation:
Theme.of(context).brightness == Brightness.light
? 0.0
: 4.0,
).build(context),
);
},
childCount: _model.displayProducts!.length,
),
],
),
)
],
),
],
),
),
);

Widget _getHero(final Size screenSize, final ThemeData themeData) => Hero(
tag: widget.heroTag,
child: Container(
width: screenSize.width,
height: screenSize.height,
decoration: BoxDecoration(
color: widget.mainColor.withAlpha(32),
borderRadius: const BorderRadius.only(
bottomLeft: Radius.circular(20.0),
bottomRight: Radius.circular(20.0)),
),
padding: const EdgeInsets.only(left: 10.0, right: 10.0, top: 96.0),
child: Column(
children: <Widget>[
SizedBox(
height: 80.0,
child: Row(
mainAxisSize: MainAxisSize.max,
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Flexible(
child: AnimatedOpacity(
opacity: _showTitle ? 1.0 : 0.0,
duration: const Duration(milliseconds: 250),
child: Text(
widget.name,
textAlign: TextAlign.center,
style: themeData.textTheme.headline1!
.copyWith(color: widget.mainColor),
)),
),
],
),
),
],
)),
);
tag: widget.heroTag,
child: Container(
width: screenSize.width,
height: screenSize.height,
decoration: BoxDecoration(
color: widget.mainColor.withAlpha(32),
),
padding: const EdgeInsets.only(left: 10.0, right: 10.0, top: 96.0),
));

Widget _getEmptyText(
final ThemeData themeData,
Expand Down

0 comments on commit 5ca9607

Please sign in to comment.