From 4c5b2afca76a87c90206214fcb07e0e5611b1851 Mon Sep 17 00:00:00 2001 From: meylis98 Date: Thu, 9 Mar 2023 03:29:28 +0500 Subject: [PATCH] photo viewer added --- lib/common/photo.dart | 69 ++++++++++++++++++++++ lib/constants/utils.dart | 8 +++ lib/features/screens/details/details.dart | 30 ++++++---- lib/features/screens/home/home_screen.dart | 2 + lib/features/screens/home/search.dart | 2 +- lib/features/widgets/sapaly_app_bar.dart | 2 +- lib/l10n/app_tk.arb | 2 +- pubspec.lock | 8 +++ pubspec.yaml | 1 + 9 files changed, 110 insertions(+), 14 deletions(-) create mode 100644 lib/common/photo.dart diff --git a/lib/common/photo.dart b/lib/common/photo.dart new file mode 100644 index 0000000..1599fd9 --- /dev/null +++ b/lib/common/photo.dart @@ -0,0 +1,69 @@ +import 'dart:ui'; +import 'package:cached_network_image/cached_network_image.dart'; +import 'package:flutter/material.dart'; +import 'package:photo_view/photo_view.dart'; +import 'package:sapaly_shop/themes/app_theme.dart'; + +class PhotoScreen extends StatefulWidget { + final String image; + const PhotoScreen(this.image); + + @override + _PhotoScreenState createState() => _PhotoScreenState(); +} + +class _PhotoScreenState extends State { + @override + void initState() { + super.initState(); + } + + @override + void dispose() { + super.dispose(); + } + + @override + Widget build(BuildContext context) { + final double paddingTop = MediaQueryData.fromWindow(window).padding.top; + return Container( + color: Colors.black, + child: Stack( + children: [ + PhotoView( + loadingBuilder: (_, chunk) => const Center( + child: CircularProgressIndicator( + color: AppTheme.lightPrimaryColor)), + imageProvider: CachedNetworkImageProvider(widget.image)), + OrientationBuilder( + builder: (cntxt, orientation) { + double height = (orientation == Orientation.portrait + ? MediaQuery.of(context).size.height + : MediaQuery.of(context).size.width) * + 0.049; + return Container( + height: height, + alignment: Alignment.centerRight, + width: MediaQuery.of(context).size.width * 0.98, + margin: EdgeInsets.only(top: paddingTop), + child: FittedBox( + child: Material( + color: Colors.transparent, + child: InkWell( + onTap: () => Navigator.of(cntxt).pop(), + child: Icon( + Icons.close, + color: Colors.white, + size: height * 0.8, + ), + ), + ), + ), + ); + }, + ), + ], + ), + ); + } +} diff --git a/lib/constants/utils.dart b/lib/constants/utils.dart index 06ae726..a1260cd 100644 --- a/lib/constants/utils.dart +++ b/lib/constants/utils.dart @@ -108,3 +108,11 @@ Future yesOrNoDialog(BuildContext context, }) ?? false); } + +class CustomScrollBehavior extends ScrollBehavior { + @override + Widget buildOverscrollIndicator( + BuildContext context, Widget child, ScrollableDetails details) { + return child; + } +} diff --git a/lib/features/screens/details/details.dart b/lib/features/screens/details/details.dart index 0fad807..f619214 100644 --- a/lib/features/screens/details/details.dart +++ b/lib/features/screens/details/details.dart @@ -2,6 +2,8 @@ import 'package:adaptix/adaptix.dart'; import 'package:cached_network_image/cached_network_image.dart'; import 'package:flutter/material.dart'; import 'package:flutter_svg/flutter_svg.dart'; +import 'package:sapaly_shop/common/photo.dart'; +import 'package:sapaly_shop/features/services/page_navigator.dart'; import 'package:sapaly_shop/features/widgets/sapaly_app_bar.dart'; import 'package:sapaly_shop/models/details_model.dart'; import 'package:sapaly_shop/models/settings_model.dart'; @@ -52,7 +54,7 @@ class _DetailsState extends State
{ appBar: SapalyAppBar( hasActionButton: true, badge: '2', - title: 'Details', + title: widget.description, actionButton: SvgPicture.asset('assets/icons/cart.svg'), leadingButton: const Icon(Icons.arrow_back, color: AppTheme.blackColor), leadingOnTap: () { @@ -72,16 +74,22 @@ class _DetailsState extends State
{ children: [ Padding( padding: EdgeInsets.symmetric(vertical: 15.adaptedPx()), - child: ClipRRect( - borderRadius: BorderRadius.circular(16.adaptedPx()), - child: CachedNetworkImage( - imageUrl: widget.image, - width: double.infinity, - errorWidget: (context, url, error) => Center( - child: SizedBox( - height: 150.adaptedPx(), - child: const CircularProgressIndicator( - color: AppTheme.lightPrimaryColor, + child: GestureDetector( + onTap: () { + PageNavigator(ctx: context) + .nextPage(page: PhotoScreen(widget.image)); + }, + child: ClipRRect( + borderRadius: BorderRadius.circular(16.adaptedPx()), + child: CachedNetworkImage( + imageUrl: widget.image, + width: double.infinity, + errorWidget: (context, url, error) => Center( + child: SizedBox( + height: 150.adaptedPx(), + child: const CircularProgressIndicator( + color: AppTheme.lightPrimaryColor, + ), ), ), ), diff --git a/lib/features/screens/home/home_screen.dart b/lib/features/screens/home/home_screen.dart index 864b2d5..97bd43a 100644 --- a/lib/features/screens/home/home_screen.dart +++ b/lib/features/screens/home/home_screen.dart @@ -5,6 +5,7 @@ import 'package:carousel_slider/carousel_slider.dart'; import 'package:flutter/material.dart'; import 'package:flutter_svg/flutter_svg.dart'; import 'package:google_fonts/google_fonts.dart'; +import 'package:sapaly_shop/constants/utils.dart'; import 'package:sapaly_shop/models/settings_model.dart'; import 'package:sapaly_shop/models/sliders_model.dart'; import 'package:sapaly_shop/models/subcategory_model.dart'; @@ -98,6 +99,7 @@ class _HomeScreenState extends State with TickerProviderStateMixin { ), child: NestedScrollView( physics: const BouncingScrollPhysics(), + scrollBehavior: CustomScrollBehavior(), headerSliverBuilder: (context, innerBoxIsScrolled) => [ SliverToBoxAdapter( child: Column( diff --git a/lib/features/screens/home/search.dart b/lib/features/screens/home/search.dart index dbbb688..1c2c5f0 100644 --- a/lib/features/screens/home/search.dart +++ b/lib/features/screens/home/search.dart @@ -16,7 +16,7 @@ class SearchScreen extends StatelessWidget { appBar: SapalyAppBar( hasActionButton: false, badge: '', - title: 'search'.translation, + title: 'searchHint'.translation, actionButton: Container(color: AppTheme.lightBackgroundColor), leadingButton: const Icon(Icons.arrow_back, color: AppTheme.blackColor), leadingOnTap: () { diff --git a/lib/features/widgets/sapaly_app_bar.dart b/lib/features/widgets/sapaly_app_bar.dart index 8b7a7ca..96cd787 100644 --- a/lib/features/widgets/sapaly_app_bar.dart +++ b/lib/features/widgets/sapaly_app_bar.dart @@ -35,7 +35,7 @@ class SapalyAppBar extends StatelessWidget with PreferredSizeWidget { titleTextStyle: Theme.of(context).primaryTextTheme.bodyMedium?.copyWith( color: AppTheme.blackColor, fontWeight: FontWeight.w600, - fontSize: 20.adaptedPx(), + fontSize: 17.adaptedPx(), ), toolbarTextStyle: Theme.of(context).primaryTextTheme.bodyMedium?.copyWith( diff --git a/lib/l10n/app_tk.arb b/lib/l10n/app_tk.arb index a346548..d283f26 100644 --- a/lib/l10n/app_tk.arb +++ b/lib/l10n/app_tk.arb @@ -11,5 +11,5 @@ "register":"Agza bolmak", "your_phone_number":"Siziň telefon belgiňiz", "repeat_password":"Açar sözi gaýtalaň", - "repeat_password_to_confirm":"Açar sözi tassyklamak üçin gaýtalaň" + "repeat_password_to_confirm":"Açar sözi tassyklamak üçin gaýtalaň", } \ No newline at end of file diff --git a/pubspec.lock b/pubspec.lock index 40cfbb9..8964e06 100644 --- a/pubspec.lock +++ b/pubspec.lock @@ -454,6 +454,14 @@ packages: url: "https://pub.dev" source: hosted version: "5.1.0" + photo_view: + dependency: "direct main" + description: + name: photo_view + sha256: "8036802a00bae2a78fc197af8a158e3e2f7b500561ed23b4c458107685e645bb" + url: "https://pub.dev" + source: hosted + version: "0.14.0" platform: dependency: transitive description: diff --git a/pubspec.yaml b/pubspec.yaml index cf0c9a8..ca32598 100644 --- a/pubspec.yaml +++ b/pubspec.yaml @@ -51,6 +51,7 @@ dependencies: url_launcher: ^6.1.9 shared_preferences: ^2.0.17 provider: ^6.0.5 + photo_view: ^0.14.0 dev_dependencies: flutter_test: