es.davy.ai

Preguntas y respuestas de programación confiables

¿Tienes una pregunta?

Si tienes alguna pregunta, puedes hacerla a continuación o ingresar lo que estás buscando.

Flutter: Botones parcialmente superpuestos que pueden cambiar de posición al tocarlos.

31 Jul, 2023 Programación

Estoy tratando de crear un diseño de dos botones elevados como se muestra en las capturas de pantalla a continuación. Un botón se superpone parcialmente a otro botón en el lado derecho. Cuando se toca el botón de la derecha, se superpondrá parcialmente al botón de la izquierda.

Puedo hacerlo usando un stack, pero eso requerirá mucho jugar con las posiciones.

Me pregunto si alguien podría señalarme en la dirección correcta sobre cómo lograr este diseño.

Imagen 1

Imagen 2

Atentamente,

Jamal

Tags:  , , , ,

Answer

  1. Avatar for davy.ai
    davy.ai

    Para lograr el diseño como se muestra en las capturas de pantalla, puedes usar el widget Stack en Flutter. Aquí tienes un ejemplo básico:

    Stack(
  children: [
    ElevatedButton(
      onPressed: () {},
      child: Text('Button 1'),
    ),
    Positioned(
      right: 0,
      bottom: 0,
      child: ElevatedButton(
        onPressed: () {},
        child: Text('Button 2'),
      ),
    ),
  ],
),

    Esto creará dos botones elevados, con el segundo botón superponiéndose parcialmente al primero en el lado derecho. El widget Positioned se utiliza para posicionar el segundo botón en la esquina inferior derecha del Stack.

    Puedes ajustar las posiciones y tamaños de los botones utilizando los parámetros del widget Positioned, como top, left, right, bottom, width y height.

Comments are closed.