RectRevealButton constructor
- Key? key,
- required Widget widgetA,
- required Widget widgetB,
- Color backgroundColorA = Colors.black,
- Color backgroundColorB = Colors.white,
- Color rippleColorA = Colors.white,
- Color rippleColorB = Colors.black,
- required VoidCallback onPressed,
- double height = 48,
- double? width,
- double radius = 2,
- Duration duration = const Duration(milliseconds: 300),
- bool? selected,
- BoxBorder? border,
- EdgeInsetsGeometry padding = const EdgeInsets.symmetric(horizontal: 16),
- AlignmentGeometry alignment = Alignment.center,
- RevealDirection revealDirection = RevealDirection.fromClick,
Crea un RectRevealButton.
widgetA y widgetB son los widgets a mostrar en cada estado (requeridos).
Se recomienda usar estilos contrastantes para mejor visibilidad.
backgroundColorA y backgroundColorB son los colores de fondo para cada estado.
Deben ser diferentes para que el efecto sea visible.
rippleColorA y rippleColorB son los colores del reveal para cada estado.
Deben ser diferentes para crear el efecto de transición.
onPressed es el callback que se ejecuta al presionar el botón (requerido).
revealDirection controla desde dónde se expande el reveal:
- RevealDirection.fromClick: Desde el punto de toque (por defecto)
- RevealDirection.fromLeft: Desde la izquierda hacia la derecha
- RevealDirection.fromRight: Desde la derecha hacia la izquierda
selected permite control externo del estado del botón (opcional).
Si es null, el botón maneja su propio estado internamente.
height es la altura del botón. Por defecto: 48.0
width es el ancho del botón. Si es null, usa el ancho disponible.
radius es el radio de las esquinas. Mínimo: 2.0. Por defecto: 2.0
duration es la duración de la animación del reveal. Por defecto: 300ms
border es un borde opcional decorativo (no afecta el área de toque).
padding es el padding interno del contenido. Por defecto: horizontal 16px
alignment controla la alineación del contenido. Por defecto: center
Implementation
const RectRevealButton({
super.key,
required this.widgetA,
required this.widgetB,
this.backgroundColorA = Colors.black,
this.backgroundColorB = Colors.white,
this.rippleColorA = Colors.white,
this.rippleColorB = Colors.black,
required this.onPressed,
this.height = 48,
this.width,
this.radius = 2,
this.duration = const Duration(milliseconds: 300),
this.selected,
this.border,
this.padding = const EdgeInsets.symmetric(horizontal: 16),
this.alignment = Alignment.center,
this.revealDirection = RevealDirection.fromClick,
}) : assert(
backgroundColorA != backgroundColorB,
'backgroundColorA y backgroundColorB deben ser diferentes',
),
assert(
rippleColorA != rippleColorB,
'rippleColorA y rippleColorB deben ser diferentes',
),
assert(radius >= 2, 'El radio debe ser al menos 2');