--- title: "👉 Flutter y sus widgets básicos" description: "Desde ReÁnima Soluciones Digitales, como expertos en el desarrollo de apps para iOS y Android, te mostramos algunos aspectos básicos que debes conocer para su funcionamiento, com" url: "https://www.reanimasoluciones.com/actualidad/227-flutter-y-sus-widgets-basicos" date: "2026-10-07T06:03:38+00:00" language: "es-ES" --- [Skip to main content](#tm-main) - [APPs](https://www.reanimasoluciones.com/apps-moviles) - [Web APPs](https://www.reanimasoluciones.com/webs) - [IA](https://www.reanimasoluciones.com/inteligencia-artificial-empresas) - [Automatizaciones](https://www.reanimasoluciones.com/automatizaciones) - [Equipos dedicados](https://www.reanimasoluciones.com/equipos-dedicados) - [Mantenimiento](https://www.reanimasoluciones.com/mantenimiento) - [Trabajos](https://www.reanimasoluciones.com/trabajos) - [Blog](https://www.reanimasoluciones.com/actualidad) - [Contacto](https://www.reanimasoluciones.com/contacto) # 👉 Flutter y sus widgets básicos - [ Share](#) - [ Tweet](#) - [ Share](#) - [ Share](#) - [ Share](#) - [ Email](mailto:?subject=Check%20out%20this%20page:%20%F0%9F%91%89%20Flutter%20y%20sus%20widgets%20b%C3%A1sicos&body=https://www.reanimasoluciones.com/actualidad/227-flutter-y-sus-widgets-basicos) - [ Copy Link](#) ![](https://www.reanimasoluciones.com/images/Flutter-y-sus-widgets-basicos.jpg) 1. [Flutter: *Widgets* básicos](https://www.reanimasoluciones.com/actualidad/227-flutter-y-sus-widgets-basicos#flutter-widgets-b%C3%A1sicos) 1. [AppBar](https://www.reanimasoluciones.com/actualidad/227-flutter-y-sus-widgets-basicos#appbar) 2. [Column](https://www.reanimasoluciones.com/actualidad/227-flutter-y-sus-widgets-basicos#column) 3. [Row](https://www.reanimasoluciones.com/actualidad/227-flutter-y-sus-widgets-basicos#row) 2. [**¿Quieres saber cuánto cuesta la APP que necesitas?**](https://www.reanimasoluciones.com/actualidad/227-flutter-y-sus-widgets-basicos#quieres-saber-cu%C3%A1nto-cuesta-la-app-que-necesitas) 1. [Text](https://www.reanimasoluciones.com/actualidad/227-flutter-y-sus-widgets-basicos#text) 2. [Container](https://www.reanimasoluciones.com/actualidad/227-flutter-y-sus-widgets-basicos#container) 3. [Image](https://www.reanimasoluciones.com/actualidad/227-flutter-y-sus-widgets-basicos#image) 4. [Icon](https://www.reanimasoluciones.com/actualidad/227-flutter-y-sus-widgets-basicos#icon) 5. [Scaffold](https://www.reanimasoluciones.com/actualidad/227-flutter-y-sus-widgets-basicos#scaffold) 1. [Ver más artículos relacionados:](https://www.reanimasoluciones.com/actualidad/227-flutter-y-sus-widgets-basicos#ver-m%C3%A1s-art%C3%ADculos-relacionados) **Flutter**, el SDK de código fuente abierto de desarrollo de aplicaciones móviles creado por Google, se utiliza para la creación y desarrollo de aplicaciones nativas para dispositivos móviles de una forma rápida y sencilla. Desde [ReÁnima Soluciones Digitales](https://www.3androides.com/), como expertos en el desarrollo de apps para iOS y Android, te mostramos algunos aspectos básicos que debes conocer para su funcionamiento, como es el caso de los **Flutter *widgets***. ## Flutter: *Widgets* básicos Al consultar el **Flutter widget catalog** nos encontramos con una serie de Flutter Widgets que son fundamentales para aprender a utilizar con acierto este SDK. Entre ellos debemos mencionar los siguientes: ### AppBar Este *widget* que pertenece a la clase **AppBar** está creado para hacer que se represente una **barra de aplicaciones**. Este se trata de un espacio delimitado en el cual se pueden incluir otros muchos *widgets*. Aunque es muy simple es una barra que es clave para mantener una estructura básica en la aplicación. Estas siguen los principios del Flutter Material widget. ### Column El *widget* de Flutter tipo **Column** es *una* clase que se encarga de la representación de una columna, lo que hace que se pueden mostrar los *widgets* hijos en forma de un vector vertical. En este caso no se permite el desplazamiento en *scroll* hacia arriba y hacia abajo, por lo que si ese es tu deseo debes recurrir a otro tipo de *widget*. ### Row Otro de los Flutter widgets básicos es el **Row**, que es similar al Column anterior, pero que en este caso realiza la función en **fila**. De esta manera se pueden mostrar los *widgets* hijos en forma de vector horizontal. Además, en la línea del anterior, tampoco se permite hacer *scroll*. ## **¿Quieres saber cuánto cuesta la APP que necesitas?** Por favor, revisa todos los campos. Nombre**\***El nombre es obligatorio. Teléfono (opcional)El teléfono no es correcto. ConsultaEntrada no válida Email**\***Debes indicar un email valido. ¿Qué tipo de desarrollo solicitas?**\*** ¿Qué tipo de desarrollo solicitas? Para una empresa Para una StartUp Para un particular Entrada no válida Presupuesto disponible**\*** Presupuesto disponible Entre 1500 € y 3500 € Entre 3500 € y 6000 € Entre 6000 € y 10000 € Entre 10000 € y 20000 € Más de 20000 € Entrada no válida Política de privacidad**\*** Política de privacidad He leído y acepto la [política de privacidad](https://www.reanimasoluciones.com/politica-de-privacidad). Debes aceptar la política de privacidad. ⭐ ¿Sabías que tenemos las mejores ofertas? ⭐ ¿Sabías que tenemos las mejores ofertas? Quiero recibir de vuestras ofertas y promociones 😊 Entrada no válida Verifica que eres un humano**\*** Entrada no válida ### Text El *widget* **Text** ayuda a mostrar una línea o varias con un estilo determinado. Esto es así en lo que se refiere a tamaño, fuente, color… Es uno de los elementos clave para la creación de aplicaciones. ### Container Entre los Flutter widgets se debe mencionar el **Container**, el cual representa un espacio delimitado. Es utilizado para personalizar con mayor precisión la forma en la que se muestra un *widget* hijo. Para ello, se recurre al mismo para definir márgenes, bordes, *paddings* o colores de fondo, entre otros. ### Image Si hablamos de los *widgets* básicos de Flutter no podemos dejar de lado la clase **Image**, que es la que hace posible que podamos mostrar una imagen. Principalmente, admite los siguientes formatos de imagen: **JPEG, PNG, GIF, GIF animado, WebP, WebP animado, BMP y WBMP**. ### Icon El *widget* de tipo **Icon** se encarga de la representación de un icono gráfico. En Flutter se trata de iconos que no son interactivos, por lo que si este es tu deseo tendrás que recurrir a **IconButton**. Además, se entiende que el icono es cuadrado, por lo que si no lo son pueden no mostrarse de la manera correcta. ### Scaffold Entre los Flutter widgets básicos también tenemos que mencionar **Scaffold**, el cual implementa una estructura visual básica que es conforme al Flutter Material widget Design, un *widget* que establece los cimientos del diseño de la aplicación. Esta clase nos ofrece diferentes propiedades para poder personalizar la estructura visual de la app. Estos son solo algunos de los **Flutter widgets** que se deben utilizar para la creación de una aplicación funcional básica para ser utilizada en dispositivos móviles con sistema operativo iOS. - [ Share](#) - [ Tweet](#) - [ Share](#) - [ Share](#) - [ Share](#) - [ Email](mailto:?subject=Check%20out%20this%20page:%20%F0%9F%91%89%20Flutter%20y%20sus%20widgets%20b%C3%A1sicos&body=https://www.reanimasoluciones.com/actualidad/227-flutter-y-sus-widgets-basicos) - [ Copy Link](#) --- #### Ver más artículos relacionados: [![](https://www.reanimasoluciones.com/images/imagen10-08-26.jpg "👉 Pasaporte digital de producto para pymes: empieza por ordenar los datos, no por el QR")](https://www.reanimasoluciones.com/actualidad/329150-pasaporte-digital-producto-pymes) #### [👉 Pasaporte digital de producto para pymes: empieza por ordenar los datos, no por el QR](https://www.reanimasoluciones.com/actualidad/329150-pasaporte-digital-producto-pymes) [![](https://www.reanimasoluciones.com/images/imagen03-08-26.jpg "👉 Digitalizar las compras internas de una pyme: menos urgencias, más control")](https://www.reanimasoluciones.com/actualidad/329149-digitalizar-compras-internas-pyme) #### [👉 Digitalizar las compras internas de una pyme: menos urgencias, más control](https://www.reanimasoluciones.com/actualidad/329149-digitalizar-compras-internas-pyme) [![](https://www.reanimasoluciones.com/images/imagen27-07-26.jpg "👉 Alta de cliente digitalizada: el primer proceso que muchas pymes deberían ordenar")](https://www.reanimasoluciones.com/actualidad/329148-alta-cliente-digitalizada) #### [👉 Alta de cliente digitalizada: el primer proceso que muchas pymes deberían ordenar](https://www.reanimasoluciones.com/actualidad/329148-alta-cliente-digitalizada) [![](https://www.reanimasoluciones.com/images/imagen26-07-26.jpg "👉 Software heredado en pymes: cuando el sistema funciona, pero nadie se atreve a tocarlo")](https://www.reanimasoluciones.com/actualidad/329142-software-heredado-en-pymes) #### [👉 Software heredado en pymes: cuando el sistema funciona, pero nadie se atreve a tocarlo](https://www.reanimasoluciones.com/actualidad/329142-software-heredado-en-pymes) [![](https://www.reanimasoluciones.com/images/imagen25-07-26.jpg "👉 Gestión de incidencias para pymes: de mensajes dispersos a aprendizaje operativo")](https://www.reanimasoluciones.com/actualidad/329141-gestion-de-incidencias-para-pymes) #### [👉 Gestión de incidencias para pymes: de mensajes dispersos a aprendizaje operativo](https://www.reanimasoluciones.com/actualidad/329141-gestion-de-incidencias-para-pymes) [![](https://www.reanimasoluciones.com/images/imagen24-07-26.jpg "👉 Matriz de permisos para IA y software: el documento sencillo que evita mucho caos")](https://www.reanimasoluciones.com/actualidad/329140-matriz-de-permisos-para-ia-y-software) #### [👉 Matriz de permisos para IA y software: el documento sencillo que evita mucho caos](https://www.reanimasoluciones.com/actualidad/329140-matriz-de-permisos-para-ia-y-software) ### ÚLTIMAS NOTICIAS - [👉 Pasaporte digital de producto para pymes: empieza por ordenar los datos, no por el QR](https://www.reanimasoluciones.com/actualidad/329150-pasaporte-digital-producto-pymes) (<a href="/actualidad">Actualidad</a>) 10-08-2026 El pasaporte digital de producto para pymes no debería empezar con la elección de un código QR. El QR... - [👉 Digitalizar las compras internas de una pyme: menos urgencias, más control](https://www.reanimasoluciones.com/actualidad/329149-digitalizar-compras-internas-pyme) (<a href="/actualidad">Actualidad</a>) 03-08-2026 Digitalizar las compras internas</strong> no consiste en instalar un gran programa de aprovisionamiento. Para... - [👉 Alta de cliente digitalizada: el primer proceso que muchas pymes deberían ordenar](https://www.reanimasoluciones.com/actualidad/329148-alta-cliente-digitalizada) (<a href="/actualidad">Actualidad</a>) 27-07-2026 El alta de cliente digitalizada suele parecer un asunto administrativo, pero en muchas pymes es el... - [👉 Software heredado en pymes: cuando el sistema funciona, pero nadie se atreve a tocarlo](https://www.reanimasoluciones.com/actualidad/329142-software-heredado-en-pymes) (<a href="/actualidad">Actualidad</a>) 26-07-2026 El software heredado en pymes suele vivir en una zona incómoda. Funciona lo suficiente para que... - [👉 Gestión de incidencias para pymes: de mensajes dispersos a aprendizaje operativo](https://www.reanimasoluciones.com/actualidad/329141-gestion-de-incidencias-para-pymes) (<a href="/actualidad">Actualidad</a>) 25-07-2026 La gestión de incidencias para pymes no debería entenderse solo como un sistema de tickets. Bien... ## Clientes que ya han trabajado con nosotros. Cada proyecto tiene un contexto distinto: una app que necesita evolucionar, un sistema que debe estabilizarse, una automatización que ahorra tiempo o una herramienta interna que mejora el control del negocio. Estas reseñas reflejan cómo trabajamos: entendiendo primero el problema, acompañando el proceso y construyendo soluciones útiles. - [ ![Alba Prado](https://lh3.googleusercontent.com/a-/ALV-UjV3a3ijVsqw-epGi3EhoQckCuSK-FC5n8HdSv6862LLYaRpg7c=s128-c0x00000000-cc-rp-mo "Alba Prado") ](https://www.google.com/maps/contrib/115039964901093972757/reviews "Alba Prado") [ Alba Prado ](https://www.google.com/maps/contrib/115039964901093972757/reviews "Alba Prado") Cuando empecé a trabajar con ReÁnima, Yourney era solo una idea. Hoy es una realidad, y ellos han sido una parte fundamental de ese camino. Desde el principio entendieron la visión detrás del proyecto y me acompañaron no solo en el desarrollo, sino también en todas las decisiones, cambios y retos que inevitablemente aparecen cuando estás construyendo algo desde cero. Lo que más valoro es su implicación, su cercanía y la sensación de estar trabajando con un equipo que realmente quiere que el proyecto salga bien. Siempre han estado dispuestos a escuchar, buscar soluciones y adaptarse para encontrar la mejor manera de avanzar. Estoy muy agradecida a todo el equipo de ReÁnima por haberme ayudado a convertir una idea en algo real. Sin duda, volvería a trabajar con ellos. - [ ![Leticia GB](https://lh3.googleusercontent.com/a-/ALV-UjX4Hvv58Vy1oFt7ly3V1XFeBsxKK2Yb8hjY67fQcMvxD1tVdktG=s128-c0x00000000-cc-rp-mo-ba3 "Leticia GB") ](https://www.google.com/maps/contrib/102079187082512653133/reviews "Leticia GB") [ Leticia GB ](https://www.google.com/maps/contrib/102079187082512653133/reviews "Leticia GB") El equipo de ReÁnima me a apoyado en el proceso inicial de desarrollo de mi aplicación de forma muy profesional y eficiente. Han resuelto todas mis dudas de forma rápida y efectiva. Sin duda los recomiendo para cualquier proyecto!! - [ ![Juan Antonio Tomás Martínez](https://lh3.googleusercontent.com/a-/ALV-UjU2BFEibnJctR0X_qdD_JWC1QzaL_ggTdVnJRiPN7Xl6tTTPK5D=s128-c0x00000000-cc-rp-mo "Juan Antonio Tomás Martínez") ](https://www.google.com/maps/contrib/117202801606678309969/reviews "Juan Antonio Tomás Martínez") [ Juan Antonio Tomás Martínez ](https://www.google.com/maps/contrib/117202801606678309969/reviews "Juan Antonio Tomás Martínez") Trabajar con 3Androides ha sido una experiencia increíble. Desde el primer momento, su equipo demostró un alto nivel de profesionalismo, conocimiento técnico y compromiso con la calidad. Destaco especialmente su capacidad para resolver problemas de manera eficiente y su atención al detalle. Cumplieron con los plazos establecidos y nos brindaron un soporte continuo, lo que nos dio confianza y tranquilidad durante todo el proceso. ¡Recomendadísimos! - [ ![Susana de la Iglesia](https://lh3.googleusercontent.com/a/ACg8ocID__nxDkV_rFsVA545dIpz9I0sw0HAMWL78dw1WxKzv8essA=s128-c0x00000000-cc-rp-mo "Susana de la Iglesia") ](https://www.google.com/maps/contrib/104848416098470385430/reviews "Susana de la Iglesia") [ Susana de la Iglesia ](https://www.google.com/maps/contrib/104848416098470385430/reviews "Susana de la Iglesia") Son una empresa muy profesional. Por poner un pero diría que tienen una metodología de trabajo muy rígida (que hace que los proyectos salgan adelante de forma perfecta) pero que te requieren. Y yo no siempre tenía tiempo para poder atenderles a ellos. Si mejoraran esa flexibilidad sería todo perfecto! [ Ver todas las opiniones ](https://search.google.com/local/reviews?placeid=ChIJk-9JBakpQg0Ri6kiKTBoo44) [ Escribir una opinión ](https://search.google.com/local/writereview?placeid=ChIJk-9JBakpQg0Ri6kiKTBoo44) [ ![ReÁnima](https://www.reanimasoluciones.com/images/Horizontal%20invertido.png) ](#) Tecnología útil para empresas que quieren ahorrar tiempo, reducir costes y trabajar con más control. #### Servicios - [ Desarrollo de APPs móviles ](https://www.reanimasoluciones.com/apps-moviles) - [ Aplicaciones web internas ](https://www.reanimasoluciones.com/webs) - [ Mantenimiento de apps ](https://www.reanimasoluciones.com/mantenimiento) #### Dirección C/Marie Curie 7, Edificio Beta (Planta 7), Rivas Vaciamadrid 28521 MADRID #### Contacto - [ Esta dirección de correo electrónico está siendo protegida contra los robots de spam. Necesita tener JavaScript habilitado para poder verlo. ](mailto:info@reanimasoluciones.com) - [ 666 250 440 ](tel:+34666250440) - Madrid · España #### Legal Soluciones Digitales Equilibradas S.L.U. CIF: B86956950 Inscrita en el registro mercantil de Madrid, al tomo 32036, folio 65, hoja M-576488. [ Nosotros ](https://www.reanimasoluciones.com/nosotros) [ Trabajos ](https://www.reanimasoluciones.com/trabajos) [ Actualidad ](https://www.reanimasoluciones.com/actualidad) [ Política de privacidad ](https://www.reanimasoluciones.com/politica-de-privacidad) [ Aviso legal ](https://www.reanimasoluciones.com/aviso-legal) [ Política de cookies ](https://www.reanimasoluciones.com/politica-de-cookies) © 2026 ReÁnima. Todos los derechos reservados. Menos tareas. Más tiempo. [ **Llámanos** 666 250 440 ](tel:+34666250440) [ **Escríbenos** ](https://wa.me/34666250440) ## Schema ```json { "@context": "https://schema.org", "@type": "BreadcrumbList", "itemListElement": [ { "@type": "ListItem", "position": 1, "name": "Inicio", "item": "https://www.reanimasoluciones.com" }, { "@type": "ListItem", "position": 2, "name": "Blog", "item": "https://www.reanimasoluciones.com/actualidad" }, { "@type": "ListItem", "position": 3, "name": "👉 Flutter y sus widgets básicos", "item": "https://www.reanimasoluciones.com/actualidad/227-flutter-y-sus-widgets-basicos.md" } ] } ``` ```json { "@context": "https://schema.org", "@type": "BlogPosting", "mainEntityOfPage": { "@type": "WebPage", "@id": "https://www.reanimasoluciones.com/actualidad/227-flutter-y-sus-widgets-basicos.md" }, "headline": "👉 Flutter y sus widgets básicos", "description": "Desde ReÁnima Soluciones Digitales, como expertos en el desarrollo de apps para iOS y Android, te mostramos algunos aspectos básicos que debes conocer para su funcionamiento, com", "image": { "@type": "ImageObject", "url": "https://www.reanimasoluciones.com/images/Flutter-y-sus-widgets-basicos.jpg" }, "publisher": { "@type": "Organization", "name": "ReÁnima Soluciones Digitales", "logo": { "@type": "ImageObject", "url": "https://www.reanimasoluciones.com/images/logo_datos_estructurados.jpg" } }, "author": { "@type": "Person", "name": "Alberto Sánchez-Vaquero", "url": "https://www.reanimasoluciones.com/nosotros" }, "datePublished": "2021-12-07T06:00:00+00:00", "dateCreated": "2021-12-07T06:00:00+00:00", "dateModified": "2024-11-12T12:28:53+00:00" } ```