Layout resizers

Layouts resizers describe how an element should be sized within its parent. There are the following types of resizers:

BlLayoutResizer allSubclasses
  

Exact resizer

Exact resizer (BlLayoutExactResizer BlLayoutResizer subclass: #BlLayoutExactResizer instanceVariableNames: 'size' classVariableNames: '' package: 'Bloc-Layouts-Support' ) is the simplest one and tells the parent that its child element wants to be of the exact size within its parent. For example the following produces an element that is (100@100):

element := BlElement new
	background: Color gray;
	constraintsDo: [ :c |
		c horizontal exact: 100.
		c vertical exact: 100 ]
  

Match parent resizer

A child element with a match parent resizer (BlLayoutMatchParentResizer BlLayoutResizer subclass: #BlLayoutMatchParentResizer instanceVariableNames: '' classVariableNames: '' package: 'Bloc-Layouts-Support' ) tries to fill as much space in its parent as possible, of course depending on how much space the parent decides to distribute to that said child. The following example creates an element that occupies all available space in its parent and adjusts its size when parent resizes:

element := BlElement new
	background: Color gray;
	constraintsDo: [ :c |
		c horizontal matchParent.
		c vertical matchParent ]
  

Fit content resizer

It is often desired for an element to occupy enough space to accomodate its content. For example, users might want a text element to be as large as the text itself. In this case, it is neccessary to make sure that the text element fits content using a fit content resizer (BlLayoutFitContentResizer BlLayoutResizer subclass: #BlLayoutFitContentResizer instanceVariableNames: '' classVariableNames: '' package: 'Bloc-Layouts-Support' ):

element := BlTextElement new
	background: Color veryVeryLightGray;
	text: ('Fit content' asRopedText fontSize: 30);
	constraintsDo: [ :c |
		c horizontal fitContent.
		c vertical fitContent ]