You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
205 lines
8.9 KiB
Dart
205 lines
8.9 KiB
Dart
|
1 month ago
|
import 'package:flutter/material.dart';
|
||
|
|
import 'package:flutter/services.dart';
|
||
|
|
import 'package:google_fonts/google_fonts.dart';
|
||
|
|
import 'app_colors.dart';
|
||
|
|
import 'app_dimensions.dart';
|
||
|
|
|
||
|
|
/// Created by Waqas Khurshid on 12/09/2023.
|
||
|
|
class AppThemeData {
|
||
|
|
// input field
|
||
|
|
static const inputLabelColor = AppColors.colorGrey700;
|
||
|
|
static const inputTextColor = AppColors.colorGrey700;
|
||
|
|
static const inputBackgroundColor = AppColors.colorGrey700;
|
||
|
|
static const inputHintColor = AppColors.colorGrey500;
|
||
|
|
static const inputBorderColor = AppColors.colorGrey500;
|
||
|
|
static const inputFocusedBorderColor = AppColors.colorGrey500;
|
||
|
|
static const inputDisabledBorderColor = AppColors.colorGrey300;
|
||
|
|
static const inputEnabledBorderColor = AppColors.colorGrey500;
|
||
|
|
static const inputErrorBackgroundColor = AppColors.transparent;
|
||
|
|
static const inputErrorBorderColor = AppColors.red;
|
||
|
|
static const inputErrorColor = AppColors.red;
|
||
|
|
|
||
|
|
static BorderRadius borderRadius = const BorderRadius.all(Radius.circular(50.0));
|
||
|
|
static const TextStyle labelStyle = TextStyle(fontSize: 14, fontWeight: FontWeight.w400, color: inputLabelColor);
|
||
|
|
static const TextStyle inputStyle = TextStyle(fontSize: 12, fontWeight: FontWeight.w400, color: inputTextColor);
|
||
|
|
static const TextStyle hintStyle = TextStyle(fontSize: 12, fontWeight: FontWeight.w400, color: inputHintColor);
|
||
|
|
static TextStyle errorStyle = const TextStyle(fontSize: 10, fontWeight: FontWeight.w400, color: inputErrorColor);
|
||
|
|
|
||
|
|
// *************** button ******************
|
||
|
|
static double buttonRadius = 50;
|
||
|
|
static double buttonHorizontlePadding = 10;
|
||
|
|
static double buttonVerticalPadding = 10;
|
||
|
|
static const Color buttonBackgroundColor = AppColors.colorButton;
|
||
|
|
static final OutlinedBorder buttonBorder = RoundedRectangleBorder(borderRadius: BorderRadius.circular(buttonRadius));
|
||
|
|
static const TextStyle buttonTextStyle = TextStyle(fontSize: 12, fontWeight: FontWeight.w400, color: AppColors.white);
|
||
|
|
|
||
|
|
// *************** App Bar ******************
|
||
|
|
static const TextStyle appBarTextStyle = TextStyle(fontWeight: FontWeight.w600, fontSize: 14, color: AppColors.white);
|
||
|
|
|
||
|
|
// *************** CustomText ******************
|
||
|
|
static const textFieldsColor = AppColors.colorGrey700;
|
||
|
|
static final TextStyle textFieldStyle = TextStyle(fontWeight: FontWeight.w600, fontSize: AppDimensions.customTextSize, color: textFieldsColor);
|
||
|
|
}
|
||
|
|
|
||
|
|
ThemeData appTheme() {
|
||
|
|
return ThemeData(
|
||
|
|
useMaterial3: false,
|
||
|
|
fontFamily: 'Roboto',
|
||
|
|
|
||
|
|
/// AppBar Theme
|
||
|
|
appBarTheme: AppBarTheme(
|
||
|
|
//color: AppColors.appBar,
|
||
|
|
centerTitle: true,
|
||
|
|
backgroundColor: AppColors.colorPrimary,
|
||
|
|
elevation: AppDimensions.elevation,
|
||
|
|
systemOverlayStyle: const SystemUiOverlayStyle(
|
||
|
|
statusBarColor: AppColors.colorPrimary,
|
||
|
|
),
|
||
|
|
titleTextStyle: const TextStyle(fontWeight: FontWeight.w700, fontSize: 14, color: AppColors.colorTitle),
|
||
|
|
iconTheme: const IconThemeData(color: AppColors.colorSecondary),
|
||
|
|
),
|
||
|
|
|
||
|
|
/// Floating Action Button Design
|
||
|
|
floatingActionButtonTheme: const FloatingActionButtonThemeData(backgroundColor: Colors.transparent),
|
||
|
|
|
||
|
|
/// Titles And Text Theme
|
||
|
|
textTheme: const TextTheme(
|
||
|
|
///Display Large Style
|
||
|
|
displayLarge: TextStyle(fontSize: 23, fontWeight: FontWeight.w500, color: AppColors.colorTitle),
|
||
|
|
displayMedium: TextStyle(fontSize: 20, fontWeight: FontWeight.w600, color: AppColors.colorTitle),
|
||
|
|
displaySmall: TextStyle(fontSize: 15, fontWeight: FontWeight.w500, color: AppColors.colorText),
|
||
|
|
|
||
|
|
/// Display Titles Style
|
||
|
|
titleLarge: TextStyle(fontSize: 20, fontWeight: FontWeight.w600, color: AppColors.colorTitle),
|
||
|
|
titleMedium: TextStyle(fontSize: 16, fontWeight: FontWeight.w600, color: AppColors.colorTitle),
|
||
|
|
titleSmall: TextStyle(fontSize: 14, fontWeight: FontWeight.w500, color: AppColors.colorTitle),
|
||
|
|
|
||
|
|
/// Display Body Style
|
||
|
|
bodyLarge: TextStyle(fontSize: 16, fontWeight: FontWeight.w400, color: AppColors.colorTitle),
|
||
|
|
bodyMedium: TextStyle(fontSize: 14, fontWeight: FontWeight.w400, color: AppColors.colorTitle),
|
||
|
|
bodySmall: TextStyle(fontSize: 12, fontWeight: FontWeight.w400, color: AppColors.colorText),
|
||
|
|
|
||
|
|
/// Display Label Style
|
||
|
|
labelLarge: TextStyle(fontSize: 15, fontWeight: FontWeight.w600, color: AppColors.colorTitle),
|
||
|
|
labelMedium: TextStyle(fontSize: 12, fontWeight: FontWeight.w500, color: AppColors.colorText),
|
||
|
|
labelSmall: TextStyle(fontSize: 10, fontWeight: FontWeight.w400, color: AppColors.colorTitle),
|
||
|
|
),
|
||
|
|
|
||
|
|
/// Dialog Theme
|
||
|
|
dialogTheme: const DialogThemeData(shape: RoundedRectangleBorder(borderRadius: BorderRadius.all(Radius.circular(10))), elevation: 5.0, backgroundColor: AppColors.colorSecondary),
|
||
|
|
|
||
|
|
/// Card Theme
|
||
|
|
cardTheme: CardThemeData(
|
||
|
|
color: AppColors.colorGrey50,
|
||
|
|
shape: RoundedRectangleBorder(
|
||
|
|
borderRadius: BorderRadius.circular(AppDimensions.radiusCard),
|
||
|
|
),
|
||
|
|
elevation: AppDimensions.elevation,
|
||
|
|
),
|
||
|
|
|
||
|
|
/// Input Decoration Theme
|
||
|
|
inputDecorationTheme: InputDecorationTheme(
|
||
|
|
isDense: true,
|
||
|
|
// Reduces the overall height of the TextFormField
|
||
|
|
errorMaxLines: 1,
|
||
|
|
// Limits the error message to one line
|
||
|
|
contentPadding: const EdgeInsets.symmetric(horizontal: 10, vertical: 10),
|
||
|
|
border: const OutlineInputBorder(
|
||
|
|
borderSide: BorderSide(color: AppColors.transparent),
|
||
|
|
),
|
||
|
|
errorStyle: GoogleFonts.inter(
|
||
|
|
textStyle: const TextStyle(fontSize: 10, fontWeight: FontWeight.w400, color: AppColors.colorPrimary),
|
||
|
|
),
|
||
|
|
disabledBorder: const OutlineInputBorder(
|
||
|
|
borderSide: BorderSide(
|
||
|
|
color: AppColors.transparent,
|
||
|
|
)),
|
||
|
|
enabledBorder: const OutlineInputBorder(
|
||
|
|
borderSide: BorderSide(
|
||
|
|
color: AppColors.transparent,
|
||
|
|
)),
|
||
|
|
focusedBorder: const OutlineInputBorder(
|
||
|
|
borderSide: BorderSide(
|
||
|
|
color: AppColors.transparent,
|
||
|
|
)),
|
||
|
|
errorBorder: const OutlineInputBorder(
|
||
|
|
borderSide: BorderSide(
|
||
|
|
color: AppColors.transparent,
|
||
|
|
)),
|
||
|
|
labelStyle: GoogleFonts.inter(
|
||
|
|
textStyle: const TextStyle(
|
||
|
|
fontSize: 12,
|
||
|
|
fontWeight: FontWeight.w400,
|
||
|
|
color: AppColors.colorText,
|
||
|
|
),
|
||
|
|
),
|
||
|
|
hintStyle: GoogleFonts.inter(
|
||
|
|
textStyle: const TextStyle(
|
||
|
|
fontSize: 12,
|
||
|
|
fontWeight: FontWeight.w400,
|
||
|
|
color: AppColors.colorText,
|
||
|
|
),
|
||
|
|
),
|
||
|
|
iconColor: AppColors.colorButton),
|
||
|
|
|
||
|
|
/// Divider Theme
|
||
|
|
dividerTheme: const DividerThemeData(
|
||
|
|
color: Colors.transparent,
|
||
|
|
),
|
||
|
|
|
||
|
|
/// Elevated Button Theme
|
||
|
|
elevatedButtonTheme: ElevatedButtonThemeData(
|
||
|
|
style: ButtonStyle(
|
||
|
|
minimumSize: MaterialStateProperty.all<Size>(Size(AppDimensions.screenVerticalPadding, AppDimensions.screenVerticalPadding)),
|
||
|
|
backgroundColor: MaterialStateProperty.resolveWith<Color>(
|
||
|
|
(Set<MaterialState> states) {
|
||
|
|
if (states.contains(MaterialState.pressed)) {
|
||
|
|
return Colors.white54;
|
||
|
|
} else if (states.contains(MaterialState.disabled)) {
|
||
|
|
return Colors.white70;
|
||
|
|
}
|
||
|
|
return Colors.white70;
|
||
|
|
},
|
||
|
|
),
|
||
|
|
shape: MaterialStateProperty.all(
|
||
|
|
RoundedRectangleBorder(
|
||
|
|
borderRadius: BorderRadius.circular(AppDimensions.radiusCard),
|
||
|
|
//side: BorderSide(color: borderColor ?? Colors.transparent),
|
||
|
|
),
|
||
|
|
),
|
||
|
|
),
|
||
|
|
),
|
||
|
|
|
||
|
|
/// CheckBox Theme
|
||
|
|
checkboxTheme: CheckboxThemeData(
|
||
|
|
checkColor: MaterialStateProperty.all<Color>(AppColors.colorButton),
|
||
|
|
fillColor: MaterialStateProperty.all<Color>(AppColors.colorButton),
|
||
|
|
//splashRadius: 10,
|
||
|
|
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(AppDimensions.radiusCard)),
|
||
|
|
visualDensity: VisualDensity.compact,
|
||
|
|
side: BorderSide(
|
||
|
|
color: AppColors.colorButton,
|
||
|
|
width: AppDimensions.radiusCard,
|
||
|
|
style: BorderStyle.solid,
|
||
|
|
// strokeAlign: StrokeAlign.center)
|
||
|
|
),
|
||
|
|
),
|
||
|
|
dropdownMenuTheme: const DropdownMenuThemeData(inputDecorationTheme: InputDecorationTheme()));
|
||
|
|
}
|
||
|
|
|
||
|
|
/// check is TabletDevice or Mobile
|
||
|
|
/// if Device is Tablet Resolution then this occur otherwise mobile Resolution occur
|
||
|
|
bool isTabletDevice(BuildContext context) {
|
||
|
|
double screenWidth = MediaQuery.of(context).size.width;
|
||
|
|
double screenHeight = MediaQuery.of(context).size.height;
|
||
|
|
|
||
|
|
/// Define a threshold size to consider as a tablet
|
||
|
|
double tabletThreshold = 600.0;
|
||
|
|
|
||
|
|
return screenWidth > tabletThreshold && screenHeight > tabletThreshold;
|
||
|
|
}
|
||
|
|
|
||
|
|
// dynamic isDarkMode() async {
|
||
|
|
// return await AppStorage.getBoolean(AppConstants.IS_DARK_MODE, fallback: false);
|
||
|
|
// }
|