Localizing the RichText widget in Flutter
localized_rich_text_plus is a Flutter package that simplifies the process of displaying localized rich text in a Flutter app. The package extends the RichText
widget by providing additional features that allow for easy localization of rich text. The package is available on pub.dev and can be added to your Flutter app's dependencies.
Getting Started
To get started with LocalizedRichText, you’ll need to add it as a dependency to your Flutter project by including it in your pubspec.yaml
file:
Once we have added the package to our dependencies, we can start using it in our Flutter app.
dependencies:
localized_rich_text_plus: ^0.0.2
Once we have added the package to our dependencies, we can start using it in our Flutter app.
Examples of How To Use the package
- default parameter — You pass your full text here
- originalText — specific word or phrase will be changed
- localizedText — specific word or phrase will be localized to
- style — Custom TextStyle if necessary to add
Here is an example:
import 'package:flutter/material.dart';
import 'package:localized_rich_text_plus/localized_rich_text_plus.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
// This widget is the root of your application.
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo app',
theme: ThemeData(
primarySwatch: Colors.blue,
visualDensity: VisualDensity.adaptivePlatformDensity,
),
home: Scaffold(
appBar: AppBar(
title: const Text("Demo App"),
),
body: Center(
child: LocalizedRichText(
const Text(
'I have read paymentRulesText and paymentContractText, I agree.',
style: TextStyle(
fontSize: 18,
),
),
richTexts: [
LocalRichText(
originalText: 'paymentRulesText',
localizedText: 'the user agreement, the rules of the site',
style: const TextStyle(
fontSize: 20,
fontWeight: FontWeight.w700,
),
onTap: () => {print("clicked")},
),
LocalRichText(
originalText: 'paymentContractText',
localizedText: 'the general offer agreement',
style: const TextStyle(
fontSize: 20,
fontWeight: FontWeight.w700,
),
onTap: () => {print("clicked")},
),
],
),
),
),
);
}
}
Conclusion
localized_rich_text_plus package available on pub.dev provides a useful and efficient solution for developers who need to display localized rich text in their Flutter applications. With its support for multiple languages and easy-to-use syntax, this package allows developers to create dynamic and localized text displays with ease.