Niku Wrap
Style property builder for building "Wrap".
Example usage:
As Widget
NikuWrap([
Text("1"),
Text("2"),
])
..start();
As Property
Wrap(
children: [
Text("1"),
Text("2"),
]
)
.asNiku()
..start();
Availability
To use this widget, you can import from the following:
// All Widget
import 'package:niku/niku.dart';
// Extension
import 'package:niku/extension/widget.dart';
// With relatated widget
import 'package:niku/widget/axis.dart';
// Just widget
import 'package:niku/widget/row.dart';
niku
Switch to use parent property builder.
Example Usage:
NikuWrap()
.niku();
Equivalent to
Niku(
Wrap(),
);
alignment
How the children within a run should be placed in the align axis.
Example Usage:
NikuWrap()
..alignment(WrapAlignment.center);
Equivalent to
Wrap(
alignment: input,
);
start
Shorten syntax of alignment
How the children within a run should be placed in the align axis.
Set align axis alignment using WrapAlignment.start.
Example Usage:
NikuWrap()
..start();
Equivalent to
Wrap(
alignment: WrapAlignment.start,
);
justifyStart
Shorten syntax of alignment
How the children within a run should be placed in the align axis.
Set align axis alignment using WrapAlignment.start.
As a reference to CSS flexbox, justify-content.
Example Usage:
NikuWrap()
..justifyStart();
Equivalent to
Wrap(
alignment: WrapAlignment.start,
);
center
Shorten syntax of alignment
How the children within a run should be placed in the align axis.
Set align axis alignment using WrapAlignment.center.
Example Usage:
NikuWrap()
..center();
Equivalent to
Wrap(
alignment: WrapAlignment.center,
);
justifyCenter
Shorten syntax of alignment
How the children within a run should be placed in the align axis.
Set align axis alignment using WrapAlignment.center.
As a reference to CSS flexbox, justify-content.
Example Usage:
NikuWrap()
..justifyCenter();
Equivalent to
Wrap(
alignment: WrapAlignment.center,
);
end
Shorten syntax of alignment
How the children within a run should be placed in the align axis.
Set align axis alignment using WrapAlignment.end.
Example Usage:
NikuWrap()
..end();
Equivalent to
Wrap(
alignment: WrapAlignment.end,
);
justifyEnd
Shorten syntax of alignment
How the children within a run should be placed in the align axis.
Set align axis alignment using WrapAlignment.end.
As a reference to CSS flexbox, justify-content.
Example Usage:
NikuWrap()
..justifyEnd();
Equivalent to
Wrap(
alignment: WrapAlignment.end,
);
spaceAround
Shorten syntax of alignment
How the children within a run should be placed in the align axis.
Set align axis alignment using WrapAlignment.spaceAround.
Example Usage:
NikuWrap()
..spaceAround();
Equivalent to
Wrap(
alignment: WrapAlignment.spaceAround,
);
spaceBetween
Shorten syntax of alignment
How the children within a run should be placed in the align axis.
Set align axis alignment using WrapAlignment.spaceBetween.
Example Usage:
NikuWrap()
..spaceBetween();
Equivalent to
Wrap(
alignment: WrapAlignment.spaceBetween,
);
spaceEnd
Shorten syntax of alignment
How the children within a run should be placed in the align axis.
Set align axis alignment using WrapAlignment.spaceEnd.
Example Usage:
NikuWrap()
..spaceEnd();
Equivalent to
Wrap(
alignment: WrapAlignment.spaceEnd,
);
spaceEvenly
Shorten syntax of alignment
How the children within a run should be placed in the align axis.
Set align axis alignment using WrapAlignment.spaceEvenly.
Example Usage:
NikuWrap()
..spaceEvenly();
Equivalent to
Wrap(
alignment: WrapAlignment.spaceEvenly,
);
runAlignment
How the children within a run should be placed in the cross axis.
Example Usage:
NikuWrap()
..runAlignment(WrapAlignment.center);
Equivalent to
Wrap(
runAlignment: input,
);
runStart
Shorten syntax of runAlignment
How the children within a run should be placed in the cross axis.
set alignment using WrapAlignment.start.
Example Usage:
NikuWrap()
..runStart();
Equivalent to
Wrap(
runAlignment: WrapAlignment.start,
);
runJustifyStart
Shorten syntax of runAlignment
How the children within a run should be placed in the cross axis.
set alignment using WrapAlignment.start.
As a reference to CSS flexbox, runJustify-content.
Example Usage:
NikuWrap()
..runJustifyStart();
Equivalent to
Wrap(
alignment: WrapAlignment.start,
);
runCenter
Shorten syntax of runAlignment
How the children within a run should be placed in the cross axis.
set alignment using WrapAlignment.center.
Example Usage:
NikuWrap()
..runCenter();
Equivalent to
Wrap(
alignment: WrapAlignment.center,
);
runJustifyCenter
Shorten syntax of runAlignment
How the children within a run should be placed in the cross axis.
set alignment using WrapAlignment.center.
As a reference to CSS flexbox, runJustify-content.
Example Usage:
NikuWrap()
..runJustifyCenter();
Equivalent to
Wrap(
alignment: WrapAlignment.center,
);
runEnd
Shorten syntax of runAlignment
How the children within a run should be placed in the cross axis.
set alignment using WrapAlignment.end.
Example Usage:
NikuWrap()
..runEnd();
Equivalent to
Wrap(
alignment: WrapAlignment.end,
);
runJustifyEnd
Shorten syntax of runAlignment
How the children within a run should be placed in the cross axis.
set alignment using WrapAlignment.end.
As a reference to CSS flexbox, runJustify-content.
Example Usage:
NikuWrap()
..runJustifyEnd();
Equivalent to
Wrap(
alignment: WrapAlignment.end,
);
runSpaceAround
Shorten syntax of runAlignment
How the children within a run should be placed in the cross axis.
set alignment using WrapAlignment.runSpaceAround.
Example Usage:
NikuWrap()
..runSpaceAround();
Equivalent to
Wrap(
alignment: WrapAlignment.runSpaceAround,
);
runSpaceBetween
Shorten syntax of runAlignment
How the children within a run should be placed in the cross axis.
set alignment using WrapAlignment.runSpaceBetween.
Example Usage:
NikuWrap()
..runSpaceBetween();
Equivalent to
Wrap(
alignment: WrapAlignment.runSpaceBetween,
);
runSpaceEnd
Shorten syntax of runAlignment
How the children within a run should be placed in the cross axis.
set alignment using WrapAlignment.runSpaceEnd.
Example Usage:
NikuWrap()
..runSpaceEnd();
Equivalent to
Wrap(
alignment: WrapAlignment.runSpaceEnd,
);
runSpaceEvenly
Shorten syntax of runAlignment
How the children within a run should be placed in the cross axis.
set alignment using WrapAlignment.runSpaceEvenly.
Example Usage:
NikuWrap()
..runSpaceEvenly();
Equivalent to
Wrap(
alignment: WrapAlignment.runSpaceEvenly,
);
crossAxisAlignment
How the children within a run should be aligned relative to each other in the cross axis.
Example Usage:
NikuWrap()
..crossAxisAlignment(WrapCrossAlignment.center);
Equivalent to
Wrap(
crossAxisAlignment: input,
);
cross
Shorten syntax of crossAxisAlignment
How the children within a run should be aligned relative to each other in the cross axis.
Example Usage:
NikuWrap()
..cross(WrapCrossAlignment.center);
Equivalent to
Wrap(
crossAxisAlignment: WrapCrossAlignment.center,
);
crossStart
Shorten syntax of crossAxisAlignment
Set cross axis alignment using WrapCrossAlignment.start.
Example Usage:
NikuWrap()
..crossStart();
Equivalent to
Wrap(
crossAxisAlignment: WrapCrossAlignment.start,
);
itemsStart
Shorten syntax of crossAxisAlignment
Set cross axis alignment using WrapCrossAlignment.start.
As a reference to CSS flexbox, align-items.
Example Usage:
NikuWrap()
..crossStart();
Equivalent to
Wrap(
crossAxisAlignment: WrapCrossAlignment.start,
);
crossCenter
Shorten syntax of crossAxisAlignment
Set cross axis alignment using WrapCrossAlignment.center.
Example Usage:
NikuWrap()
..crossCenter();
Equivalent to
Wrap(
crossAxisAlignment: WrapCrossAlignment.center,
);
itemsCenter
Shorten syntax of crossAxisAlignment
Set cross axis alignment using WrapCrossAlignment.center.
As a reference to CSS flexbox, align-items.
Example Usage:
NikuWrap()
..crossCenter();
Equivalent to
Wrap(
crossAxisAlignment: WrapCrossAlignment.center,
);
crossEnd
Shorten syntax of crossAxisAlignment
Set cross axis alignment using WrapCrossAlignment.end.
Example Usage:
NikuWrap()
..crossEnd();
Equivalent to
Wrap(
crossAxisAlignment: WrapCrossAlignment.end,
);
itemsEnd
Shorten syntax of crossAxisAlignment
Set cross axis alignment using WrapCrossAlignment.end.
As a reference to CSS flexbox, align-items.
Example Usage:
NikuWrap()
..crossEnd();
textDirection
Set whether text is left-to-right or right-to-left direction.
Example Usage:
NikuWrap()
..textDirection(TextDirection.ltr);
Equivalent to
Wrap(
textDirection: input,
);
ltr
Shorten syntax of textDirection
Set whether text is left-to-right or right-to-left direction.
Using TextDirection.ltr.
Example Usage:
NikuWrap()
..ltr();
Equivalent to
Wrap(
textDirection: TextDirection.ltr,
);
rtl
Shorten syntax of textDirection
Set whether text is left-to-right or right-to-left direction.
Using TextDirection.rtl.
Example Usage:
NikuWrap()
..rtl();
Equivalent to
Wrap(
textDirection: TextDirection.rtl,
);
spacing
How much space to place between children in a run in the main axis.
Example Usage:
NikuWrap()
..spacing(8);
Equivalent to
Wrap(
spacing: input,
);
runSpacing
How much space to place between the runs themselves in the cross axis.
Example Usage:
NikuWrap()
..runSpacing(8);
Equivalent to
Wrap(
runSpacing: input,
);
verticalDirection
Determines the order to lay children out vertically and how to interpret start and end in the vertical direction.
Example Usage:
NikuWrap()
..verticalDirection(VerticalDirection.up);
Equivalent to
Wrap(
verticalDirection: input,
);
up
Shorten syntax of verticalDirection
Determines the order to lay children out vertically and how to interpret start and end in the vertical direction.
Using VerticalDirection.up.
Example Usage:
NikuWrap()
..verticalDirection(VerticalDirection.up);
Equivalent to
Wrap(
verticalDirection: VerticalDirection.up,
);
down
Shorten syntax of verticalDirection
Determines the order to lay children out vertically and how to interpret start and end in the vertical direction.
Using VerticalDirection.down.
Example Usage:
NikuWrap()
..verticalDirection(VerticalDirection.down);
Equivalent to
Wrap(
verticalDirection: VerticalDirection.down,
);
clipBehavior
Set clip behavior of widget.
Example Usage:
NikuWrap()
..clipBehavior(Clip.antiAlias);
Equivalent to
Stack(
clipBehavior: input,
);
clip
Shorten syntax of clipBehavior
Set clip behavior of widget.
Example Usage:
NikuWrap()
..clip(Clip.antiAlias);
Equivalent to
Stack(
clipBehavior: input,
);
child
Append child.
Example Usage:
NikuWrap()
..child(
Text("Child")
);
Equivalent to
Wrap(
children: [
# Others children,
input,
]
);
append
Append child.
Example Usage:
NikuWrap()
..child(
Text("Child")
);
Equivalent to
Wrap(
children: [
# Others children,
input,
]
);
appendChild
Append child.
Example Usage:
NikuWrap()
..appendChild(
Text("Child")
);
Equivalent to
Wrap(
children: [
# Others children,
input,
]
);
children
Append children.
Example Usage:
NikuWrap()
..children([
Text("Child")
]);
Equivalent to
Wrap(
children: [
# Others children,
...input,
]
);
appendChildren
Append children.
Example Usage:
NikuWrap()
..appendChildren([
Text("Child")
]);
Equivalent to
Wrap(
children: [
# Others children,
...input,
]
);
prepend
Prepend child.
Example Usage:
NikuWrap()
..child(
Text("Child")
);
Equivalent to
Wrap(
children: [
input,
# Others children,
]
);
prependChild
Prepend child.
Example Usage:
NikuWrap()
..prependChild(
Text("Child")
);
Equivalent to
Wrap(
children: [
input,
# Others children,
]
);
children
Prepend children.
Example Usage:
NikuWrap()
..children([
Text("Child")
]);
Equivalent to
Wrap(
children: [
...input,
# Others children,
]
);
prependChildren
Prepend children.
Example Usage:
NikuWrap()
..prependChildren([
Text("Child")
]);
Equivalent to
Wrap(
children: [
...input,
# Others children,
]
);
insert
Insert child at specific index.
Example Usage:
NikuWrap()
..insert(2, Text("Child"));
Equivalent to
Wrap(
children: [
# Others children,
input,
# Others children,
]
);
insertAll
Insert children at specific index.
Example Usage:
NikuWrap()
..insertAll(2, [
Text("Child"),
Text("Child"),
]);
Equivalent to
Wrap(
children: [
# Others children,
...input,
# Others children,
]
);