horizontal_list_view 1.1.0 copy "horizontal_list_view: ^1.1.0" to clipboard
horizontal_list_view: ^1.1.0 copied to clipboard

Simple horizontal list view widget for displaying a list of items in a horizontal layout with fixed crosAxisCount.

horizontal_list_view Pub #

Simple and customizable horizontal list view widget for displaying a list of items in a horizontal layout. This package is designed to simplify the creation of horizontal lists with a specified crossAxisCount without the need to provide a fixed height for the ListView.

Preview example

Installing #

Add to pubspec.yaml file

dependencies:
  horizontal_list_view: ^1.1.0

import

import 'package:horizontal_list_view/horizontal_list_view.dart';

Usage #

Using HorizontalListView

 HorizontalListView(
   crossAxisCount: 2, // Number of items displayed per row.
   crossAxisSpacing: 8.0, // Spacing between items in the same row.
   alignment: CrossAxisAlignment.center, // Alignment of items within the row (default is center)
   controller: HorizontalListViewController(), //Optional scroll controller.
   children: [
     // List of child widgets
     // ...
   ],
)

Using HorizontalListView.builder

If you want to create a horizontal list view with dynamic content, you can use HorizontalListView.builder. Here`s an example:

import 'package:horizontal_list_view/horizontal_list_view.dart';

HorizontalListView.builder(
    crossAxisCount: 3, // Number of items displayed per row.
    crossAxisSpacing: 16, // Spacing between items in the same row.
    alignment: CrossAxisAlignment.center, // Alignment of items within the row (default is center)
    controller: HorizontalListViewController(), // Optional scroll controller.
    itemCount: 12, // Total number of items in the list.
    itemBuilder: (BuildContext context, int index) {
        // Create and return the widgets for each item.
        return AspectRatio(
            aspectRatio: 16 / 9,
            child: Container(
                color: Colors.red,
                child: Center(
                    child: Text('item: $index'),
                ),
            ),
        );
    },
)

In this example, you spacify the number of items per row (crossAxisCount), spacing between items (crossAxisSpacing), and provide an itemBuilder function to create the individual items based on the index.

10
likes
160
points
212
downloads

Publisher

verified publisherflameark.com

Weekly Downloads

Simple horizontal list view widget for displaying a list of items in a horizontal layout with fixed crosAxisCount.

Repository (GitHub)

Documentation

API reference

License

MIT (license)

Dependencies

flutter

More

Packages that depend on horizontal_list_view