📱 Custom Gradient App Bar

A customizable, beautiful gradient app bar with rounded corners and shadow, designed to replace the default Flutter AppBar. Built with flexibility in mind—control the icons, colors, actions, and more!

✨ Features

✅ Gradient background with customizable colors
✅ Rounded bottom corners and shadow for depth
✅ Custom menu and add icons
✅ SafeArea-aware padding
✅ Implements PreferredSizeWidget so it fits naturally in Scaffold


🚀 Getting Started

1. Add dependency

Add the following to your pubspec.yaml:

dependencies:
  custom_gradient_app_bar: ^0.0.4

2. Example Usage

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

void main() => runApp(const MyApp());

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Gradient AppBar Demo',
      theme: ThemeData(primarySwatch: Colors.orange),
      home: const VideoHomePage(),
    );
  }
}

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

  void _showAddVideoDialog(BuildContext context) {
    showDialog(
      context: context,
      builder: (_) => AlertDialog(
        title: const Text("Add Video"),
        content: const Text("Video upload feature coming soon!"),
        actions: [
          TextButton(
            onPressed: () => Navigator.pop(context),
            child: const Text("OK"),
          ),
        ],
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      drawer: const Drawer(),
      appBar: CustomGradientAppBar(
        title: "Online Videos",
        gradientColors: [Colors.orange, Colors.deepOrangeAccent],
        leadingIcon: const Icon(Icons.menu, color: Colors.white, size: 30),
        trailingIcon: const Icon(Icons.video_call, color: Colors.white),
        onleadingPressed: () {
          //your code
        },
        ontrailingPressed: () {
          //your code
        },
      ),
      body: const Center(
        child: Text(
          "Welcome to the Video App!",
          style: TextStyle(fontSize: 18),
        ),
      ),
    );
  }