Niku Column

Style property builder for building "Column".

Example usage:

As Widget

NikuColumn([
  Text("1"),
  Text("2"),
])
  ..mainStart();

As Property

Column(
  children: [
    Text("1"),
    Text("2"),
  ]
)
  .asNiku()
  ..mainStart();

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/column.dart';

niku

Switch to use parent property builder.

Example Usage:

NikuColumn()
  .niku();

Equivalent to

Niku(
  Column(),
);

mainAxisAlignment

Set main axis alignment.

Example Usage:

NikuColumn()
  ..mainAxisAlignment(MainAxisAlignment.center);

Equivalent to

Column(
  mainAxisAlignment: MainAxisAlignment.center,
);

mainAxis

Shorten syntax of mainAxisAlignment

Set main axis alignment.

Example Usage:

NikuColumn()
  ..mainAxis(MainAxisAlignment.center);

Equivalent to

Column(
  mainAxisAlignment: MainAxisAlignment.center,
);

mainStart

Shorten syntax of mainAxisAlignment

Set main axis alignment using MainAxisAlignment.start.

Example Usage:

NikuColumn()
  ..mainStart();

Equivalent to

Column(
  mainAxisAlignment: MainAxisAlignment.start,
);

justifyStart

Shorten syntax of mainAxisAlignment

Set main axis alignment using MainAxisAlignment.start.

As a reference to CSS flexbox, justify-content.

Example Usage:

NikuColumn()
  ..justifyStart();

Equivalent to

Column(
  mainAxisAlignment: MainAxisAlignment.start,
);

mainCenter

Shorten syntax of mainAxisAlignment

Set main axis alignment using MainAxisAlignment.center.

Example Usage:

NikuColumn()
  ..mainCenter();

Equivalent to

Column(
  mainAxisAlignment: MainAxisAlignment.center,
);

justifyCenter

Shorten syntax of mainAxisAlignment

Set main axis alignment using MainAxisAlignment.center.

As a reference to CSS flexbox, justify-content.

Example Usage:

NikuColumn()
  ..justifyCenter();

Equivalent to

Column(
  mainAxisAlignment: MainAxisAlignment.center,
);

mainEnd

Shorten syntax of mainAxisAlignment

Set main axis alignment using MainAxisAlignment.end.

Example Usage:

NikuColumn()
  ..mainEnd();

Equivalent to

Column(
  mainAxisAlignment: MainAxisAlignment.end,
);

justifyEnd

Shorten syntax of mainAxisAlignment

Set main axis alignment using MainAxisAlignment.end.

As a reference to CSS flexbox, justify-content.

Example Usage:

NikuColumn()
  ..justifyEnd();

Equivalent to

Column(
  mainAxisAlignment: MainAxisAlignment.end,
);

spaceAround

Shorten syntax of mainAxisAlignment

Set main axis alignment using MainAxisAlignment.spaceAround.

Example Usage:

NikuColumn()
  ..spaceAround();

Equivalent to

Column(
  mainAxisAlignment: MainAxisAlignment.spaceAround,
);

spaceBetween

Shorten syntax of mainAxisAlignment

Set main axis alignment using MainAxisAlignment.spaceBetween.

Example Usage:

NikuColumn()
  ..spaceBetween();

Equivalent to

Column(
  mainAxisAlignment: MainAxisAlignment.spaceBetween,
);

spaceEnd

Shorten syntax of mainAxisAlignment

Set main axis alignment using MainAxisAlignment.spaceEnd.

Example Usage:

NikuColumn()
  ..spaceEnd();

Equivalent to

Column(
  mainAxisAlignment: MainAxisAlignment.spaceEnd,
);

spaceEvenly

Shorten syntax of mainAxisAlignment

Set main axis alignment using MainAxisAlignment.spaceEvenly.

Example Usage:

NikuColumn()
  ..spaceEvenly();

Equivalent to

Column(
  mainAxisAlignment: MainAxisAlignment.spaceEvenly,
);

crossAxisAlignment

Set cross axis alignment.

Example Usage:

NikuColumn()
  ..crossAxisAlignment(CrossAxisAlignment.center);

Equivalent to

Column(
  crossAxisAlignment: CrossAxisAlignment.center,
);

crossAxis

Shorten syntax of crossAxisAlignment

Set cross axis alignment.

Example Usage:

NikuColumn()
  ..crossAxis(CrossAxisAlignment.center);

Equivalent to

Column(
  crossAxisAlignment: CrossAxisAlignment.center,
);

crossStart

Shorten syntax of crossAxisAlignment

Set cross axis alignment using CrossAxisAlignment.start.

Example Usage:

NikuColumn()
  ..crossStart();

Equivalent to

Column(
  crossAxisAlignment: CrossAxisAlignment.start,
);

itemsStart

Shorten syntax of crossAxisAlignment

Set cross axis alignment using CrossAxisAlignment.start.

As a reference to CSS flexbox, align-items.

Example Usage:

NikuColumn()
  ..crossStart();

Equivalent to

Column(
  crossAxisAlignment: CrossAxisAlignment.start,
);

crossCenter

Shorten syntax of crossAxisAlignment

Set cross axis alignment using CrossAxisAlignment.center.

Example Usage:

NikuColumn()
  ..crossCenter();

Equivalent to

Column(
  crossAxisAlignment: CrossAxisAlignment.center,
);

itemsCenter

Shorten syntax of crossAxisAlignment

Set cross axis alignment using CrossAxisAlignment.center.

As a reference to CSS flexbox, align-items.

Example Usage:

NikuColumn()
  ..crossCenter();

Equivalent to

Column(
  crossAxisAlignment: CrossAxisAlignment.center,
);

crossEnd

Shorten syntax of crossAxisAlignment

Set cross axis alignment using CrossAxisAlignment.end.

Example Usage:

NikuColumn()
  ..crossEnd();

Equivalent to

Column(
  crossAxisAlignment: CrossAxisAlignment.end,
);

itemsEnd

Shorten syntax of crossAxisAlignment

Set cross axis alignment using CrossAxisAlignment.end.

As a reference to CSS flexbox, align-items.

Example Usage:

NikuColumn()
  ..crossEnd();

baseline

Shorten syntax of crossAxisAlignment

Set cross axis alignment using CrossAxisAlignment.baseline.

Example Usage:

NikuColumn()
  ..baseline();

Equivalent to

Column(
  crossAxisAlignment: CrossAxisAlignment.baseline,
);

stretch

Shorten syntax of crossAxisAlignment

Set cross axis alignment using CrossAxisAlignment.stretch.

Example Usage:

NikuColumn()
  ..stretch();

Equivalent to

Column(
  crossAxisAlignment: CrossAxisAlignment.stretch,
);

textDirection

Set whether text is left-to-right or right-to-left direction.

Example Usage:

NikuColumn()
  ..textDirection(TextDirection.ltr);

Equivalent to

Column(
  textDirection: input,
);

ltr

Shorten syntax of textDirection

Set whether text is left-to-right or right-to-left direction.

Using TextDirection.ltr.

Example Usage:

NikuColumn()
  ..ltr();

Equivalent to

Column(
  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:

NikuColumn()
  ..rtl();

Equivalent to

Column(
  textDirection: TextDirection.rtl,
);

verticalDirection

A direction in which boxes flow vertically.

Example Usage:

NikuColumn()
  ..verticalDirection(VerticalDirection.up);

Equivalent to

Column(
  verticalDirection: input,
);

up

Shorten syntax of verticalDirection

A direction in which boxes flow vertically.

Using VerticalDirection.up.

Example Usage:

NikuColumn()
  ..verticalDirection(VerticalDirection.up);

Equivalent to

Column(
  verticalDirection: VerticalDirection.up,
);

down

Shorten syntax of verticalDirection

A direction in which boxes flow vertically.

Using VerticalDirection.down.

Example Usage:

NikuColumn()
  ..verticalDirection(VerticalDirection.down);

Equivalent to

Column(
  verticalDirection: VerticalDirection.down,
);

textBaseline

The common baseline that should be aligned between this text span and its parent text span, or, for the root text spans, with the line box.

Example Usage:

NikuColumn()
  ..textBaseline(TextBaseline.alphabetic);

Equivalent to

Column(
  textBaseline: input,
);

alphabetic

Shorten syntax of textBaseline

The common baseline that should be aligned between this text span and its parent text span, or, for the root text spans, with the line box.

Using TextBaseline.alphabetic

Example Usage:

NikuColumn()
  ..alphabetic();

Equivalent to

Column(
  textBaseline: TextBaseline.alphabetic,
);

ideographic

Shorten syntax of textBaseline

The common baseline that should be aligned between this text span and its parent text span, or, for the root text spans, with the line box.

Using TextBaseline.alphabetic

Example Usage:

NikuColumn()
  ..ideographic();

Equivalent to

Column(
  textBaseline: TextBaseline.ideographic,
);

child

Append child.

Example Usage:

NikuColumn()
  ..child(
    Text("Child")
  );

Equivalent to

Column(
  children: [
    # Others children,
    input,
  ]
);

append

Append child.

Example Usage:

NikuColumn()
  ..child(
    Text("Child")
  );

Equivalent to

Column(
  children: [
    # Others children,
    input,
  ]
);

appendChild

Append child.

Example Usage:

NikuColumn()
  ..appendChild(
    Text("Child")
  );

Equivalent to

Column(
  children: [
    # Others children,
    input,
  ]
);

children

Append children.

Example Usage:

NikuColumn()
  ..children([
    Text("Child")
  ]);

Equivalent to

Column(
  children: [
    # Others children,
    ...input,
  ]
);

appendChildren

Append children.

Example Usage:

NikuColumn()
  ..appendChildren([
    Text("Child")
  ]);

Equivalent to

Column(
  children: [
    # Others children,
    ...input,
  ]
);

prepend

Prepend child.

Example Usage:

NikuColumn()
  ..child(
    Text("Child")
  );

Equivalent to

Column(
  children: [
    input,
    # Others children,
  ]
);

prependChild

Prepend child.

Example Usage:

NikuColumn()
  ..prependChild(
    Text("Child")
  );

Equivalent to

Column(
  children: [
    input,
    # Others children,
  ]
);

children

Prepend children.

Example Usage:

NikuColumn()
  ..children([
    Text("Child")
  ]);

Equivalent to

Column(
  children: [
    ...input,
    # Others children,
  ]
);

prependChildren

Prepend children.

Example Usage:

NikuColumn()
  ..prependChildren([
    Text("Child")
  ]);

Equivalent to

Column(
  children: [
    ...input,
    # Others children,
  ]
);

insert

Insert child at specific index.

Example Usage:

NikuColumn()
  ..insert(2, Text("Child"));

Equivalent to

Column(
  children: [
    # Others children,
    input,
    # Others children,
  ]
);

insertAll

Insert children at specific index.

Example Usage:

NikuColumn()
  ..insertAll(2, [
    Text("Child"),
    Text("Child"),
  ]);

Equivalent to

Column(
  children: [
    # Others children,
    ...input,
    # Others children,
  ]
);