verblaze_flutter 1.1.3
verblaze_flutter: ^1.1.3 copied to clipboard
Flutter SDK for Verblaze Translation Management System
Verblaze Flutter #
Verblaze Flutter is a lightweight and effective multilingual (i18n) solution for Flutter applications. It provides a simple yet powerful way to manage translations with built-in caching support and automatic language switching capabilities.
Features #
- 🚀 Simple and easy-to-use API
- 💾 Built-in cache support
- ⚡ High-performance translation processing
- 🔄 Dynamic language switching
- 📱 Optimized for Flutter applications
- 🔍 Type-safe translation keys
- 🌐 Automatic language detection
- 📦 Minimal setup required
Installation #
Add this dependency to your pubspec.yaml file:
dependencies:
verblaze_flutter: ^1.1.3
provider: ^6.1.2
Setup #
1. Initialize Verblaze #
First, initialize Verblaze with your API key in your app's startup:
void main() async {
WidgetsFlutterBinding.ensureInitialized();
await Verblaze.configure('YOUR-API-KEY');
runApp(const MyApp());
}
2. Setup Provider #
Wrap your app with MultiProvider to enable language state management:
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MultiProvider(
providers: [
ChangeNotifierProvider(create: (_) => VerblazeProvider()),
],
child: MaterialApp(
home: HomeScreen(),
),
);
}
}
Usage #
1. Basic Translation #
Use the .vbt extension on your translation keys:
// In any widget
Text('home_view.welcome_message'.vbt)
2. Language-Specific Translation #
To get a translation for a specific language:
Text('home_view.welcome_message'.vbtWithLang('en-US'))
3. Auto-Translated Widgets #
Create widgets that automatically update when language changes:
class WelcomeScreen extends AutoTranslatedWidget {
const WelcomeScreen({super.key});
@override
Widget buildView(BuildContext context, VerblazeProvider provider) {
return Column(
children: [
Text('welcome.title'.vbt),
Text('welcome.description'.vbt),
],
);
}
}
For stateful widgets:
class MyStatefulWidget extends AutoTranslatedStatefulWidget {
const MyStatefulWidget({super.key});
@override
MyStatefulWidgetState createState() => MyStatefulWidgetState();
}
class MyStatefulWidgetState extends AutoTranslatedState<MyStatefulWidget> {
@override
Widget buildView(BuildContext context, VerblazeProvider provider) {
return Column(
children: [
Text('my_widget.title'.vbt),
// ... other widgets
],
);
}
}
4. Translation Key Format #
Translation keys must follow the format: file_key.translation_key
Examples:
'home_view.welcome_message'.vbt
'settings.language_selection'.vbt
'auth.login_button'.vbt
5. Language Management #
// Get current language code
final provider = VerblazeProvider();
String currentLang = provider.currentLanguage;
// Get current language object
Language? langObject = provider.currentLanguageObject;
// Get list of supported languages
List<Language> languages = provider.supportedLanguages;
// Change language
provider.setLanguage('fr-FR');
6. Error Handling #
try {
final text = 'welcome.title'.vbt;
} on VerblazeException catch (e) {
print('Translation error: ${e.message}');
}
Advanced Features #
1. Caching #
Verblaze automatically caches translations and manages version control. The cache is automatically invalidated when:
- A new version of translations is available
- The language is changed
- The app is reinstalled
2. Language Detection #
Verblaze automatically detects and restores the last used language when the app starts.
3. Version Control #
Verblaze maintains version control of translations and automatically updates them when new versions are available from the server.
Example #
Here's a complete example of a screen with language switching:
class SettingsScreen extends AutoTranslatedWidget {
const SettingsScreen({super.key});
@override
Widget buildView(BuildContext context, VerblazeProvider provider) {
return Scaffold(
appBar: AppBar(
title: Text('settings.title'.vbt),
),
body: ListView(
children: [
ListTile(
title: Text('settings.language'.vbt),
subtitle: Text(provider.currentLanguageObject?.generalName ?? ''),
onTap: () => _showLanguageSelector(context),
),
],
),
);
}
void _showLanguageSelector(BuildContext context) {
showModalBottomSheet(
context: context,
builder: (_) => const LanguageSelectorBottomSheet(),
);
}
}
Best Practices #
- Always use the
AutoTranslatedWidgetfor screens that contain translations - Follow the
file_key.translation_keyformat for all translation keys - Handle translation errors appropriately
- Use meaningful file keys that match your screen/component names
- Keep translation keys lowercase and use underscores for spaces
License #
This project is licensed under the MIT License. See the LICENSE file for more information.
Release Notes #
See CHANGELOG.md for changes.