mobikul_custom_app_bar 0.0.2

mobikul_custom_app_bar: ^0.0.2 copied to clipboard

Mobikul Custom AppBar Flutter Package #

MobikulCustomAppBar is a highly customizable Flutter widget for creating app bars with dynamic features and styles. It supports custom titles, actions, background colors, and integrates seamlessly with your app's theme.

To find out more, visit: https://mobikul.com/

Features #

The MobikulCustomAppBar package provides a highly customizable AppBar widget for Flutter applications. Key features include:

• Dynamic Heading and Style Customizable title with adjustable text styles.
• App Logo Support Toggle to show/hide logo, supports dark mode, adjustable size, and placeholder.
• Leading Button Options Back/clear button with custom actions and automatic navigation handling.
• AppBar Appearance Customizable background color and elevation.
• Action Widgets Add buttons for extended functionality.
• Home Navigation Support Optional logo-based home navigation.
• Build Context Flexibility Takes BuildContext as a parameter, ensuring seamless integration with the Flutter widget tree.
• Optimized Visibility Logic Auto-manages logo visibility.
• Developer-Friendly Defaults Predefined logo size and background color for quick setup.

Installation #

To add MobikulCustomAppBar to your project, include the following in your pubspec.yaml file:

dependencies:
   mobikul_custom_app_bar: ^0.0.2  # Replace with the latest version

Then, fetch the package using the command:

flutter pub get

Usage #

Here’s how to use the MobikulCustomAppBar in your Flutter app: #

Import the Package #

import 'package:mobikul_custom_app_bar/mobikul_custom_app_bar.dart';

Basic CustomAppBar Example #

  Scaffold(
      appBar: MobikulCustomAppBar(
        "Mobikul Custom App Bar",
          context,
         Theme.of(context).textTheme.bodyLarge,
        isHomeEnable: true,
        isElevated:false,
        isAppLogoForDarkmode: true,
        appBarBackgroundColor: Colors.green,
        appLogoUrl: "https://example.com/image1.png",
        logoHeight: 40,
        logoWidth: 40,
        actions: [
          IconButton(onPressed: (){
            Navigator.push(
              context,
              MaterialPageRoute(builder: (context) => SearchScreen()),
            );
            print("Search Screen");
          }, icon:  Icon(Icons.search),),

          IconButton(onPressed: (){
            Navigator.push(
              context,
              MaterialPageRoute(builder: (context) => SettingScreen()),
            );
            print("Settings Screen");
          }, icon:  Icon(Icons.settings),),

        ],
        showAppLogo: true,
      )
  );

Properties #

Output #

Here’s an example of the MobikulCustomAppBar in action: