Abreviaturas de punto (dot shorthands) en Flutter

La característica de abreviaturas de punto (dot shorthands) te permite omitir el tipo explícito al acceder a miembros estáticos, constructores o valores de enum, siempre que el compilador pueda inferir el tipo a partir del contexto circundante.

Construir diseños en Flutter a menudo implica árboles de Widgets profundamente anidados. Históricamente, esto significaba escribir repetidamente nombres explícitos de clases y enums para propiedades como colores, tipografía y alineación. Las abreviaturas de punto reducen este código repetitivo (boilerplate), haciendo que tu código sea más fácil de leer y más rápido de escribir.

Aquí hay una comparación lado a lado de la construcción de un Container simple:

Container(
  alignment: Alignment.center,
  padding: const EdgeInsets.all(16.0),
  child: Column(
    mainAxisAlignment: MainAxisAlignment.center,
    crossAxisAlignment: CrossAxisAlignment.start,
    children: [
      Text(
        'Hello World',
        style: TextStyle(
          fontWeight: FontWeight.bold,
        ),
      ),
    ],
  ),
);

Container(
  alignment: .center, // Instead of Alignment.center,
  padding: const .all(16.0), // Instead of EdgeInsets.all(16.0)
  child: Column(
    mainAxisAlignment: .center, // Instead of MainAxisAlignment.center
    crossAxisAlignment: .start, // Instead of CrossAxisAlignment.start
    children: [
      Text(
        'Hello World',
        style: TextStyle(
          fontWeight: .bold, // Instead of FontWeight.bold
        ),
      ),
    ],
  ),
);

Las abreviaturas de punto funcionan en cualquier lugar donde el compilador de Dart tenga un "tipo de contexto" claro, lo que significa que sabe exactamente qué tipo espera. En Flutter, esto ocurre casi en cualquier lugar dentro de la lista de propiedades de un Widget.

Los destinos más comunes para las abreviaturas de punto en Flutter son:

• Enums: MainAxisAlignment, CrossAxisAlignment, BoxFit, TextDirection.
• Propiedades y métodos estáticos: FontWeight (constantes como .bold).
• Constructors: EdgeInsets.all(), BorderRadius.circular().

Cuando una propiedad espera un enum, como mainAxisAlignment, puedes omitir el nombre del enum y simplemente proporcionar el valor precedido por un punto (.):

Row(
  mainAxisAlignment: .spaceEvenly, // Infers MainAxisAlignment.spaceEvenly
  children: [ /* ... */ ],
)

Las propiedades estáticas funcionan cuando el tipo de contexto es exactamente la clase que define la propiedad. Un ejemplo común es el estilo de texto con FontWeight:

Text(
  'Feature highlights',
  style: TextStyle(
    fontWeight: .bold, // Infers FontWeight.bold
  ),
)

También puedes usar abreviaturas de punto para constructores con nombre. Muchas propiedades de diseño en Flutter aceptan una clase base como EdgeInsetsGeometry. Para admitir abreviaturas de punto, Flutter añade constructores de redirección a estas clases base que apuntan a las subclases correspondientes.

Padding(
  padding: .symmetric(horizontal: 16.0, vertical: 8.0), // Infers EdgeInsetsGeometry.symmetric
  child: Text('Spaced out text'),
)

Incluso puedes usar .new para llamar a un constructor sin nombre, aunque esto es menos común en los árboles de Widgets estándar:

class _MyState extends State<MyWidget> {
  final ScrollController _scrollController = .new(); // Infers ScrollController()
  // ...
}