DOCSEARCHbyAlgolia
Submit Docs

Jaime Tellez Software Engineering Blog

website·Indexed 30 days ago

https://jaimetellezb.com

A collection of programming guides and tutorials covering Dart, Flutter, and static site generators like Jekyll and Hugo. Content includes Dart basics (operators, records, collections, and control flow), Flutter widget implementation (AppBar and basic widgets), and integration guides such as Supabase authentication for Flutter.

Tokens
43.7K
Snippets
268
Records
329
Agent score
49%

What's inside Jaime Tellez Blog

  2. Overview of the Flutter Card widget

    The Card widget in Flutter is used to group and display organized information within a container. It typically features rounded corners and an elevation shadow to create a sense of depth, making it ideal for displaying related content such as text, images, and actions.

  3. Overview of the Flutter ListTile widget

    The ListTile widget is used to create horizontal list items that typically contain text, icons, and images. It supports three vertical size variations (one, two, or three lines) and is commonly used within ListView, Card, Column, or Drawer widgets to display lists of selectable items or alphabetical listings.

  5. Overview of Dart Records

    Introduced in Dart 3.0, Records are anonymous, immutable, fixed-size, and typed groupings of multiple values. They allow developers to group values of different types without needing to define a formal class.

  6. Overview of Flutter ListView constructors

    Flutter provides several ListView constructors depending on the size and nature of the data being displayed:

    • ListView: Takes a fixed list of widgets. Best for small, static lists.
    • ListView.builder: Generates elements on demand. Recommended for large or infinite lists to optimize performance by only building visible elements.
    • ListView.separated: Similar to .builder but includes a separatorBuilder to place a widget between each item. Recommended for fixed-length lists requiring dividers.
    • ListView.custom: Uses a SliverChildDelegate for advanced customization of child widgets.

  7. Implement an AlertDialog in Flutter

    The AlertDialog widget is used to display a modal dialog that alerts the user about important actions requiring attention and confirmation. It overlays the current screen and blocks interaction with the background content.

    Key properties:

    • title (Optional): A widget displayed at the top of the dialog.
    • content (Required): A widget containing the main message or information.
    • actions (Optional): A list of widgets (typically buttons) displayed at the bottom for user interaction.
    showDialog(
  context: context,
  builder: (context) {
    return AlertDialog(
      title: const Text('AlertDialog básico'),
      content: const Text(
        'Podemos colocar información representativa\n'
        'para indicar al usuario\n'
        'cuál es el fin de las acciones\n'
        'que tiene para realizar.',
      ),
      actions: [
        TextButton(
          child: const Text('Cancelar'),
          onPressed: () {
            Navigator.of(context).pop();
          },
        ),
        TextButton(
          child: const Text('Aceptar'),
          onPressed: () {
            Navigator.of(context).pop();
          },
        ),
      ],
    );
  },
);

  8. Understand and use Sets in Dart

    In Dart, a Set is a collection of unique elements where duplicates are not allowed and there is no guaranteed specific order (unlike Lists).
    // Examples of sets
Set<int> numbers = {1, 2, 3, 4, 5};
Set<String> colors = {'Amarillo', 'Azul', 'Rojo conseg};
var sports = {'Fútbol', 'Ciclismo', 'Tenis'};

  11. Implement SegmentedButton for multi-option selection

    The SegmentedButton widget allows users to select one or more options from a set. It is ideal for filtering lists or switching views. It typically contains 2 to 5 segments, each consisting of an icon and/or text. When selected, the icon often changes to a checkmark (√).

    Selection Modes:

    • Single Selection: Only one option can be selected at a time (e.g., selecting a t-shirt size).
    • Multiple Selection: Multiple options can be selected simultaneously (e.g., combining transport filters).