custom_theme_style

Description:

custom theme style

custom_theme_style #
A new Flutter package that helps developers create custom themes and override methods. This package enables you to define and use custom themes, supporting both light and dark modes, and provides a way to customize the appearance of your widgets.
This package enables you to define and use custom themes, supporting both light and dark modes,
and provides a way to customize the appearance of your widgets.
Features #

Define custom themes for various components
Support for both light and dark modes
Easily share themes across projects
Customize widget appearance dynamically

Getting Started #
To use this plugin, follow these steps:
1. Add Dependency #
Add custom_theme_style as a dependency in your pubspec.yaml file:
dependencies:
custom_theme_style: ^0.0.1
copied to clipboard
2.Define Custom Themes #
MaterialApp(
title: 'Flutter Demo',
theme: CustomThemeData.lightThemeData(
isTablet: DeviceUtils.isTablet(context),
),
darkTheme: CustomThemeData.darkThemeData(
isTablet: DeviceUtils.isTablet(context),
),
themeMode: ThemeMode.system,
home: const MyHomePage(),
);
copied to clipboard
3. Access Custom Theme #
For easy access to this theme, define a static of(BuildContext) method:
class CustomThemeData {
static ThemeData lightThemeData({required bool isTablet}) {
// Define light theme
}

static ThemeData darkThemeData({required bool isTablet}) {
// Define dark theme
}
}

extension CustomTheme on BuildContext {
CustomThemeData get customTheme => CustomThemeData.of(this);
}
copied to clipboard
4. Use Custom Theme in Widgets #
Now you can use the custom theme in your widgets:
Text(
'Display Medium Text',
style: GoogleFonts.robotoSlab(
fontSize: Theme.of(context).textTheme.displayMedium?.fontSize,
color: isColor ? Colors.pink : Theme.of(context).textTheme.displayMedium?.color,
),
);
copied to clipboard
Applying Custom Styles #
If you need to change the theme color dynamically, use the CustomTextStyle.applyCustomStyle() method:
Text(
'Display Small Text',
style: CustomTextStyle.applyCustomStyle(
Theme.of(context).textTheme.displaySmall,
color: isColor ? Colors.purple : Theme.of(context).textTheme.bodySmall?.color,
),
);
copied to clipboard
When to Use #
Use this package if you share widgets or entire features between projects. For example:
1. Reusable Widgets: #
Create a widget like TextButton that should look different in different projects. #
Instead of creating different widgets with custom appearances in each project, define a custom theme and apply it.
By using custom_theme, you can define your own theme and easily share widgets or features between projects, ensuring consistent styling and reducing redundant code.