Skip to content

Abrarahmed786/WrapBuilder

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

2 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

WrapBuilder

This is a Flutter widget named WrapBuilder that allows you to dynamically build a wrap of widgets based on the provided parameters.

How to Use

1. Import the File

Import the WrapBuilder file into your Flutter project.

import 'package:flutter/material.dart';

2. Implement WrapBuilder Widget

Use the WrapBuilder widget in your Flutter application by providing the required parameters.

WrapBuilder(
  itemBuilder: (BuildContext context, int index) {
    // Build your widget here based on the index
    // Example: return Text('Item $index');
  },
  itemCount: itemCount,
  mainAxisAlignment: MainAxisAlignment.start, // Customize main axis alignment
  mainAxisSize: MainAxisSize.max, // Customize main axis size
  crossAxisAlignment: CrossAxisAlignment.center, // Customize cross axis alignment
  textDirection: null, // Set the text direction if needed
  verticalDirection: VerticalDirection.down, // Customize vertical direction
  reversed: false, // Set to true if you want to reverse the order
)

Parameters

  • itemBuilder: A function that returns the widget for each item in the wrap.
  • itemCount: The total number of items in the wrap.
  • mainAxisAlignment: (Optional) Aligns the children along the main axis.
  • mainAxisSize: (Optional) Determines how much space the wrap should occupy along the main axis.
  • crossAxisAlignment: (Optional) Aligns the children along the cross axis.
  • textDirection: (Optional) The direction to resolve text and children order.
  • verticalDirection: (Optional) Determines the order to lay children out vertically.
  • reversed: Whether to reverse the order of items in the wrap.

Example

import 'package:flutter/material.dart';

class MyWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: WrapBuilder(
        itemBuilder: (BuildContext context, int index) {
          return Container(
            child: Text('Item $index'),
          );
        },
        itemCount: 10,
        mainAxisAlignment: MainAxisAlignment.start,
        mainAxisSize: MainAxisSize.max,
        crossAxisAlignment: CrossAxisAlignment.center,
        verticalDirection: VerticalDirection.down,
        reversed: false,
      ),
    );
  }
}

This will create a wrap with 10 containers, each containing a text widget with the titles "Item 0", "Item 1", ..., "Item 9". Adjust the parameters according to your requirements.

Feel free to customize the parameters and the itemBuilder function according to your application's needs.

About

No description, website, or topics provided.

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages