How to customize localization in Flutter DataTable (SfDataGrid)?.
In this article, we will show you how to customize localization in Flutter DataTable.
Initialize the SfDataGrid widget with all the necessary properties. To add a custom culture beyond the 74 supported languages, extend the appropriate language class and override the required properties.
Step 1:
Create a dart file in your application and import the required packages.
import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
import 'package:syncfusion_flutter_core/localizations.dart';
import 'package:syncfusion_localizations/syncfusion_localizations.dart';
Step 2:
This has been depicted in the following example for the Estonian(et) language. Create a class for Estonian that extends the respective localization class (e.g., SfLocalizationsEt).
Base class format - SfLocalizations + Locale name.
/// The translations for (`et`).
class CustomLocalizationsEt extends SfLocalizationsEt {
CustomLocalizationsEt();
@override
String get cancelDataGridFilteringLabel => 'tühistada';
}
class SfLocalizationsEtDelegate extends LocalizationsDelegate<SfLocalizations> {
static LocalizationsDelegate<SfLocalizations> delegate =
SfLocalizationsEtDelegate();
@override
bool isSupported(Locale locale) => locale.languageCode == 'et';
@override
Future<SfLocalizations> load(Locale locale) {
return SynchronousFuture<SfLocalizations>(CustomLocalizationsEt());
}
@override
bool shouldReload(LocalizationsDelegate<SfLocalizations> old) => false;
}
Step 3:
Import the created dart file in your application and specify the localizationsDelegates, supportedLocales and locale. Then run your application.
@override
Widget build(BuildContext context) {
return MaterialApp(
localizationsDelegates: [
GlobalMaterialLocalizations.delegate,
GlobalWidgetsLocalizations.delegate,
GlobalCupertinoLocalizations.delegate,
SfLocalizationsEtDelegate.delegate,
],
supportedLocales: const [
Locale('en'),
Locale('et'),
],
locale: const Locale('et'),
title: 'Syncfusion DataGrid Demo',
theme: ThemeData(useMaterial3: false),
home: const MyHomePage(),
);
}
You can download this example on GitHub.