Integrating the get_time_ago Package in Flutter: A Comprehensive Guide

Displaying relative time, like "20 seconds ago" or "a minute ago," is essential for modern apps—be it social media feeds, news platforms, or chat apps. With the Dart package get_time_ago, adding this feature to your Flutter app becomes a breeze. This package converts DateTime objects into human-readable "time ago" strings, keeping your users informed and engaged.

In this guide, we'll show you how to integrate the get_time_ago package into your Flutter project to easily display relative timestamps. Let's get started!

Why Choose get_time_ago?

The get_time_ago package simplifies the task of transforming DateTime objects into easy-to-understand time formats. Whether you're developing a social media app, news site, or chat application, this package makes it clear when an event happened, helping users feel more connected to the content.

Version 2.0.0 of the package introduces various enhancements, including support for time units like seconds, minutes, hours, and days. You can even customize locale-specific messages, making it perfect for apps supporting multiple languages.

Key Features:

• Supports multiple languages.
• Automatically formats time units (seconds, minutes, hours, days).
• Customizable messages for different locales.

What's New in Version 2.0.0?

Version 2.0.0 introduces some breaking changes. Most notably:

• New justNow Method: This method handles events that occurred within the last few seconds. If you're upgrading from a previous version and have custom message implementations, you'll need to add this method to avoid compilation issues.

Example of Custom Locale Update

Before Version 2.0.0:

class MyCustomMessages implements Messages {
  @override
  String prefixAgo() => '';
  @override
  String suffixAgo() => 'ago';
  // Other methods...
}

After Version 2.0.0:

class MyCustomMessages implements Messages {
  @override
  String prefixAgo() => '';
  @override
  String suffixAgo() => 'ago';
  @override
  String justNow(int seconds) => 'just now'; // Added for recent events
  // Other methods...
}

Try It Out: Live Demo

Experience the live demo of get_time_ago to see the relative timestamps in action.

Getting Started: Installation

Follow these simple steps to install get_time_ago in your Flutter project:

1. Open your pubspec.yaml file.
2. Add the following dependency:

dependencies:
  get_time_ago: ^2.0.0

1. Run this command in your terminal:

flutter pub get

Using get_time_ago in Your App

Once the package is installed, using it to display relative time is easy. Below is an example of how you can convert a DateTime object into a "time ago" string.

Basic Example

import 'package:get_time_ago/get_time_ago.dart';

void main() {
  var dateTime = DateTime.now().subtract(Duration(minutes: 10));
  print(GetTimeAgo.parse(dateTime)); // Output: "10 minutes ago"
}

Formatting a String as get_time_ago

If you have a timestamp stored as a string, convert it to DateTime before formatting:

import 'package:get_time_ago/get_time_ago.dart';

void main() {
  var timestamp = '2023-09-25 10:30:00';
  var convertedTimestamp = DateTime.parse(timestamp);
  print(GetTimeAgo.parse(convertedTimestamp)); // Output: "a day ago"
}

Customizing Messages and Locales

Want to tweak how the relative time is presented? You can implement the Messages interface to fully customize the output.

Example of Custom Messages

class CustomMessages implements Messages {
  @override
  String prefixAgo() => '';
  @override
  String suffixAgo() => 'ago';
  @override
  String justNow(int seconds) => 'just now';
  @override
  String secsAgo(int seconds) => '$seconds seconds';
  @override
  String minAgo(int minutes) => 'a minute';
  @override
  String minsAgo(int minutes) => '$minutes minutes';
  @override
  String hourAgo(int minutes) => 'an hour';
  @override
  String hoursAgo(int hours) => '$hours hours';
  @override
  String dayAgo(int hours) => 'a day';
  @override
  String daysAgo(int days) => '$days days';
  @override
  String wordSeparator() => ' ';
}

To apply these custom messages globally in your app, use the following method:

GetTimeAgo.setCustomLocaleMessages('en', CustomMessages());

Setting a Default Locale

If your app supports multiple languages, you can set a default locale for the entire app.

void main() {
  GetTimeAgo.setDefaultLocale('fr'); // Sets French as the default locale
}

Multi-Language Support

The get_time_ago package supports several languages, including:

• Arabic
• English
• Spanish
• Persian (Farsi)
• French
• Hindi
• Portuguese (Brazil and Brazil alternate)
• Chinese (Simplified and Traditional)
• Japanese
• Occitan
• Korean
• German
• Indonesian
• Turkish
• Urdu
• Vietnamese
• Romanian

To use a specific locale, pass the locale code to the parse method:

var dateTime = DateTime.now().subtract(Duration(hours: 5));
print(GetTimeAgo.parse(dateTime, locale: 'es')); // Output: "hace 5 horas"

Conclusion

The get_time_ago package is an excellent solution for displaying human-readable relative timestamps in Flutter apps. Its versatility with multiple time units and language support makes it a must-have for creating more engaging user experiences.

Whether you're building a social media app, a news feed, or a chat platform, get_time_ago ensures your users will always have up-to-date information about when an event took place.

Ready to Get Started?

Install the get_time_ago package today and start displaying user-friendly time information in your app. With its easy setup and flexible customization options, you'll be able to enhance your app's time-related functionalities in no time!

Contributing to get_time_ago

Have ideas for improving the package? Want to add support for more languages? Contributions are always welcome! Submit your pull requests on GitHub.

🔗 Get Started Today!

You can find the get_time_ago package on Pub.dev: get_time_ago

🌟 Join the Community!

Contribute, share feedback, and help improve get_time_ago. Let's work together to build better Flutter experiences.

🤝 Connect with Me!

• GitHub
• LinkedIn
• Instagram
• X (formerly Twitter)