From db3ea448f6dde4c284367d3587eb1fd20d6ba39f Mon Sep 17 00:00:00 2001 From: Fatimah Alshammari Date: Tue, 23 Nov 2021 14:22:53 +0300 Subject: [PATCH 1/2] fix design --- .../product-details/product-detail.dart | 52 ++--- .../product-name-and-price.dart | 195 +++++++++++++----- 2 files changed, 168 insertions(+), 79 deletions(-) diff --git a/lib/pages/pharmacies/screens/product-details/product-detail.dart b/lib/pages/pharmacies/screens/product-details/product-detail.dart index 1f9dcc52..bde315a7 100644 --- a/lib/pages/pharmacies/screens/product-details/product-detail.dart +++ b/lib/pages/pharmacies/screens/product-details/product-detail.dart @@ -158,30 +158,30 @@ class __ProductDetailPageState extends State { ), ), SizedBox( - height: 6, - ), - Container( - color: Colors.white, - child: Column( - mainAxisAlignment: MainAxisAlignment.start, - crossAxisAlignment: CrossAxisAlignment.start, - children: [ - Container( - padding: EdgeInsets.symmetric(vertical: 15, horizontal: 10), - child: Texts( - TranslationBase.of(context).specification, - fontSize: 15, - fontWeight: FontWeight.bold, - ), - width: double.infinity, - ), - // Divider(color: Colors.grey), - ], - ), - ), - SizedBox( - height: 6, + height: 10, ), +// Container( +// color: Colors.white, +// child: Column( +// mainAxisAlignment: MainAxisAlignment.start, +// crossAxisAlignment: CrossAxisAlignment.start, +// children: [ +// Container( +// padding: EdgeInsets.symmetric(vertical: 15, horizontal: 10), +// child: Texts( +// TranslationBase.of(context).specification, +// fontSize: 15, +// fontWeight: FontWeight.bold, +// ), +// width: double.infinity, +// ), +// // Divider(color: Colors.grey), +// ], +// ), +// ), +// SizedBox( +// height: 6, +// ), Container( // width: 500, margin: EdgeInsets.only(bottom: 10), @@ -205,7 +205,7 @@ class __ProductDetailPageState extends State { }, child: Text( TranslationBase.of(context).details, - style: TextStyle(fontSize: 16, fontWeight: FontWeight.bold), + style: TextStyle( fontWeight: FontWeight.w600, fontSize: 14), ), color: Colors.white, ), @@ -236,7 +236,7 @@ class __ProductDetailPageState extends State { }, child: Text( TranslationBase.of(context).reviews, - style: TextStyle(fontSize: 16, fontWeight: FontWeight.bold), + style: TextStyle( fontWeight: FontWeight.w600, fontSize: 14), ), color: Colors.white, ), @@ -266,7 +266,7 @@ class __ProductDetailPageState extends State { : null, child: Text( TranslationBase.of(context).availability, - style: TextStyle(fontSize: 16, fontWeight: FontWeight.bold), + style: TextStyle( fontWeight: FontWeight.w600, fontSize: 14), ), color: Colors.white, ), diff --git a/lib/pages/pharmacies/screens/product-details/product-name-and-price.dart b/lib/pages/pharmacies/screens/product-details/product-name-and-price.dart index f71c92a4..799259d7 100644 --- a/lib/pages/pharmacies/screens/product-details/product-name-and-price.dart +++ b/lib/pages/pharmacies/screens/product-details/product-name-and-price.dart @@ -43,31 +43,100 @@ class _ProductNameAndPriceState extends State { SizedBox( height: 10, ), + widget.item.rxMessage != null + ? Container( + // width: widget.item.rxMessage != null ? MediaQuery.of(context).size.width / 2.8 : 0, + width: double.infinity, + height: 40, + padding: EdgeInsets.all(4), + decoration: BoxDecoration( + color: Color(0xffD02127), + // color: Colors.red[700] + // borderRadius: BorderRadius.only(topLeft: Radius.circular(6)), + ), + child: Row( + children: [ + Padding( + padding: const EdgeInsets.only(left: 8, right: 8), + child: Icon( + Icons.warning, + color: Colors.white, + ), + ), + Text( + projectViewModel.isArabic ? widget.item.rxMessagen.toString() : widget.item.rxMessage.toString(), + style: TextStyle(color: Colors.white, + // regular: true, + fontSize: 17, + fontWeight: FontWeight.w600, + // textAlign: TextAlign.center, + ) + ), + ], + ) + ) + : Container(), FractionallySizedBox( widthFactor: 0.95, child: Row( mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [ - Texts(widget.item.price.toString() + " " + TranslationBase.of(context).sar, fontWeight: FontWeight.bold, fontSize: 20), - Texts( - widget.stockAvailability, - fontWeight: FontWeight.bold, - fontSize: 15, - color: widget.isStockAvailable ? Colors.green : Colors.red, +// Texts(widget.item.price.toString() + " " + TranslationBase.of(context).sar, fontWeight: FontWeight.bold, fontSize: 20), + Container( + margin: EdgeInsets.only(top: 10.0, right: 10.0), + padding: EdgeInsets.only(left: 11.0, right: 11.0, top: 0, bottom: 0), + decoration: BoxDecoration( + border: Border.all( + color: getStatusBackgroundColor(), + style: BorderStyle.solid, + width: 5.0, + ), + color: getStatusBackgroundColor(), + borderRadius: BorderRadius.circular(30.0)), + child: Text( + widget.stockAvailability, + style: TextStyle(fontWeight: FontWeight.w600, fontSize: 11, color: Color(0xffFFFFFF),), + //color: widget.isStockAvailable ? Colors.white : Colors.red, + ), ), // SizedBox(width: 20), if (widget.authenticatedUserObject.isLogin) !widget.isStockAvailable && widget.customerId != null - ?BorderedButton( - TranslationBase.of(context).notifyMe, - hasBorder: true, - borderColor: Colors.green, - textColor: Colors.green, - fontWeight: FontWeight.bold, - vPadding: 6, - hPadding: 14, - handler: () => widget.notifyMeWhenAvailable(context, widget.item.id), - ) + ?IconButton( + iconSize: 25, + icon:Icon(Icons.notifications_active), + color: new Color(0xff2E303A), + onPressed: () + { widget.notifyMeWhenAvailable(context, widget.item.id);}, + + ): IconButton( + icon: Icon(!widget.isInWishList ? Icons.favorite_border : Icons.favorite), + color: !widget.isInWishList ? Color(0xff2E303A) : Color(0xffD02127), + onPressed: () async { + { + if (widget.customerId != null) { + if (!widget.isInWishList) { + await widget.addToWishlistFunction(widget.item.id); + } else { + await widget.deleteFromWishlistFunction(widget.item.id); + } + } else { + return; + } + setState(() {}); + } + }, + ) +// BorderedButton( +// TranslationBase.of(context).notifyMe, +// hasBorder: true, +// borderColor: Colors.green, +// textColor: Colors.green, +// fontWeight: FontWeight.bold, +// vPadding: 6, +// hPadding: 14, +// handler: () => widget.notifyMeWhenAvailable(context, widget.item.id), +// ) // InkWell( // onTap: () => widget.notifyMeWhenAvailable(context, widget.item.id), // child: Row(children: [ @@ -84,39 +153,53 @@ class _ProductNameAndPriceState extends State { // ) // ]), // ) - : IconWithBg( - icon: !widget.isInWishList ? Icons.favorite_border : Icons.favorite, - color: !widget.isInWishList ? Colors.white : Colors.red[800], - onPress: () async { - { - if (widget.customerId != null) { - if (!widget.isInWishList) { - await widget.addToWishlistFunction(widget.item.id); - } else { - await widget.deleteFromWishlistFunction(widget.item.id); - } - } else { - return; - } - setState(() {}); - } - }, - ) +// : IconWithBg( +// icon: !widget.isInWishList ? Icons.favorite_border : Icons.favorite, +// color: !widget.isInWishList ? Colors.white : Colors.red[800], +// onPress: () async { +// { +// if (widget.customerId != null) { +// if (!widget.isInWishList) { +// await widget.addToWishlistFunction(widget.item.id); +// } else { +// await widget.deleteFromWishlistFunction(widget.item.id); +// } +// } else { +// return; +// } +// setState(() {}); +// } +// }, +// ) ], ), ), Padding( - padding: const EdgeInsets.all(8.0), + padding: const EdgeInsets.only(left: 8,right: 8, top: 1, bottom: 15), child: Container( - margin: EdgeInsets.only(left: 5), + margin: EdgeInsets.only(left: 5, right: 5), child: Align( alignment: projectViewModel.isArabic ? Alignment.topRight : Alignment.topLeft, child: Text( projectViewModel.isArabic ? widget.item.namen : widget.item.name, - style: TextStyle(fontWeight: FontWeight.bold, fontSize: 15), + style: TextStyle( fontWeight: FontWeight.w600, fontSize: 16), ), ), ), + + ), + Padding( + padding: const EdgeInsets.only(left: 8,right: 8), + child: Container( + margin: EdgeInsets.only(left: 5, right: 5), + child: Align( + alignment: projectViewModel.isArabic ? Alignment.topRight : Alignment.topLeft, + child: Text( TranslationBase.of(context).sar+ " " + + widget.item.price.toString(), + style: TextStyle(fontWeight: FontWeight.bold, fontSize: 19),), + ), + ), + ), FractionallySizedBox( widthFactor: 0.95, @@ -129,13 +212,13 @@ class _ProductNameAndPriceState extends State { children: [ RatingBar.readOnly( initialRating: double.parse(widget.item.approvedRatingSum.toString()), - size: 15.0, - filledColor: Colors.yellow[700], - emptyColor: Colors.grey[400], + size: 18.0, + filledColor: Color(0XFFD02127), + emptyColor: Color(0XFFD02127), isHalfAllowed: true, halfFilledIcon: Icons.star_half, filledIcon: Icons.star, - emptyIcon: Icons.star, + emptyIcon: Icons.star_border, ), SizedBox( width: 10, @@ -148,22 +231,22 @@ class _ProductNameAndPriceState extends State { SizedBox( width: 30, ), - Texts( + Text( "(${widget.item.approvedTotalReviews}${TranslationBase.of(context).review})", - fontSize: 12, + style: TextStyle(fontWeight: FontWeight.w600, fontSize: 12), ), SizedBox( width: 70, ), - if (widget.item.rxMessage != null) - Row( - children: [ - Text( - projectViewModel.isArabic ? widget.item.rxMessagen.toString() : widget.item.rxMessage.toString(), - style: TextStyle(color: Colors.red, fontSize: 10), - ), - ], - ) +// if (widget.item.rxMessage != null) +// Row( +// children: [ +// Text( +// projectViewModel.isArabic ? widget.item.rxMessagen.toString() : widget.item.rxMessage.toString(), +// style: TextStyle(color: Colors.red, fontSize: 10), +// ), +// ], +// ) ], ), ), @@ -172,9 +255,15 @@ class _ProductNameAndPriceState extends State { ), ), SizedBox( - height: 10, + height: 30, ), ], ); } + + Color getStatusBackgroundColor() { + if (widget.isStockAvailable) + return Color(0xFF5AB145); + else return Color(0xFFD02127); + } } From dbe74b3eb44c9aaa43e3f7a142f270ba5950d952 Mon Sep 17 00:00:00 2001 From: Fatimah Alshammari Date: Tue, 23 Nov 2021 14:31:44 +0300 Subject: [PATCH 2/2] fix desing --- .../product-name-and-price.dart | 291 +++++++++--------- 1 file changed, 147 insertions(+), 144 deletions(-) diff --git a/lib/pages/pharmacies/screens/product-details/product-name-and-price.dart b/lib/pages/pharmacies/screens/product-details/product-name-and-price.dart index 799259d7..d585b642 100644 --- a/lib/pages/pharmacies/screens/product-details/product-name-and-price.dart +++ b/lib/pages/pharmacies/screens/product-details/product-name-and-price.dart @@ -37,96 +37,98 @@ class _ProductNameAndPriceState extends State { Widget build(BuildContext context) { ProjectViewModel projectViewModel = Provider.of(context); - return Column( - mainAxisAlignment: MainAxisAlignment.start, - children: [ - SizedBox( - height: 10, - ), - widget.item.rxMessage != null - ? Container( - // width: widget.item.rxMessage != null ? MediaQuery.of(context).size.width / 2.8 : 0, - width: double.infinity, - height: 40, - padding: EdgeInsets.all(4), - decoration: BoxDecoration( - color: Color(0xffD02127), - // color: Colors.red[700] - // borderRadius: BorderRadius.only(topLeft: Radius.circular(6)), + return Container( + color: Color(0xffF7F7F7), + child: Column( + mainAxisAlignment: MainAxisAlignment.start, + children: [ + SizedBox( + height: 10, ), - child: Row( - children: [ - Padding( - padding: const EdgeInsets.only(left: 8, right: 8), - child: Icon( - Icons.warning, - color: Colors.white, + widget.item.rxMessage != null + ? Container( + // width: widget.item.rxMessage != null ? MediaQuery.of(context).size.width / 2.8 : 0, + width: double.infinity, + height: 40, + padding: EdgeInsets.all(4), + decoration: BoxDecoration( + color: Color(0xffD02127), + // color: Colors.red[700] + // borderRadius: BorderRadius.only(topLeft: Radius.circular(6)), + ), + child: Row( + children: [ + Padding( + padding: const EdgeInsets.only(left: 8, right: 8), + child: Icon( + Icons.warning, + color: Colors.white, + ), ), - ), - Text( - projectViewModel.isArabic ? widget.item.rxMessagen.toString() : widget.item.rxMessage.toString(), - style: TextStyle(color: Colors.white, - // regular: true, - fontSize: 17, - fontWeight: FontWeight.w600, - // textAlign: TextAlign.center, - ) - ), - ], + Text( + projectViewModel.isArabic ? widget.item.rxMessagen.toString() : widget.item.rxMessage.toString(), + style: TextStyle(color: Colors.white, + // regular: true, + fontSize: 17, + fontWeight: FontWeight.w600, + // textAlign: TextAlign.center, + ) + ), + ], + ) ) - ) - : Container(), - FractionallySizedBox( - widthFactor: 0.95, - child: Row( - mainAxisAlignment: MainAxisAlignment.spaceBetween, - children: [ + : Container(), + FractionallySizedBox( + widthFactor: 0.95, + child: Row( + mainAxisAlignment: MainAxisAlignment.spaceBetween, + children: [ // Texts(widget.item.price.toString() + " " + TranslationBase.of(context).sar, fontWeight: FontWeight.bold, fontSize: 20), - Container( - margin: EdgeInsets.only(top: 10.0, right: 10.0), - padding: EdgeInsets.only(left: 11.0, right: 11.0, top: 0, bottom: 0), - decoration: BoxDecoration( - border: Border.all( + Container( + margin: EdgeInsets.only(top: 10.0, right: 10.0), + padding: EdgeInsets.only(left: 11.0, right: 11.0, top: 0, bottom: 0), + decoration: BoxDecoration( + border: Border.all( + color: getStatusBackgroundColor(), + style: BorderStyle.solid, + width: 5.0, + ), color: getStatusBackgroundColor(), - style: BorderStyle.solid, - width: 5.0, - ), - color: getStatusBackgroundColor(), - borderRadius: BorderRadius.circular(30.0)), - child: Text( - widget.stockAvailability, - style: TextStyle(fontWeight: FontWeight.w600, fontSize: 11, color: Color(0xffFFFFFF),), - //color: widget.isStockAvailable ? Colors.white : Colors.red, + borderRadius: BorderRadius.circular(30.0)), + child: Text( + widget.stockAvailability, + style: TextStyle(fontWeight: FontWeight.w600, fontSize: 11, color: Color(0xffFFFFFF),), + //color: widget.isStockAvailable ? Colors.white : Colors.red, + ), ), - ), - // SizedBox(width: 20), - if (widget.authenticatedUserObject.isLogin) - !widget.isStockAvailable && widget.customerId != null - ?IconButton( - iconSize: 25, - icon:Icon(Icons.notifications_active), - color: new Color(0xff2E303A), - onPressed: () - { widget.notifyMeWhenAvailable(context, widget.item.id);}, + // SizedBox(width: 20), + if (widget.authenticatedUserObject.isLogin) + !widget.isStockAvailable && widget.customerId != null + ?IconButton( + iconSize: 25, + icon:Icon(Icons.notifications_active), + color: new Color(0xff2E303A), + onPressed: () + { widget.notifyMeWhenAvailable(context, widget.item.id);}, - ): IconButton( - icon: Icon(!widget.isInWishList ? Icons.favorite_border : Icons.favorite), - color: !widget.isInWishList ? Color(0xff2E303A) : Color(0xffD02127), - onPressed: () async { - { - if (widget.customerId != null) { - if (!widget.isInWishList) { - await widget.addToWishlistFunction(widget.item.id); + ): IconButton( + icon: Icon(!widget.isInWishList ? Icons.favorite_border : Icons.favorite), + color: !widget.isInWishList ? Color(0xff2E303A) : Color(0xffD02127), + onPressed: () async { + { + if (widget.customerId != null) { + if (!widget.isInWishList) { + await widget.addToWishlistFunction(widget.item.id); + } else { + await widget.deleteFromWishlistFunction(widget.item.id); + } } else { - await widget.deleteFromWishlistFunction(widget.item.id); + return; } - } else { - return; + setState(() {}); } - setState(() {}); - } - }, - ) + }, + ) // BorderedButton( // TranslationBase.of(context).notifyMe, // hasBorder: true, @@ -171,73 +173,73 @@ class _ProductNameAndPriceState extends State { // } // }, // ) - ], + ], + ), ), - ), - Padding( - padding: const EdgeInsets.only(left: 8,right: 8, top: 1, bottom: 15), - child: Container( - margin: EdgeInsets.only(left: 5, right: 5), - child: Align( - alignment: projectViewModel.isArabic ? Alignment.topRight : Alignment.topLeft, - child: Text( - projectViewModel.isArabic ? widget.item.namen : widget.item.name, - style: TextStyle( fontWeight: FontWeight.w600, fontSize: 16), + Padding( + padding: const EdgeInsets.only(left: 8,right: 8, top: 1, bottom: 15), + child: Container( + margin: EdgeInsets.only(left: 5, right: 5), + child: Align( + alignment: projectViewModel.isArabic ? Alignment.topRight : Alignment.topLeft, + child: Text( + projectViewModel.isArabic ? widget.item.namen : widget.item.name, + style: TextStyle( fontWeight: FontWeight.w600, fontSize: 16), + ), ), ), - ), - ), - Padding( - padding: const EdgeInsets.only(left: 8,right: 8), - child: Container( - margin: EdgeInsets.only(left: 5, right: 5), - child: Align( - alignment: projectViewModel.isArabic ? Alignment.topRight : Alignment.topLeft, - child: Text( TranslationBase.of(context).sar+ " " + - widget.item.price.toString(), - style: TextStyle(fontWeight: FontWeight.bold, fontSize: 19),), - ), ), + Padding( + padding: const EdgeInsets.only(left: 8,right: 8), + child: Container( + margin: EdgeInsets.only(left: 5, right: 5), + child: Align( + alignment: projectViewModel.isArabic ? Alignment.topRight : Alignment.topLeft, + child: Text( TranslationBase.of(context).sar+ " " + + widget.item.price.toString(), + style: TextStyle(fontWeight: FontWeight.bold, fontSize: 19),), + ), + ), - ), - FractionallySizedBox( - widthFactor: 0.95, - child: Row( - children: [ - Container( - child: Align( - alignment: Alignment.bottomLeft, - child: Row( - children: [ - RatingBar.readOnly( - initialRating: double.parse(widget.item.approvedRatingSum.toString()), - size: 18.0, - filledColor: Color(0XFFD02127), - emptyColor: Color(0XFFD02127), - isHalfAllowed: true, - halfFilledIcon: Icons.star_half, - filledIcon: Icons.star, - emptyIcon: Icons.star_border, - ), - SizedBox( - width: 10, - ), + ), + FractionallySizedBox( + widthFactor: 0.95, + child: Row( + children: [ + Container( + child: Align( + alignment: Alignment.bottomLeft, + child: Row( + children: [ + RatingBar.readOnly( + initialRating: double.parse(widget.item.approvedRatingSum.toString()), + size: 18.0, + filledColor: Color(0XFFD02127), + emptyColor: Color(0XFFD02127), + isHalfAllowed: true, + halfFilledIcon: Icons.star_half, + filledIcon: Icons.star, + emptyIcon: Icons.star_border, + ), + SizedBox( + width: 10, + ), // Texts( // "${widget.item.approvedRatingSum}", // fontWeight: FontWeight.bold, // fontSize: 12, // ), - SizedBox( - width: 30, - ), - Text( - "(${widget.item.approvedTotalReviews}${TranslationBase.of(context).review})", - style: TextStyle(fontWeight: FontWeight.w600, fontSize: 12), - ), - SizedBox( - width: 70, - ), + SizedBox( + width: 30, + ), + Text( + "(${widget.item.approvedTotalReviews}${TranslationBase.of(context).review})", + style: TextStyle(fontWeight: FontWeight.w600, fontSize: 12), + ), + SizedBox( + width: 70, + ), // if (widget.item.rxMessage != null) // Row( // children: [ @@ -247,17 +249,18 @@ class _ProductNameAndPriceState extends State { // ), // ], // ) - ], + ], + ), ), ), - ), - ], + ], + ), + ), + SizedBox( + height: 30, ), - ), - SizedBox( - height: 30, - ), - ], + ], + ), ); }