gt_appbar 1.1.0

gt_appbar: ^1.1.0 copied to clipboard

example/lib/main.dart

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

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

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'GT AppBar Examples',
      debugShowCheckedModeBanner: false,
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.indigo),
        useMaterial3: true,
      ),
      home: const ExamplesHome(),
    );
  }
}

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

  @override
  Widget build(BuildContext context) {
    final examples = [
      ('Basic AppBar', const BasicExample()),
      ('Curved Bottom', const CurvedExample()),
      ('With Divider', const DividerExample()),
      ('Gradient Background', const GradientExample()),
      ('Custom Title Widget', const CustomTitleExample()),
      ('With TabBar', const TabBarExample()),
      ('Full Customization', const FullCustomExample()),
    ];

    return Scaffold(
      appBar: GTAppBar(
        title: 'GT AppBar Examples',
        centerTitle: true,
        backgroundColor: Theme.of(context).colorScheme.primaryContainer,
        foregroundColor: Theme.of(context).colorScheme.onPrimaryContainer,
      ),
      body: ListView.separated(
        padding: const EdgeInsets.all(16),
        itemCount: examples.length,
        separatorBuilder: (_, __) => const SizedBox(height: 8),
        itemBuilder: (context, index) {
          final (title, page) = examples[index];
          return Card(
            child: ListTile(
              title: Text(title),
              trailing: const Icon(Icons.arrow_forward_ios, size: 16),
              onTap: () => Navigator.push(
                context,
                MaterialPageRoute(builder: (_) => page),
              ),
            ),
          );
        },
      ),
    );
  }
}

// Basic Example
class BasicExample extends StatelessWidget {
  const BasicExample({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: GTAppBar(
        title: 'Basic AppBar',
        leading: IconButton(
          icon: const Icon(Icons.arrow_back),
          onPressed: () => Navigator.pop(context),
        ),
      ),
      body: const Center(
        child: Text('A simple AppBar with default styling'),
      ),
    );
  }
}

// Curved Bottom Example
class CurvedExample extends StatelessWidget {
  const CurvedExample({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: GTAppBar(
        title: 'Curved Bottom',
        bottomCurveness: 24.0,
        backgroundColor: Colors.teal,
        foregroundColor: Colors.white,
        elevation: 4,
        leading: IconButton(
          icon: const Icon(Icons.arrow_back),
          onPressed: () => Navigator.pop(context),
        ),
      ),
      body: const Center(
        child: Padding(
          padding: EdgeInsets.all(24),
          child: Text(
            'The AppBar has a curved bottom edge\nusing bottomCurveness: 24.0',
            textAlign: TextAlign.center,
          ),
        ),
      ),
    );
  }
}

// Divider Example
class DividerExample extends StatelessWidget {
  const DividerExample({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: GTAppBar(
        title: 'With Divider',
        showDivider: true,
        dividerColor: Colors.grey.shade400,
        dividerThickness: 2.0,
        leading: IconButton(
          icon: const Icon(Icons.arrow_back),
          onPressed: () => Navigator.pop(context),
        ),
      ),
      body: const Center(
        child: Text('AppBar with a divider below'),
      ),
    );
  }
}

// Gradient Example
class GradientExample extends StatelessWidget {
  const GradientExample({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: GTAppBar(
        title: 'Gradient Background',
        gradient: const LinearGradient(
          colors: [Colors.purple, Colors.blue, Colors.cyan],
          begin: Alignment.topLeft,
          end: Alignment.bottomRight,
        ),
        foregroundColor: Colors.white,
        bottomCurveness: 16.0,
        centerTitle: true,
        leading: IconButton(
          icon: const Icon(Icons.arrow_back),
          onPressed: () => Navigator.pop(context),
        ),
      ),
      body: const Center(
        child: Text('Beautiful gradient AppBar!'),
      ),
    );
  }
}

// Custom Title Widget Example
class CustomTitleExample extends StatelessWidget {
  const CustomTitleExample({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: GTAppBar(
        titleWidget: Row(
          mainAxisSize: MainAxisSize.min,
          children: [
            Container(
              padding: const EdgeInsets.all(6),
              decoration: BoxDecoration(
                color: Colors.amber,
                borderRadius: BorderRadius.circular(8),
              ),
              child: const Icon(Icons.star, color: Colors.white, size: 20),
            ),
            const SizedBox(width: 12),
            const Text(
              'Custom Title',
              style: TextStyle(fontWeight: FontWeight.bold),
            ),
          ],
        ),
        centerTitle: true,
        leading: IconButton(
          icon: const Icon(Icons.arrow_back),
          onPressed: () => Navigator.pop(context),
        ),
      ),
      body: const Center(
        child: Text('Using titleWidget for custom title layouts'),
      ),
    );
  }
}

// TabBar Example
class TabBarExample extends StatefulWidget {
  const TabBarExample({super.key});

  @override
  State<TabBarExample> createState() => _TabBarExampleState();
}

class _TabBarExampleState extends State<TabBarExample>
    with SingleTickerProviderStateMixin {
  late TabController _tabController;

  @override
  void initState() {
    super.initState();
    _tabController = TabController(length: 3, vsync: this);
  }

  @override
  void dispose() {
    _tabController.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: GTAppBar(
        title: 'With TabBar',
        backgroundColor: Colors.indigo,
        foregroundColor: Colors.white,
        leading: IconButton(
          icon: const Icon(Icons.arrow_back),
          onPressed: () => Navigator.pop(context),
        ),
        bottom: TabBar(
          controller: _tabController,
          labelColor: Colors.white,
          unselectedLabelColor: Colors.white70,
          indicatorColor: Colors.white,
          tabs: const [
            Tab(icon: Icon(Icons.home), text: 'Home'),
            Tab(icon: Icon(Icons.person), text: 'Profile'),
            Tab(icon: Icon(Icons.settings), text: 'Settings'),
          ],
        ),
      ),
      body: TabBarView(
        controller: _tabController,
        children: const [
          Center(child: Text('Home Tab')),
          Center(child: Text('Profile Tab')),
          Center(child: Text('Settings Tab')),
        ],
      ),
    );
  }
}

// Full Customization Example
class FullCustomExample extends StatelessWidget {
  const FullCustomExample({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: GTAppBar(
        title: 'Fully Customized',
        titleTextStyle: const TextStyle(
          fontSize: 22,
          fontWeight: FontWeight.bold,
          letterSpacing: 1.2,
        ),
        gradient: const LinearGradient(
          colors: [Color(0xFF6366F1), Color(0xFF8B5CF6)],
        ),
        foregroundColor: Colors.white,
        bottomCurveness: 20.0,
        showDivider: true,
        dividerColor: Colors.white24,
        dividerThickness: 2,
        centerTitle: true,
        elevation: 8,
        shadowColor: Colors.black45,
        leading: IconButton(
          icon: const Icon(Icons.arrow_back),
          onPressed: () => Navigator.pop(context),
        ),
        actions: [
          IconButton(
            icon: const Icon(Icons.search),
            onPressed: () {},
          ),
          IconButton(
            icon: const Icon(Icons.notifications),
            onPressed: () {},
          ),
          IconButton(
            icon: const Icon(Icons.more_vert),
            onPressed: () {},
          ),
        ],
      ),
      body: Padding(
        padding: const EdgeInsets.all(24),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Text(
              'Features Used:',
              style: Theme.of(context).textTheme.titleLarge,
            ),
            const SizedBox(height: 16),
            const _FeatureItem('✅ Custom gradient background'),
            const _FeatureItem('✅ Curved bottom edge (20px)'),
            const _FeatureItem('✅ Divider with custom color'),
            const _FeatureItem('✅ Custom title text style'),
            const _FeatureItem('✅ Centered title'),
            const _FeatureItem('✅ Elevation with shadow'),
            const _FeatureItem('✅ Multiple action buttons'),
          ],
        ),
      ),
    );
  }
}

class _FeatureItem extends StatelessWidget {
  final String text;
  const _FeatureItem(this.text);

  @override
  Widget build(BuildContext context) {
    return Padding(
      padding: const EdgeInsets.symmetric(vertical: 4),
      child: Text(text, style: const TextStyle(fontSize: 16)),
    );
  }
}