Add folder design principles

lib/src/screens/designprinciples/dependency_injection.dart

@@ -0,0 +1,91 @@
+import 'dart:async';
+import 'package:flutter/material.dart';
+import 'package:flutterui/src/core/dependency_injection/price_getter.dart';
+
+class DependencyInjection extends StatelessWidget {
+  const DependencyInjection({super.key});
+
+  @override
+  Widget build(BuildContext context) {
+    final priceGetter = PriceGetter(); // Create the dependency here
+
+    return Scaffold(
+      appBar: AppBar(
+        title: Text('Dependency Injection'),
+      ),
+      body: Center(
+        child: DisplayBtcPrice(priceGetter: priceGetter), // Inject the dependency
+      ),
+      // floatingActionButton: FloatingActionButton(
+      //   onPressed: () {
+      //     // Access the state of DisplayBtcPrice and call _fetchBtcPrice
+      //     final state = context.findAncestorStateOfType<_DisplayBtcPriceState>();
+      //     state?._fetchBtcPrice();
+      //   },
+      //   child: Icon(Icons.refresh),
+      // ),
+    );
+  }
+}
+
+class DisplayBtcPrice extends StatefulWidget {
+  final PriceGetter priceGetter;
+
+  const DisplayBtcPrice({super.key, required this.priceGetter});
+
+  @override
+  _DisplayBtcPriceState createState() => _DisplayBtcPriceState();
+}
+
+class _DisplayBtcPriceState extends State<DisplayBtcPrice> {
+  double? _btcPrice;
+  bool _isLoading = true;
+  Timer? _timer;
+
+  @override
+  void initState() {
+    super.initState();
+    _fetchBtcPrice();
+    _startAutoUpdate();
+  }
+
+  @override
+  void dispose() {
+    _timer?.cancel();
+    super.dispose();
+  }
+
+  void _startAutoUpdate() {
+    _timer = Timer.periodic(Duration(seconds: 10), (timer) {
+      _fetchBtcPrice();
+    });
+  }
+
+  Future<void> _fetchBtcPrice() async {
+    setState(() {
+      _isLoading = true;
+    });
+    try {
+      final price = await widget.priceGetter.getBitcoinPrice();
+      setState(() {
+        _btcPrice = price;
+        _isLoading = false;
+      });
+    } catch (e) {
+      setState(() {
+        _isLoading = false;
+      });
+      // Handle error appropriately here
+    }
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return Center(
+      child: _isLoading
+          ? CircularProgressIndicator()
+          : Text('Bitcoin BTC: \$${_btcPrice?.toStringAsFixed(2) ?? 'Error'}',
+              style: TextStyle(fontSize: 48)),
+    );
+  }
+}

lib/src/screens/designprinciples/designprinciples_page.dart

@@ -0,0 +1,102 @@
+import 'package:flutter/material.dart';
+import 'dependency_injection.dart';
+
+class DesignPrinciplesPage extends StatelessWidget {
+  final List<String> pages = const [
+    'Dependency Injection',
+  ];
+
+  final List<String> subtitles = const [
+    'Dependency Injection is a design pattern that allows objects to receive their dependencies from external sources instead of creating them internally',
+  ];
+
+  final List<Widget> pageWidgets = [
+    DependencyInjection(),
+  ];
+
+  @override
+  Widget build(BuildContext context) {
+    double viewWidth = MediaQuery.of(context).size.width;
+    int crossAxisCount = viewWidth > 1200 ? 4 : viewWidth > 800 ? 4 : 2;
+    double childAspectRatio = viewWidth > 1200 ? 2 : viewWidth > 800 ? 1.5 : 1;
+
+    return Scaffold(
+      body: GridView.builder(
+        padding: const EdgeInsets.all(8.0),
+        gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
+          crossAxisCount: crossAxisCount,
+          childAspectRatio: childAspectRatio,
+        ),
+        itemCount: pages.length,
+        itemBuilder: (context, index) {
+          return HoverCard(
+            title: pages[index],
+            subtitle: subtitles[index],
+            page: pageWidgets[index],
+          );
+        },
+      ),
+    );
+  }
+}
+
+class HoverCard extends StatefulWidget {
+  final String title;
+  final String subtitle;
+  final Widget page;
+
+  const HoverCard({required this.title, required this.subtitle, required this.page});
+
+  @override
+  _HoverCardState createState() => _HoverCardState();
+}
+
+class _HoverCardState extends State<HoverCard> {
+  @override
+  Widget build(BuildContext context) {
+    return LayoutBuilder(
+      builder: (context, constraints) {
+        return Card(
+          clipBehavior: Clip.hardEdge,
+          margin: const EdgeInsets.all(8.0),
+          child: InkWell(
+            onTap: () {
+              Navigator.push(
+                context,
+                MaterialPageRoute(
+                  builder: (context) => widget.page,
+                ),
+              );
+            },
+            // splashColor: Colors.blue.withAlpha(30),
+            child: Padding(
+            padding: const EdgeInsets.all(8.0),
+              child: Column(
+                mainAxisSize: MainAxisSize.min,
+                mainAxisAlignment: MainAxisAlignment.center,
+                crossAxisAlignment: CrossAxisAlignment.start,
+                children: [
+                  const SizedBox(height: 8.0),
+                  Text(
+                    widget.title,
+                    style: TextStyle(
+                      fontWeight: FontWeight.bold,
+                      fontSize: constraints.maxWidth * 0.075,
+                    ),
+                  ),
+                  Text(
+                    widget.subtitle,
+                    style: TextStyle(
+                      // color: Colors.grey,
+                      fontSize: constraints.maxWidth * 0.0325,
+                    ),
+                  ),
+                ],
+              ),
+            ),
+          ),
+        );
+      },
+    );
+  }
+}