adaptive_design_utils 0.0.1

adaptive_design_utils: ^0.0.1 copied to clipboard

example/lib/main.dart

import 'package:flutter/material.dart';
import 'package:flutter_responsive_utils/flutter_responsive_utils.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Adaptive Design Utils Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
        useMaterial3: true,
      ),
      home: const ResponsiveDemo(),
    );
  }
}

class ResponsiveDemo extends StatelessWidget {
  const ResponsiveDemo({super.key});

  @override
  Widget build(BuildContext context) {
    // Initialize the adaptive utilities
    AdaptiveDesignUtils.initialize(context);

    return Scaffold(
      appBar: AppBar(
        title: Text(
          'Adaptive Design Utils Demo',
          style: ResponsiveTypography.adaptiveTextStyle(
            Theme.of(context).textTheme.titleLarge!,
            fontSize: 24,
          ),
        ),
      ),
      body: ResponsiveLayout(
        mobile: _buildMobileLayout(context),
        tablet: _buildTabletLayout(context),
        desktop: _buildDesktopLayout(context),
      ),
    );
  }

  Widget _buildMobileLayout(BuildContext context) {
    return ResponsivePadding(
      mobilePadding: EdgeInsets.all(ScreenUtils.adaptiveWidth(16)),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Text(
            'Mobile Layout',
            style: ResponsiveTypography.adaptiveTextStyle(
              Theme.of(context).textTheme.headlineMedium!,
              fontSize: 28,
            ),
          ),
          SizedBox(height: ScreenUtils.adaptiveHeight(16)),
          _buildFeatureCard(context),
          _buildResponsiveInfo(context),
        ],
      ),
    );
  }

  Widget _buildTabletLayout(BuildContext context) {
    return ResponsivePadding(
      mobilePadding: EdgeInsets.all(ScreenUtils.adaptiveWidth(16)),
      tabletPadding: EdgeInsets.all(ScreenUtils.adaptiveWidth(24)),
      child: Row(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Expanded(
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Text(
                  'Tablet Layout',
                  style: ResponsiveTypography.adaptiveTextStyle(
                    Theme.of(context).textTheme.headlineMedium!,
                    fontSize: 32,
                  ),
                ),
                SizedBox(height: ScreenUtils.adaptiveHeight(16)),
                _buildFeatureCard(context),
              ],
            ),
          ),
          SizedBox(width: ScreenUtils.adaptiveWidth(24)),
          Expanded(child: _buildResponsiveInfo(context)),
        ],
      ),
    );
  }

  Widget _buildDesktopLayout(BuildContext context) {
    return ResponsivePadding(
      mobilePadding: EdgeInsets.all(ScreenUtils.adaptiveWidth(16)),
      tabletPadding: EdgeInsets.all(ScreenUtils.adaptiveWidth(24)),
      desktopPadding: EdgeInsets.all(ScreenUtils.adaptiveWidth(32)),
      child: Row(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Expanded(
            flex: 2,
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Text(
                  'Desktop Layout',
                  style: ResponsiveTypography.adaptiveTextStyle(
                    Theme.of(context).textTheme.headlineMedium!,
                    fontSize: 36,
                  ),
                ),
                SizedBox(height: ScreenUtils.adaptiveHeight(24)),
                _buildFeatureCard(context),
              ],
            ),
          ),
          SizedBox(width: ScreenUtils.adaptiveWidth(32)),
          Expanded(child: _buildResponsiveInfo(context)),
        ],
      ),
    );
  }

  Widget _buildFeatureCard(BuildContext context) {
    return Card(
      child: ResponsivePadding(
        mobilePadding: EdgeInsets.all(ScreenUtils.adaptiveWidth(16)),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Text(
              'Features',
              style: ResponsiveTypography.adaptiveTextStyle(
                Theme.of(context).textTheme.titleLarge!,
                fontSize: 20,
              ),
            ),
            SizedBox(height: ScreenUtils.adaptiveHeight(8)),
            _buildFeatureItem(context, '✓ Adaptive Layout System'),
            _buildFeatureItem(context, '✓ Adaptive Typography'),
            _buildFeatureItem(context, '✓ Screen Utils'),
            _buildFeatureItem(context, '✓ Breakpoint Management'),
          ],
        ),
      ),
    );
  }

  Widget _buildFeatureItem(BuildContext context, String text) {
    return Padding(
      padding: EdgeInsets.symmetric(vertical: ScreenUtils.adaptiveHeight(4)),
      child: Text(
        text,
        style: ResponsiveTypography.adaptiveTextStyle(
          Theme.of(context).textTheme.bodyLarge!,
          fontSize: 16,
        ),
      ),
    );
  }

  Widget _buildResponsiveInfo(BuildContext context) {
    return Card(
      child: ResponsivePadding(
        mobilePadding: EdgeInsets.all(ScreenUtils.adaptiveWidth(16)),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Text(
              'Screen Information',
              style: ResponsiveTypography.adaptiveTextStyle(
                Theme.of(context).textTheme.titleLarge!,
                fontSize: 20,
              ),
            ),
            SizedBox(height: ScreenUtils.adaptiveHeight(16)),
            _buildInfoItem(context, 'Width', '${ScreenUtils.screenWidth.toStringAsFixed(1)}px'),
            _buildInfoItem(context, 'Height', '${ScreenUtils.screenHeight.toStringAsFixed(1)}px'),
            _buildInfoItem(context, 'Breakpoint', Breakpoints.getBreakpointName(context)),
            _buildInfoItem(context, 'Orientation', ScreenUtils.isLandscape ? 'Landscape' : 'Portrait'),
          ],
        ),
      ),
    );
  }

  Widget _buildInfoItem(BuildContext context, String label, String value) {
    return Padding(
      padding: EdgeInsets.symmetric(vertical: ScreenUtils.adaptiveHeight(4)),
      child: Row(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        children: [
          Text(
            label,
            style: ResponsiveTypography.adaptiveTextStyle(
              Theme.of(context).textTheme.bodyLarge!,
              fontSize: 16,
            ),
          ),
          Text(
            value,
            style: ResponsiveTypography.adaptiveTextStyle(
              Theme.of(context).textTheme.bodyLarge!.copyWith(
                    fontWeight: FontWeight.bold,
                  ),
              fontSize: 16,
            ),
          ),
        ],
      ),
    );
  }
}