Pakete, Repositories und App-Kategorien suchen

Paketdetailsv1.8.0

highlight_text

Mit diesem Paket können Sie Wörter hervorheben und spezifische Stile und Aktionen erstellen.

AndroidiOSWebmacOSWindowsLinux
30-Tage-Downloads
11.000
Likes
133
Pub-Punkte
150

Paket installieren

flutter pub add highlight_text

Paketübersicht

Aus öffentlichen Paketdaten erstellte Orientierung.

Das highlight_text-Paket ermöglicht Entwicklern das Hervorheben bestimmter Wörter innerhalb von Text und die Anwendung benutzerdefinierter Stile sowie interaktiver Aktionen. Es ist ideal für anspruchsvolle Textdarstellungen, bei denen bestimmte Schlüsselwörter visuell hervorgehoben oder funktional genutzt werden müssen, beispielsweise klickbare Begriffe. Das Paket unterstützt mehrere Plattformen wie Android, iOS, Web, macOS, Windows und Linux und ist somit vielseitig für plattformübergreifende Anwendungen geeignet. Durch einfache Integration über Flutter pub add erhöht es die Benutzerengagement durch dynamische Textinteraktionen.

Anwendungsfälle

  • Schlüsselwörter in Artikeln hervorheben
  • Interaktive Textelemente erstellen
  • Verbesserung von Suchergebnisvorschauen
  • Stilisierte Erwähnungen oder Hashtags anzeigen
  • Reichhaltige Text-Editoren erstellen
  • Implementierung klickbarer Wortaktionen

Hauptmerkmale

  • Anpassbare Hervorhebungsstile
  • Unterstützung für Touch-Gesten bei hervorgehobenen Wörtern
  • Plattformübergreifende Kompatibilität
  • Einfache Integration mit Flutter
  • Flexible Textrendering
  • Konfigurierbare Hervorhebungsfarben und Effekte

Geeignet für

  • inhaltsreiche Apps
  • Bildungsanwendungen
  • Interaktive Dokumentation
  • Soziale-Medien-Funktionen
  • Such- und Filter-Schnittstellen
  • Benutzer-Inhalts-Plattformen

Hinweise

  • Leistungseinbußen bei großen Textblöcken
  • Begrenzte integrierte Stiloptionen außer grundlegender Anpassung
  • Erfordert sorgfältige Behandlung verschachtelter Widgets
  • Kann zusätzliche Logik für komplexe Interaktionen erfordern
  • Nicht für Echtzeit-Kooperationsbearbeitung optimiert
  • Am besten geeignet für moderate Textkomplexität

Original-README

Originaler README-Schnappschuss aus dem verknüpften Quell-Repository. Aktuelle Inhalte finden Sie im Repository.

Highlight Text Plugin

A flutter package to highlight words from a text.

Usage

To use this package, add highlight_text as a dependency in your pubspec.yaml file.

Getting Started

With this package you can highlight words and create specific actions for each highlighted word, you can customize the style of each word separately or create a unique style for all of them, you can also customize the style of the rest of the text.

Example

Import the highlight library

import 'package:highlight_text/highlight_text.dart';

You should use the HighlightedWord class to specify the dictionary words in a Map object

Map<String, HighlightedWord> words = {
    "Flutter": HighlightedWord(
        onTap: () {
            print("Flutter");
        },
        textStyle: textStyle,
    ),
    "open-source": HighlightedWord(
        onTap: () {
            print("open-source");
        },
        textStyle: textStyle,
    ),
    "Android": HighlightedWord(
        onTap: () {
            print("Android");
        },
        textStyle: textStyle,
    ),
};

Now you can call the TextHighlight widget

TextHighlight(
    text: text, // You need to pass the string you want the highlights
    words: words, // Your dictionary words
    textStyle: TextStyle( // You can set the general style, like a Text()
        fontSize: 20.0,
        color: Colors.black,
    ),
    textAlign: TextAlign.justify, // You can use any attribute of the RichText widget
),

Package example image

1.1.0 Update

Now you can customize better the words you highlight, just like a Container. It was added decoration and padding fields to HighlightedWord object, so you can do whatever you want to customize it.

HighlightedWord(
    onTap: () {},
    textStyle: textStyle,
    decoration: BoxDecoration(
        color: Colors.green,
        borderRadius: BorderRadius.circular(50),
    ),
    padding: EdgeInsets.all(8.0),
),

1.2.0 Breaking changes

enableCaseSensitive renamed to matchCase to be clearer about what it does

TextHighlight(
    text: text,
    words: words,
    matchCase: true // will highlight only exactly the same string
),

Kategorien

Quell-Repository

Projekte, die dieses Paket verwenden