misalnya
Admin PanduanFlow
12 May 2026
0
komentar
Flutter Starter Kit Structure And Pubspec
Flutter Starter Kit
============================================================================
Struktur Folder
lib/
├── core/
│ ├── core.dart
│ ├── app_ui.dart
│ ├── constants/
│ │ ├── app_theme.dart
│ │ ├── colors.dart
│ │ ├── text_styles.dart
│ │ └── variables.dart
│ ├── components/
│ │ ├── button.dart
│ │ ├── custom_text_field.dart
│ │ ├── custom_date_picker.dart
│ │ ├── search_input.dart
│ │ ├── notif_dialog.dart
│ │ ├── state_widgets.dart
│ │ └── spaces.dart
│ └── extensions/
│ └── extensions.dart
└── main.dart
pubspec.yaml
============================================================================
name: flutter_starter_kit
# SHARE FILE
share_plus: ^9.0.0
# CAMERA
camera: ^0.11.0+1
# LOCATION
geolocator: ^12.0.0
# MAP
google_maps_flutter: ^2.6.1
# WEBVIEW
webview_flutter: ^4.7.0
# BIOMETRIC
local_auth: ^2.2.0
# UUID
uuid: ^4.4.0
# QR CODE
mobile_scanner: ^5.1.1
qr_flutter: ^4.1.0
# HTML RENDER
flutter_html: ^3.0.0-beta.2
# DROPDOWN
dropdown_button2: ^2.3.9
# ICON
iconsax_flutter: ^1.0.0
# PIN INPUT
pinput: ^5.0.0
# SKELETON LOADING
skeletonizer: ^1.1.2+1
# CHART
fl_chart: ^0.68.0
# AUDIO RECORD
record: ^5.1.2
# PATH PROVIDER
path_provider: ^2.1.3
dev_dependencies:
flutter_test:
sdk: flutter
flutter_lints: ^4.0.0
# JSON SERIALIZATION
build_runner: ^2.4.9
json_serializable: ^6.8.0
flutter:
uses-material-design: true
assets:
- assets/images/
- assets/icons/
- assets/lottie/
- assets/fonts/
- .env
fonts:
- family: Poppins
fonts:
- asset: assets/fonts/Poppins-Regular.ttf
- asset: assets/fonts/Poppins-Medium.ttf
weight: 500
- asset: assets/fonts/Poppins-SemiBold.ttf
weight: 600
- asset: assets/fonts/Poppins-Bold.ttf
weight: 700
============================================================================
core/core.dart
export 'app_ui.dart';
export 'constants/app_theme.dart';
export 'constants/colors.dart';
export 'constants/text_styles.dart';
export 'constants/variables.dart';
export 'components/button.dart';
export 'components/custom_text_field.dart';
export 'components/custom_date_picker.dart';
export 'components/search_input.dart';
export 'components/notif_dialog.dart';
export 'components/state_widgets.dart';
export 'components/spaces.dart';
export 'extensions/extensions.dart';
core/constants/colors.dart
import 'package:flutter/material.dart';
============================================================================
class AppColors {
static const primary = Color(0xff2563EB);
static const secondary = Color(0xff10B981);
static const danger = Color(0xffEF4444);
static const warning = Color(0xffF59E0B);
static const info = Color(0xff3B82F6);
static const white = Colors.white;
static const black = Colors.black;
static const grey = Color(0xff9CA3AF);
static const light = Color(0xffF3F4F6);
static const dark = Color(0xff111827);
static const scaffold = Color(0xffF9FAFB);
static const border = Color(0xffE5E7EB);
}
core/constants/text_styles.dart
import 'package:flutter/material.dart';
import 'package:google_fonts/google_fonts.dart';
============================================================================
class AppTextStyle {
static final h1 = GoogleFonts.poppins(
fontSize: 32,
fontWeight: FontWeight.bold,
);
static final h2 = GoogleFonts.poppins(
fontSize: 24,
fontWeight: FontWeight.w600,
);
static final h3 = GoogleFonts.poppins(
fontSize: 20,
fontWeight: FontWeight.w600,
);
static final body = GoogleFonts.poppins(
fontSize: 14,
);
============================================================================
static final caption = GoogleFonts.poppins(
fontSize: 12,
color: Colors.grey,
);
static final button = GoogleFonts.poppins(
fontSize: 14,
fontWeight: FontWeight.w600,
color: Colors.white,
);
}
core/constants/app_theme.dart
import 'package:flutter/material.dart';
import 'colors.dart';
import 'text_styles.dart';
class AppTheme {
static ThemeData lightTheme = ThemeData(
useMaterial3: true,
scaffoldBackgroundColor: AppColors.scaffold,
primaryColor: AppColors.primary,
appBarTheme: AppBarTheme(
backgroundColor: AppColors.white,
elevation: 0,
centerTitle: true,
titleTextStyle: AppTextStyle.h3,
),
elevatedButtonTheme: ElevatedButtonThemeData(
style: ElevatedButton.styleFrom(
backgroundColor: AppColors.primary,
foregroundColor: AppColors.white,
minimumSize: const Size(double.infinity, 50),
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(12),
),
),
),
============================================================================
inputDecorationTheme: InputDecorationTheme(
filled: true,
fillColor: AppColors.white,
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(12),
borderSide: const BorderSide(color: AppColors.border),
),
enabledBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(12),
borderSide: const BorderSide(color: AppColors.border),
),
),
);
}
core/constants/variables.dart
class Variables {
static const String appName = 'Flutter Starter Kit';
static const String baseUrl = 'https://api.domain.com';
static const String pusherKey = 'PUSHER_KEY';
static const String pusherCluster = 'ap1';
static const String token = 'TOKEN';
static const String user = 'USER';
}
core/components/button.dart
import 'package:flutter/material.dart';
import '../constants/colors.dart';
class Button extends StatelessWidget {
final String label;
final VoidCallback onPressed;
final bool isLoading;
============================================================================
const Button({
super.key,
required this.label,
required this.onPressed,
this.isLoading = false,
});
@override
Widget build(BuildContext context) {
return ElevatedButton(
onPressed: isLoading ? null : onPressed,
child: isLoading
? const SizedBox(
height: 20,
width: 20,
child: CircularProgressIndicator(
color: AppColors.white,
),
)
: Text(label),
);
}
}
core/components/custom_text_field.dart
import 'package:flutter/material.dart';
class CustomTextField extends StatelessWidget {
final TextEditingController controller;
final String label;
final bool obscureText;
final String? Function(String?)? validator;
============================================================================
const CustomTextField({
super.key,
required this.controller,
required this.label,
this.obscureText = false,
this.validator,
});
@override
Widget build(BuildContext context) {
return TextFormField(
controller: controller,
obscureText: obscureText,
validator: validator,
decoration: InputDecoration(
labelText: label,
),
);
}
}
core/components/custom_date_picker.dart
import 'package:flutter/material.dart';
class CustomDatePicker extends StatelessWidget {
final TextEditingController controller;
const CustomDatePicker({
super.key,
required this.controller,
});
============================================================================
@override
Widget build(BuildContext context) {
return TextFormField(
controller: controller,
readOnly: true,
onTap: () async {
final pickedDate = await showDatePicker(
context: context,
firstDate: DateTime(2000),
lastDate: DateTime(2100),
initialDate: DateTime.now(),
);
if (pickedDate != null) {
controller.text = pickedDate.toString();
}
},
decoration: const InputDecoration(
labelText: 'Select Date',
),
);
}
}
core/components/search_input.dart
import 'package:flutter/material.dart';
class SearchInput extends StatelessWidget {
final TextEditingController controller;
final Function(String)? onChanged;
const SearchInput({
super.key,
required this.controller,
this.onChanged,
});
============================================================================
@override
Widget build(BuildContext context) {
return TextField(
controller: controller,
onChanged: onChanged,
decoration: InputDecoration(
hintText: 'Search...',
prefixIcon: const Icon(Icons.search),
suffixIcon: IconButton(
icon: const Icon(Icons.close),
onPressed: () {
controller.clear();
},
),
),
);
}
}
core/components/notif_dialog.dart
import 'package:flutter/material.dart';
class NotifDialog {
static Future<void> showError(
BuildContext context,
String message,
) async {
await showDialog(
context: context,
builder: (_) => AlertDialog(
title: const Text('Error'),
content: Text(message),
),
);
}
}
core/components/state_widgets.dart
============================================================================
Login untuk meninggalkan komentar.
Masuk
Komentar (0)