Blog / Panduan / misalnya
Panduan

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 ============================================================================

Komentar (0)

Belum ada komentar. Jadilah yang pertama!

Login untuk meninggalkan komentar.

Masuk