D1APP-28 pageview basics

lib/pages/home/radar/radar_details/radar_details.dart

@@ -0,0 +1,13 @@
+import 'package:didvan/widgets/didvan/page_view.dart';
+import 'package:flutter/material.dart';
+
+class RadarDetails extends StatelessWidget {
+  const RadarDetails({Key? key}) : super(key: key);
+
+  @override
+  Widget build(BuildContext context) {
+    return Scaffold(
+      body: DidvanPageView(),
+    );
+  }
+}

lib/pages/home/radar/radar_details/radar_details_state.dart

@@ -0,0 +1,3 @@
+import 'package:didvan/providers/core_provider.dart';
+
+class RadarDetailsState extends CoreProvier {}

lib/pages/home/radar/widgets/categories_list.dart

@@ -67,11 +67,14 @@ class CategoriesList extends StatelessWidget {
       width: 100,
       padding: const EdgeInsets.all(4),
       alignment: Alignment.center,
+      child: FittedBox(
+        fit: BoxFit.scaleDown,
         child: DidvanText(
           category.title,
           fontWeight: FontWeight.w600,
           color: Theme.of(context).colorScheme.focusedBorder,
         ),
+      ),
       decoration: BoxDecoration(
         border: Border.all(
           color: Theme.of(context).colorScheme.focusedBorder,

lib/pages/home/radar/widgets/radar_item.dart

@@ -1,6 +1,7 @@
 import 'package:didvan/config/design_config.dart';
 import 'package:didvan/config/theme_data.dart';
 import 'package:didvan/constants/app_icons.dart';
+import 'package:didvan/routes/routes.dart';
 import 'package:didvan/widgets/didvan/card.dart';
 import 'package:didvan/widgets/didvan/divider.dart';
 import 'package:didvan/widgets/didvan/text.dart';
@@ -12,7 +13,9 @@ class RadarItem extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
-    return DidvanCard(
+    return GestureDetector(
+      onTap: () => Navigator.of(context).pushNamed(Routes.radarDetails),
+      child: DidvanCard(
         margin: const EdgeInsets.only(bottom: 20),
         child: Column(
           crossAxisAlignment: CrossAxisAlignment.start,
@@ -79,6 +82,7 @@ class RadarItem extends StatelessWidget {
             ),
           ],
         ),
+      ),
     );
   }
 }

lib/routes/route_generator.dart

@@ -5,6 +5,8 @@ import 'package:didvan/pages/home/home_state.dart';
 import 'package:didvan/pages/home/profile/edit_profile/edit_profile.dart';
 import 'package:didvan/pages/home/profile/settings/settings.dart';
 import 'package:didvan/pages/home/profile/settings/settings_state.dart';
+import 'package:didvan/pages/home/radar/radar_details/radar_details.dart';
+import 'package:didvan/pages/home/radar/radar_details/radar_details_state.dart';
 import 'package:didvan/pages/splash/splash.dart';
 import 'package:didvan/pages/splash/splash_state.dart';
 import 'package:didvan/routes/routes.dart';
@@ -46,6 +48,13 @@ class RouteGenerator {
             child: const Settings(),
           ),
         );
+      case Routes.radarDetails:
+        return _createRoute(
+          ChangeNotifierProvider<RadarDetailsState>(
+            create: (context) => RadarDetailsState(),
+            child: const RadarDetails(),
+          ),
+        );
       default:
         return _errorRoute();
     }

lib/routes/routes.dart

@@ -5,4 +5,5 @@ class Routes {
   static const String profile = '/profile';
   static const String editProfile = '/edit-profile';
   static const String settings = '/settings';
+  static const String radarDetails = '/radar-details';
 }

lib/widgets/didvan/card.dart

@@ -2,15 +2,17 @@ import 'package:didvan/config/design_config.dart';
 import 'package:flutter/material.dart';
 
 class DidvanCard extends StatelessWidget {
-  final Widget child;
+  final Widget? child;
   final EdgeInsets? padding;
   final EdgeInsets? margin;
-  const DidvanCard(
+  final bool enableBorder;
-      {Key? key,
+  const DidvanCard({
-      required this.child,
+    Key? key,
+    this.child,
     this.padding = const EdgeInsets.all(16),
-      this.margin})
+    this.margin,
-      : super(key: key);
+    this.enableBorder = true,
+  }) : super(key: key);
 
   @override
   Widget build(BuildContext context) {
@@ -20,7 +22,7 @@ class DidvanCard extends StatelessWidget {
       decoration: BoxDecoration(
         borderRadius: DesignConfig.lowBorderRadius,
         color: Theme.of(context).colorScheme.surface,
-        border: DesignConfig.cardBorder,
+        border: enableBorder ? DesignConfig.cardBorder : null,
       ),
       child: child,
     );

lib/widgets/didvan/page_view.dart

@@ -0,0 +1,84 @@
+import 'dart:math' as math;
+
+import 'package:carousel_slider/carousel_slider.dart';
+import 'package:didvan/widgets/didvan/card.dart';
+import 'package:didvan/widgets/didvan/text.dart';
+import 'package:didvan/widgets/skeletun_image.dart';
+import 'package:flutter/material.dart';
+
+class DidvanPageView extends StatelessWidget {
+  const DidvanPageView({Key? key}) : super(key: key);
+
+  @override
+  Widget build(BuildContext context) {
+    final double deviceTopPadding = MediaQuery.of(context).padding.top;
+    return CarouselSlider.builder(
+      itemCount: 5,
+      options: CarouselOptions(
+        height: double.infinity,
+        initialPage: 1,
+        viewportFraction: 0.94,
+        enableInfiniteScroll: false,
+      ),
+      itemBuilder: (context, index, realIndex) => Padding(
+        padding: EdgeInsets.only(
+          left: 4,
+          right: 4,
+          top: 16 + deviceTopPadding,
+        ),
+        child: DidvanCard(
+          padding: EdgeInsets.zero,
+          enableBorder: false,
+          child: CustomScrollView(
+            slivers: [
+              const SliverAppBar(
+                automaticallyImplyLeading: false,
+                expandedHeight: 200,
+                flexibleSpace: SkeletonImage(
+                  imageUrl: 'https://wallpapercave.com/wp/wp9373116.jpg',
+                  width: double.infinity,
+                  height: double.infinity,
+                ),
+              ),
+              SliverPadding(
+                padding:
+                    const EdgeInsets.symmetric(vertical: 20, horizontal: 16),
+                sliver: SliverList(
+                  delegate: SliverChildBuilderDelegate(
+                    (_, index) {
+                      switch (index) {
+                        case 0:
+                          return Column(
+                            crossAxisAlignment: CrossAxisAlignment.start,
+                            children: [
+                              DidvanText(
+                                'تحلیل شکاف فناوری صنعت فولاد ایران',
+                                style: Theme.of(context).textTheme.bodyText1,
+                              ),
+                              const SizedBox(height: 8),
+                              const DidvanText(
+                                'پایگاه خبری معدن نیوز - 2 ساعت پیش',
+                              ),
+                              const SizedBox(height: 8),
+                            ],
+                          );
+                        default:
+                          return const Padding(
+                            padding: EdgeInsets.only(bottom: 8),
+                            child: DidvanText(
+                              'این سایت امروز (شنبه) تیم منتخب قاره آسیا در سال ۲۰۲۱ میلادی را معرفی کرد که از ایران، سردار آزمون و محمد حسین کنعانی‌زادگان در ترکیب اصلی و مهدی طارمی و سیدمجید حسینی در جمع بازیکنان ذخیره دیده می‌شوند.',
+                            ),
+                          );
+                      }
+                    },
+                    childCount: 10,
+                  ),
+                ),
+              ),
+            ],
+          ),
+        ),
+      ),
+    );
+  }
+}

pubspec.lock

@@ -36,6 +36,13 @@ packages:
       url: "https://pub.dartlang.org"
     source: hosted
     version: "1.0.1"
+  carousel_slider:
+    dependency: "direct main"
+    description:
+      name: carousel_slider
+      url: "https://pub.dartlang.org"
+    source: hosted
+    version: "4.0.0"
   characters:
     dependency: transitive
     description:

pubspec.yaml

@@ -47,6 +47,7 @@ dependencies:
   flutter_svg: ^1.0.0
   cached_network_image: ^3.2.0
   skeleton_text: ^3.0.0
+  carousel_slider: ^4.0.0
 
 dev_dependencies:
   flutter_test: