0 purchases
dynamic height list view
A Flutter package that provides dynamic height grid and list views with customizable layouts and flexible scroll behaviors. The package includes both DynamicHeightGridView and DynamicHeightListView to handle grids and lists where each item's height can vary.
Demo #
Features #
Dynamic Grid View: Supports dynamic item heights with flexible row layouts.
Dynamic List View: Allows dynamic item heights in both horizontal and vertical scroll views.
Customizable Padding: You can specify padding for both the entire view and individual items.
Flexible Scroll Behavior: Use custom scroll physics and controllers for smooth, customizable scrolling.
Installation #
Add this to your package's pubspec.yaml file:
dependencies:
dynamic_height_list_view: ^0.0.2
copied to clipboard
Then, run:
flutter pub get
copied to clipboard
Usage #
1. DynamicHeightListView Example #
This example demonstrates how to use DynamicHeightListView to display a list with dynamic item heights. You can customize the scroll direction and padding for each item.
import 'package:dynamic_height_list_view/dynamic_height_view.dart';
import 'package:flutter/material.dart';
class ListViewExample extends StatelessWidget {
ListViewExample({super.key});
final List<Color> colors = List.generate(100, (index) => Color((index * 0xFFFFFF ~/ 100) << 0).withOpacity(1.0));
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: const Text('Dynamic Height List View'),
),
body: DynamicHeightListView<int>(
items: List.generate(10, (index) => index),
itemPadding: const EdgeInsets.symmetric(horizontal: 8.0, vertical: 8.0),
itemBuilder: (context, item) => Card(
child: Container(
height: 40,
width: 100,
color: colors[item],
),
),
),
);
}
}
copied to clipboard
2. DynamicHeightGridView Example #
Here’s how to use the DynamicHeightGridView to display a grid with varying item heights and customizable spacing between rows and columns.
import 'package:dynamic_height_list_view/dynamic_height_view.dart';
import 'package:flutter/material.dart';
class GridViewExample extends StatelessWidget {
GridViewExample({super.key});
final List<Color> colors = List.generate(100, (index) => Color((index * 0xFFFFFF ~/ 100) << 0).withOpacity(1.0));
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: const Text('Dynamic Height Grid View'),
),
body: Padding(
padding: const EdgeInsets.all(8.0),
child: DynamicHeightGridView(
shrinkWrap: true,
itemCount: 100,
crossAxisCount: 3,
crossAxisSpacing: 10,
mainAxisSpacing: 10,
builder: (context, index) {
return Container(
height: 200,
color: colors[index],
);
},
),
),
);
}
}
copied to clipboard
Contributors ✨ #
Thanks goes to these wonderful people 💻:
YudizAndroidSunny💻
YudizAndroidVarshil💻
API #
DynamicHeightListView #
Property
Type
Description
items
List<T>
The list of items to display.
itemBuilder
Widget Function(BuildContext context, T item)
Function that builds the widgets for each list item.
itemPadding
EdgeInsets
Padding for each item.
scrollDirection
ScrollDirection
Direction of the scroll (horizontal or vertical).
controller
ScrollController?
Controller for the scroll view.
physics
ScrollPhysics?
Scroll physics for the view (e.g., BouncingScrollPhysics).
DynamicHeightGridView #
Property
Type
Description
builder
IndexedWidgetBuilder
Function that builds the grid items.
itemCount
int
Number of items in the grid.
crossAxisCount
int
Number of columns in the grid.
crossAxisSpacing
double
Spacing between columns.
mainAxisSpacing
double
Spacing between rows.
controller
ScrollController?
Controller for the grid's scroll view.
shrinkWrap
bool
If true, grid will take up only as much space as needed.
Contributions #
Contributions are welcome! Please open an issue or submit a pull request on the GitHub repository if you would like to contribute to Dynamic Height List/Grid View.
Support #
If you encounter any issues or have questions, feel free to open an issue on GitHub.
License #
This project is licensed under the MIT License - see the LICENSE file for details.
Visitors Count #
For personal and professional use. You cannot resell or redistribute these repositories in their original state.
There are no reviews.