SquareMatrixLoader constructor

const SquareMatrixLoader({
  1. Key? key,
  2. int numberOfSquares = 3,
  3. Duration duration = const Duration(milliseconds: 1500),
  4. Curve curve = Curves.linear,
  5. double squareHeight = 40,
  6. TraverseDirection direction = TraverseDirection.LEFT_UP_RIGHT_BOTTOM,
  7. Color color = Colors.blue,
})

Crea un SquareMatrixLoader.

numberOfSquares define el tamaño de la matriz (3 = 3x3, 4 = 4x4, etc). Valores recomendados: 3-6. Valores más altos pueden afectar el rendimiento.

squareHeight es el tamaño de cada cuadrado en píxeles. El tamaño total del loader será: squareHeight × numberOfSquares.

duration controla la velocidad de la animación. Matrices más grandes se ven mejor con duraciones más largas (1500ms+).

color es el color de los cuadrados.

direction determina el patrón de animación. Opciones disponibles:

  • BOTTOM_UP: De abajo hacia arriba
  • UP_BOTTOM: De arriba hacia abajo
  • LEFT_RIGHT: De izquierda a derecha
  • RIGHT_LEFT: De derecha a izquierda
  • LEFT_UP_RIGHT_BOTTOM: Diagonal superior izquierda a inferior derecha
  • RIGHT_BOTTOM_LEFT_UP: Diagonal inferior derecha a superior izquierda
  • LEFT_BOTTOM_RIGHT_UP: Diagonal inferior izquierda a superior derecha
  • RIGHT_UP_LEFT_BOTTOM: Diagonal superior derecha a inferior izquierda

curve es la curva de animación para las transiciones. Curves.linear crea un efecto constante, mientras que Curves.easeInOut produce transiciones más suaves.

Implementation

const SquareMatrixLoader({
  super.key,
  this.numberOfSquares = 3,
  this.duration = const Duration(milliseconds: 1500),
  this.curve = Curves.linear,
  this.squareHeight = 40,
  this.direction = TraverseDirection.LEFT_UP_RIGHT_BOTTOM,
  this.color = Colors.blue,
});