dictionary_text

A beautiful, customizable Flutter widget that transforms any text into an interactive dictionary. Tap or hold any word to see definitions, pronunciations, and examples in a beautifully animated bottom sheet or dialog.

Features

• Instant Definitions - Tap any word to see its dictionary definition
• Audio Pronunciation - Listen to word pronunciations
• Highly Customizable - Colors, styles, animations, and more
• Responsive Design - Adapts to mobile, tablet, and desktop
• Smooth Animations - iOS-quality spring animations
• Multiple Display Modes - Bottom sheet or dialog
• Flexible Triggers - Tap or long-press gestures
• Tutorial Guide - Built-in onboarding for users
• Cross-Platform - Android, iOS, Web, Windows, macOS, Linux

Installation

Add dictionary_text to your pubspec.yaml:

dependencies:
  dictionary_text: ^0.1.0

Then run:

flutter pub get

Quick Start

import 'package:dictionary_text/dictionary_text.dart';

// Basic usage
DictionaryText(
  text: 'Flutter',
)

// With customization
DictionaryText(
  text: 'beautiful',
  displayMode: DisplayMode.bottomSheet,
  triggerMode: TriggerMode.tap,
  selectedTextColor: Colors.blue,
)

Configuration Options

Display Mode

// Bottom sheet (default)
DictionaryText(
  text: 'word',
  displayMode: DisplayMode.bottomSheet,
)

// Centered dialog
DictionaryText(
  text: 'word',
  displayMode: DisplayMode.dialog,
)

Trigger Mode

// Single tap (default)
DictionaryText(
  text: 'word',
  triggerMode: TriggerMode.tap,
)

// Long press
DictionaryText(
  text: 'word',
  triggerMode: TriggerMode.longPress,
)

Styling

DictionaryText(
  text: 'word',
  backgroundColor: Colors.blue.shade50,
  selectedTextColor: Colors.blue,
  textStyle: TextStyle(fontSize: 18, fontWeight: FontWeight.w500),
  definitionStyle: TextStyle(fontSize: 16, height: 1.5),
)

Custom Loading & Error Widgets

DictionaryText(
  text: 'word',
  loadingBuilder: (context) => MyCustomLoader(),
  errorBuilder: (context, error) => MyCustomError(error),
)

Tutorial Guide

DictionaryText(
  text: 'word',
  needGuide: true,
  guideConfig: TutorialConfig(
    title: 'Dictionary Feature',
    description: 'Tap any word to see its definition!',
  ),
)

API Reference

Property	Type	Default	Description
text	String	required	The text to display
displayMode	DisplayMode	bottomSheet	How to display definitions
triggerMode	TriggerMode	tap	Gesture to trigger lookup
backgroundColor	Color?	null	Background color
selectedTextColor	Color?	null	Color when selected
textStyle	TextStyle?	null	Text style
definitionStyle	TextStyle?	null	Definition text style
needGuide	bool	true	Show tutorial on first use
animationDuration	Duration	300ms	Animation duration
enableHapticFeedback	bool	true	Enable haptic feedback

Platform Support

Platform	Support
Android	✅
iOS	✅
Web	✅
Windows	✅
macOS	✅
Linux	✅

License

This project is licensed under the MIT License - see the LICENSE file for details.

Acknowledgments

Dictionary data provided by Free Dictionary API