/ 
Clay-UI-0.06
/ Clay::UI::Grid::Cell

NAME

Clay::UI::Grid::Cell - styled cell container for Clay::UI::Grid

SYNOPSIS

use v5.22;
use Object::Pad;
use Clay::XS qw(padding_all CLAY_ALIGN_X_RIGHT);
use Clay::UI;
use Clay::UI::Grid;
use Clay::UI::Grid::Cell;
use Clay::UI::Text;

class My::Grid  :strict(params) :does(Clay::UI::Grid) {}
class My::Label :strict(params) :does(Clay::UI::Text) {}

my $header = Clay::UI::Grid::Cell->new(
	layout           => { padding => padding_all(8) },
	background_color => [55, 90, 140, 255],
);
$header->add_child(My::Label->new(text => 'Total'));

my $value = Clay::UI::Grid::Cell->new(
	layout => {
		padding         => padding_all(8),
		child_alignment => { x => CLAY_ALIGN_X_RIGHT },
	},
	background_color => [30, 30, 30, 255],
);
$value->add_child(My::Label->new(text => '1,234.00'));

my $grid = My::Grid->new(id => 'report');
$grid->append_row([ $header, $value ]);

my $ui = Clay::UI->new(width => 800, height => 600, root => $grid);
my $commands = $ui->render;

DESCRIPTION

Clay::UI::Grid::Cell is a ready-to-use class (not a role) for one cell of a Clay::UI::Grid. Pass it in a row to style the cell or to align its content; the grid uses it as the cell itself and writes the column and row group ids on it, so its background, border and padding cover exactly the column width and the row height. See "CELLS AND WRAPPED WIDGETS" in Clay::UI::Grid.

The grid also creates unstyled Clay::UI::Grid::Cell objects itself, around every widget you pass that is not a cell.

A cell is a container with layout and style, but without floating and without fire_event. It composes:

For a cell with more abilities (floating, events, interaction), write a class of your own that composes Clay::UI::Role::Layout::GridCell.

CONSTRUCTOR PARAMETERS

The class is :strict(params): an unknown parameter dies.

layout

How the cell sizes itself and places its content; see "layout" in Clay::UI::Role::Layout::HasLayout. Default {} (FIT on both axes). The width sizing changes the column; see "CELLS AND WRAPPED WIDGETS" in Clay::UI::Grid.

background_color

See "background_color" in Clay::UI::Role::Style::HasBackground.

border_color

See "border_color" in Clay::UI::Role::Style::HasBorder.

border_width

See "border_width" in Clay::UI::Role::Style::HasBorder.

corner_radius

See "corner_radius" in Clay::UI::Role::Style::HasCornerRadius.

id

See "id" in Clay::UI::Role::Core::Element.

width_group

Normally left alone: the grid writes its column id here. A non-zero id you give stays, and the cell then takes part in your group instead of the column; see "Overriding group ids" in Clay::UI::Grid and "width_group" in Clay::UI::Role::Layout::HasSizingGroup.

height_group

Like "width_group", for the row.

All of them are read/write accessors as well, as documented in the linked roles.

SEE ALSO

Clay::UI::Grid, Clay::UI::Role::Layout::GridCell, Clay::UI::Box.