> For the complete documentation index, see [llms.txt](https://ecm-pmdm-flutter.gitbook.io/1.-introduccion-a-flutter/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://ecm-pmdm-flutter.gitbook.io/1.-introduccion-a-flutter/4.-conceptos-fundamentales-en-flutter/widgets/stateless-widget.md).

# Stateless widget

Los widgets **stateless** extienden de la clase **`StatelessWidget`** y son **inmutables** y, por ello, una vez creados, ya no van a cambiar sus propiedades durante la ejecución de la aplicación.&#x20;

* Todos sus atributos deberían declararse *final* (aunque Dart no obliga)
* Son widgets que se optimizan internamente por el runtime de Flutter
* Deben de utilizarse siempre que el estado del widget no vaya a cambiar, es decir, depende únicamente de sus datos internos (por ejemplo, recibidos en el constructor).

### **Ejemplo 1**

Creamos una aplicación MaterialApp compuesta por un **stateless** **widget:** **HomePage**, donde **count** es un atributo entero declarado como *final* que no cambiará en tiempo de ejecución.

<pre class="language-dart" data-line-numbers><code class="lang-dart"><strong>import 'package:flutter/material.dart';
</strong>
void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return const MaterialApp(
      home: Homepage(count: 10),
    );
  }
}

class Homepage extends StatelessWidget {
  final int count;

  const Homepage({required this.count});

  @override
  Widget build(BuildContext context) {
    return Text('Count = $count');
  }
}
</code></pre>

<figure><img src="/files/KfN73g76wKlCTUcnYRRl" alt="" width="314"><figcaption></figcaption></figure>

### Ejemplo 2

En este segundo ejemplo vamos a modificar el valor de `count` y comprobar si se visualiza en pantalla el valor actualizado.  &#x20;

* Para ello, **sustituimos** el código de **Homepage** del **Ejemplo 1** por el siguiente código donde se incrementa el valor de `count` al pulsar el botón.

```dart
class Homepage extends StatelessWidget {
  int count;

  Homepage({required this.count});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text('Example of Stateless widget'),),
      body: ElevatedButton(
        onPressed: () {
          count++;
          print(count);
        },
        child: Text('Try to increment, COUNT= ${count}'),),
    );
  }
}
```

<figure><img src="/files/GxfWSJIsVpaTOuxtWp3V" alt="" width="375"><figcaption></figcaption></figure>

Si lo **ejecutamos**, comprobaremos que pulsando el botón se imprime en la consola el valor real de `count` pero en realidad, como es un **widget** **inmutable,** Flutter ignora cualquier cambio y **no se actualiza su valor en la UI**.  (<mark style="color:blue;">-> necesitaremos un widget Stateful</mark>)


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter:

```
GET https://ecm-pmdm-flutter.gitbook.io/1.-introduccion-a-flutter/4.-conceptos-fundamentales-en-flutter/widgets/stateless-widget.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
