Search packages, repositories and app categories

ducafecatFlutter ecosystem guide
Package detailsv1.0.0

flextras

A collection of Flex widgets (Columns and Rows) with additional functionality.

AndroidiOSWebmacOSWindowsLinux
pub.dev API documentation Source code
30-day downloads
9.1K
Likes
143
Pub points
150

Install package

flutter pub add flextras

Package Overview

Package selection guidance compiled from public package information, community data, and project usage.

Flextras is a Flutter package that extends the functionality of standard Column and Row widgets with additional features for more flexible and powerful layout management. It provides enhanced control over alignment, spacing, and responsive behavior, making it easier to create complex, adaptive UIs. Designed for developers seeking greater customization beyond built-in Flex widgets, Flextras integrates seamlessly into existing Flutter projects. The package supports all major platforms, including mobile, web, and desktop, ensuring consistent behavior across devices.

Use cases

  • Creating responsive layouts
  • Building complex UIs with dynamic spacing
  • Improving alignment precision
  • Designing adaptable interfaces for multiple screen sizes
  • Simplifying repetitive layout patterns

Key features

  • Extended alignment options
  • Dynamic spacing controls
  • Responsive layout helpers
  • Cross-platform consistency
  • Easy integration with existing Flutter code

Suitable for

  • Flutter developers building complex layouts
  • Teams prioritizing UI consistency across platforms
  • Projects requiring fine-grained control over widget arrangement

Considerations

  • Requires familiarity with Flutter's layout system
  • May add overhead for simple layouts
  • Best suited for projects with advanced layout needs

Original README

Original README snapshot from the linked source repository. Visit the repository for the latest content.

tests

flextras

A collection of Columns and Rows with extra functionality:

  • PaddedColumn / PaddedRow - Wraps a column/row in padding
  • SeparatedColumn / SeparatedRow - Insert any widget between each child
  • ExpandedScrollingColumn / ExpandedScrollingRow - Allow a column to hold Expandable children, while still scrolling if it needs to.

🔨 Installation

dependencies:
  flextras: ^0.0.1
⚙ Import
import 'package:flextras/flextras.dart';

🕹️ Usage

PaddedContainer and PaddedRow

A simple combination of Padding and Column/Row, as is often needed. Very simple, but saves a few lines in your tree:

return PaddedColumn(
    padding: EdgeInsets.all(20),
    children: [ ... ]
)
SeparatedColumn and SeparatedRow

Often you want to place a divider between the elements of a Column or Row. Use the separatorBuilder method to do so easily:

return SeparatedColumn(
    // 10px gap between each element
    separatorBuilder: () => SizedBox(height: 10),
    children: [ ... ]
)
ExpandedScrollingColumn and ExpandedScrollingRow

Solves a common use case where you want to have some expanding content, that can also begin scrolling if it runs out of room.

Normally, if you do something like this it will throw a layout error:

SingleChildScrollView(
    child: Column(
        children: [
            Expanded(child: ...) // This tries to expand to infinity :(
        ]
    )
)

ExpandedScrollingColumn fixes this by using the content's natural height, or the height of the parent view, whichever is greater.

// This will expand vertically to fill the parent, but begin scrolling when it has to
ExpandedScrollingColumn(
    children: [
        Expanded(child: Container(height: 400)),
    ]
)

🐞 Bugs/Requests

If you encounter any problems please open an issue. If you feel the library is missing a feature, please raise a ticket on Github and we'll look into it. Pull request are welcome.

📃 License

MIT License

Categories

Scrollable, ScrollView & Scrollbar

Source repository

Projects using this package