Skip to main content

Create Custom AppBar Widget in Flutter

 Custom AppBar Widget in Flutter

  • Create Dart File,
import 'package:flutter/material.dart';
import 'package:../styles/colors.dart';
import 'package:../styles/text_style.dart';
import 'package:../widgets/marquee_direction_widget.dart';
import 'package:sizer/sizer.dart';
class AppBarWidget{

// create AppBar Widget here
static AppBar appBarWidget(BuildContext context,{ String? companyName,
String? titleName,
List<Widget>? actions,
Color? backgroundColor,
bool isActions=false,
VoidCallback? onClickBackIcon,
bool isBackIconView=false,
IconThemeData? iconThemeData}) {
return AppBar(
backgroundColor: backgroundColor,
iconTheme: iconThemeData==null?IconThemeData(size: 3.h, color: blackColor):iconThemeData,
leading:isBackIconView? GestureDetector(
onTap:onClickBackIcon,
child: Icon(
Icons.arrow_back_ios,
size: 20,
color: blackColor,
)):Container(),
centerTitle: true,
title: Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
SizedBox(
width: MediaQuery.of(context).size.width*0.7,
child: Center(
child: MarqueeWidget(
direction: Axis.horizontal,
child:companyName.toString().isNotEmpty
? Text(
"${companyName.toString()}",
style:AppTextStyle.subtitleTextStyle(context),
)
: Image.asset(
"assets/images/astlogo.png",
height: 40,
),
),
),
),

companyName.toString().isNotEmpty
? Text(
titleName.toString().isNotEmpty ?"${titleName.toString()}":"",
style:AppTextStyle.subtitleTextStyle1(context),
):Container(),
],
),
actions:isActions!?actions:[],

);
}
}
Thanks...

Comments