FLUTTER ECOSYSTEM

hassan21zaheer/textuality

Textuality は、さまざまなカスタマイズ可能なテキストエフェクトとスタイルでテキストウィジェットの外観を強化する強力なFlutterパッケージです。このパッケージを使用すると、グラデーションテキスト、ストロークテキスト、ネオン効果、影効果、インタラクティブテキストなどを、Flutterアプリに簡単に追加できます。

テキスト性 のプロジェクト画像
Stars
0
Forks
0
最終プッシュ(UTC)
2025/01/03
プロジェクト状態
公開中
Hassan Zaheer GitHub avatar
GITHUB User

Hassan Zaheer ↗

Empowering Startups to Scale with Cutting-Edge Mobile Apps 📈 | Expert Mobile App Developer 📱 | Flutter Specialist 🐦 | Webflow & Figma Designer 🌐

Islamabad, Pakistan公式サイト ↗
言語Dart

このリポジトリが公開するパッケージ

使用している依存関係

依存関係一覧 3 件
  • flutter{"sdk":"flutter"}
  • flutter_test開発用{"sdk":"flutter"}
  • flutter_lints開発用^3.0.0

元の README

以下は英語原文のスナップショットです。最新版は GitHub をご覧ください。

README を開く / 閉じる

Textuality Package

Textuality is a powerful Flutter package that enhances the appearance of text widgets with a variety of customizable text effects and styles. With this package, you can easily add gradient text, stroke text, neon effects, shadow effects, interactive text, and more to your Flutter app.

Textuality

Features

  • GradientText: Add gradient colors to your text.
  • StrokeText: Apply an outline or stroke around your text.
  • NeonText: Create a glowing neon text effect.
  • ChipText: Display text inside stylish chip-like containers.
  • ShadowText: Add customizable shadows to your text.
  • InteractiveText: Make text interactive for clicks, taps, or custom gestures.
  • MultiColorText: Display text in multiple colors, even within the same string.
  • RotatedText: Rotate the text in any direction, including vertical.
  • BlurredText: Add a blurred effect to your text.
  • BorderedBackgroundText: Add a border around the background of your text.

Each widget accepts various optional parameters for customization, such as style, text alignment, maxLines, overflow, and more.

Installation

To use the textuality package in your Flutter project, follow these steps:

  1. Add the package to your pubspec.yaml file:

    dependencies:
      textuality: ^0.0.1
    
    

Run the following command to install the package:

flutter pub get

💻Example

Below is an example of how to use the Textuality package in your Flutter app:

import 'package:flutter/material.dart';
import 'package:textuality/textuality.dart';

class TextualityExample extends StatefulWidget {
  const TextualityExample({super.key});

  @override
  State<TextualityExample> createState() => _TextualityExampleState();
}

class _TextualityExampleState extends State<TextualityExample> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.white,
      appBar: AppBar(
          backgroundColor: Colors.white,
          title: Text(
            'Textuality Package Preview',
            style: TextStyle(color: Colors.black),
          )),
      body: SingleChildScrollView(
        padding: EdgeInsets.all(16.0),
        child: Center(
          child: Column(
            children: [
              // Gradient Text
              GradientText(
                text: 'Gradient Text',
                giveGradient: [Colors.blue, Colors.green],
                style: TextStyle(fontSize: 40, fontWeight: FontWeight.bold),
              ),
              SizedBox(height: 20),

              // Stroke Text
              StrokeText(
                text: 'Stroke Text',
                strokeColor: Colors.red,
                strokeWidth: 8.0,
                style: TextStyle(
                    fontSize: 40,
                    fontWeight: FontWeight.bold,
                    color: Colors.purpleAccent),
              ),
              SizedBox(height: 20),
              // Neon Text
              NeonText(
                text: 'Neon Effect Text',
                glowColor: Colors.cyan,
                blurRadius: 20.0,
                style: TextStyle(
                    fontSize: 40,
                    fontWeight: FontWeight.bold,
                    color: Colors.blue),
              ),
              SizedBox(height: 20),
              // Text Chips
              ChipText(
                text: 'Text Chip',
                chipColor: Colors.blueAccent,
                style: TextStyle(fontSize: 20, color: Colors.white),
              ),
              SizedBox(height: 20),

              // Shadow Text
              ShadowText(
                  text: 'Shadow Effect Text',
                  shadows: [
                    Shadow(
                      blurRadius: 5.0,
                      color: Colors.amber,
                      offset: Offset(5, 5),
                    ),
                  ],
                  style: TextStyle(
                      fontSize: 40,
                      fontWeight: FontWeight.bold,
                      color: Colors.white)),
              SizedBox(height: 20),
               ShadowText.simple(
                  text: 'Simple Shadow Effect Text',
                  style: TextStyle(
                     fontSize: 24,
                     fontWeight: FontWeight.bold,
                     color: Colors.blue,
                  ),
                  shadowColor: Colors.red,
                  shadowBlurRadius: 8.0,
                  shadowOffset: Offset(3, 3),
               ),
               SizedBox(height: 20),
              // Multi-Color Text
              MultiColorText(
                spans: [
                  TextSpan(
                    text: 'Multi',
                    style: TextStyle(color: Colors.blue, fontSize: 40),
                  ),
                  TextSpan(
                    text: 'Color ',
                    style: TextStyle(color: Colors.green, fontSize: 40),
                  ),
                  TextSpan(
                    text: 'Text',
                    style: TextStyle(color: Colors.red, fontSize: 40),
                  ),
                ],
              ),
              SizedBox(height: 20),
              // InteractiveTextuality
              InteractiveText(
                text: 'on Tap',
                onTap: () {},
                style: TextStyle(fontSize: 20, fontWeight: FontWeight.bold),
              ),
              SizedBox(height: 20),
              // Rotated Text
              RotatedText(
                text: 'Rotated Text',
                rotationAngle: 0.5, // Rotate 90 degrees
                style: TextStyle(fontSize: 40, fontWeight: FontWeight.bold),
              ),
              SizedBox(height: 20),

              // Blurred Text
              BlurredText(
                text: 'Blurred Text',
                blurStrength: 5.0,
                style: TextStyle(fontSize: 40, fontWeight: FontWeight.bold),
              ),
              SizedBox(height: 20),

              // Bordered Background Text
              BorderedBackgroundText(
                text: 'Bordered Background Text',
                borderColor: Colors.black,
                borderWidth: 3.0,
                backgroundColor: Colors.yellow,
                style: TextStyle(fontSize: 40, fontWeight: FontWeight.bold),
              ),
            ],
          ),
        ),
      ),
    );
  }
}

    

GradientTextuality GradientText

ChipTextuality ChipText

StrokeTextuality StrokeText

InteractiveTextuality InteractiveText

NeonTextuality NeonText

ShadowTextuality ShadowText

MultiColorTextuality MultiColorText

RotatedTextuality RotatedText

BlurredTextuality BlurredText

BorderedBackgroundTextuality BorderedText

Changelog

See the CHANGELOG.md file for updates.

License

This package is licensed under the MIT License.

Author

Hassan Zaheer