Flutter Furigana Text #

A Flutter widget to render Japanese text with Furigana (ruby characters), supporting custom styling, smart line wrapping, and tap events. Ideal for Japanese learning apps, readers, and dictionaries.

✨ Features #

• Smart Wrapping: Automatically wraps text to the next line without breaking a word and its furigana.
• Tap Events: Detects taps on individual words/characters.
• Custom Styling: Easily customize the style for both main text and furigana.
• Highlighting: Built-in support for highlighting specific words.

🚀 Installation #

Add this to your package's pubspec.yaml file:

dependencies:
  flutter_furigana_text: ^0.0.1

Then, run flutter pub get in your terminal.

💻 Usage #

Import the package:

import 'package:flutter_furigana_text/flutter_furigana_text.dart';

Create a list of FuriganaChar and pass it to the FuriganaText widget.

// Data
final sentence = [
  FuriganaChar(text: '私', furigana: 'わたし', meaning: 'I'),
  FuriganaChar(text: 'は'),
  FuriganaChar(text: '日本語', furigana: 'にほんご', meaning: 'Japanese'),
];

// Widget
FuriganaText(
  spans: sentence,
  onSpanTap: (index) {
    setState(() {
      // Handle tap on the word at `index`
      print('Tapped on: ${sentence[index].text}');
    });
  },
)