FuzzyText class

Texto con efectos difusos animados que simula fallos digitales o fluctuaciones.

Crea efectos visuales dinámicos aplicando transformaciones aleatorias al texto de forma continua. Soporta dos modos principales (FuzzyMode):

  • Glitch: Desplazamiento horizontal de capas de color (rojo/azul)
  • Height: Fluctuación de escala/tamaño del texto

Cómo funciona

  • Usa un AnimationController en bucle infinito para generar cambios continuos.
  • Cada frame aplica transformaciones aleatorias basadas en amplitude y mode.
  • Para el modo glitch: superpone capas de texto con colores desplazados.
  • Para el modo height: aplica escalado aleatorio al texto base.

Rendimiento

  • La animación corre a 60fps por defecto (duración de 900ms en bucle).
  • Usa Random para generar valores aleatorios en cada frame.
  • Es relativamente liviano, pero ten cuidado con múltiples instancias.

Consejos de UX

  • FuzzyMode.height es más sutil y menos distractor.
  • FuzzyMode.glitch es más dramático, ideal para efectos especiales.
  • Ajusta amplitude para controlar la intensidad del efecto.
  • Usa debugBox durante desarrollo para visualizar los límites.

Ejemplo básico (modo glitch)

FuzzyText.glitch(
  'ERROR 404',
  style: TextStyle(
    fontSize: 32,
    fontWeight: FontWeight.bold,
    color: Colors.white,
  ),
  amplitude: 8.0,
)

Ejemplo modo height (efecto sutil)

FuzzyText.height(
  'Cargando...',
  style: TextStyle(
    fontSize: 24,
    color: Colors.blue,
  ),
  amplitude: 6.0,
)

Ejemplo con configuración personalizada

FuzzyText.glitch(
  'SISTEMA CORRUPTO',
  style: TextStyle(
    fontSize: 28,
    fontFamily: 'Courier',
    color: Colors.green,
  ),
  amplitude: 15.0,
  speed: 2.0,
  debugBox: true, // Solo para desarrollo
)

Notas

  • El widget se autocentra y usa FittedBox para ajustarse al contenido.
  • La animación inicia automáticamente y corre indefinidamente.
  • Para detener la animación, desmonta el widget del árbol.
  • El color base del texto se respeta, las capas glitch usan rojo/azul.
Inheritance

Constructors

FuzzyText.glitch(String text, {required TextStyle style, Key? key, double amplitude = 12, double speed = 1.6, bool debugBox = false})
Crea un FuzzyText con efecto glitch.
factory
FuzzyText.height(String text, {required TextStyle style, Key? key, double amplitude = 12, double speed = 1.6, bool debugBox = false})
Crea un FuzzyText con efecto de fluctuación de altura.
factory

Properties

amplitude → double
Amplitud del efecto. Controla qué tan pronunciado es el efecto.
final
debugBox → bool
Si es true, muestra un borde rosa alrededor del widget para debug.
final
hashCode → int
The hash code for this object.
no setterinherited
key → Key?
Controls how one widget replaces another widget in the tree.
finalinherited
mode → FuzzyMode
Modo de efecto difuso a aplicar.
final
runtimeType → Type
A representation of the runtime type of the object.
no setterinherited
speed → double
Velocidad de la animación (actualmente no implementado).
final
style → TextStyle
Estilo del texto base. Se respeta el color para el modo FuzzyMode.height. En modo FuzzyMode.glitch se usan capas adicionales roja y azul.
final
text → String
El texto a mostrar con efectos difusos.
final

Methods

createElement() → StatefulElement
Creates a StatefulElement to manage this widget's location in the tree.
inherited
createState() → State<FuzzyText>
Creates the mutable state for this widget at a given location in the tree.
override
debugDescribeChildren() → List<DiagnosticsNode>
Returns a list of DiagnosticsNode objects describing this node's children.
inherited
debugFillProperties(DiagnosticPropertiesBuilder properties) → void
Add additional properties associated with the node.
inherited
noSuchMethod(Invocation invocation) → dynamic
Invoked when a nonexistent method or property is accessed.
inherited
toDiagnosticsNode({String? name, DiagnosticsTreeStyle? style}) → DiagnosticsNode
Returns a debug representation of the object that is used by debugging tools and by DiagnosticsNode.toStringDeep.
inherited
toString({DiagnosticLevel minLevel = DiagnosticLevel.info}) → String
A string representation of this object.
inherited
toStringDeep({String prefixLineOne = '', String? prefixOtherLines, DiagnosticLevel minLevel = DiagnosticLevel.debug, int wrapWidth = 65}) → String
Returns a string representation of this node and its descendants.
inherited
toStringShallow({String joiner = ', ', DiagnosticLevel minLevel = DiagnosticLevel.debug}) → String
Returns a one-line detailed description of the object.
inherited
toStringShort() → String
A short, textual description of this widget.
inherited

Operators

operator ==(Object other) → bool
The equality operator.
inherited