The Shoes Manual
Position of a Slot
Like any other element, slots can be styled and customized when they are created.
To set the width of a stack to 150 pixels:
Shoes.app do
stack(width: 150) { para "Now that's precision." }
end
Each style setting also has a method, which can be used to grab that particular setting. (So, like, the width method returns the width of the slot in pixels.)
A shortcut method for setting the :displace_left and :displace_top styles. Displacing is a handy way of moving a slot without altering the layout. In fact, the top and left methods will not report displacement at all. So, generally, displacement is only for temporary animations. For example, jiggling a button in place.
The left and top numbers sent to displace are added to the slot's own top-left coordinates. To subtract from the top-left coordinate, use negative numbers.
The size of the scrollbar area. When Shoes needs to show a scrollbar, the scrollbar may end up covering up some elements that touch the edge of the window. The gutter tells you how many pixels to expect the scrollbar to cover.
This is commonly used to pad elements on the right, like so:
Shoes.app do
stack margin_right: 20 + gutter do
para "Insert fat and ratified declaration of independence here..."
end
end
The vertical size of the viewable slot in pixels. So, if this is a scrolling slot, you'll need to use scroll_height() to get the full size of the slot.
The left pixel location of the slot. Also known as the x-axis coordinate.
Moves the slot to specific coordinates, the (left, top) being the upper left hand corner of the slot.
Removes the slot. It will no longer be displayed and will not be listed in its parent's contents. It's gone.
Is this slot allowed to show a scrollbar? True or false. The scrollbar will only appear if the height of the slot is also fixed.
The vertical size of the full slot, including any of it which is hidden by scrolling.
The top coordinate which this slot can be scrolled down to. The top coordinate of a scroll bar is always zero. The bottom coordinate is the full height of the slot minus one page of scrolling. This bottom coordinate is what scroll_max returns.
This is basically a shortcut for writing slot.scroll_height - slot.height.
To scroll to the bottom of a slot, use slot.scroll_top = slot.scroll_max.
The top coordinate which this slot is scrolled down to. So, if the slot is scrolled down twenty pixels, this method will return 20.
Scrolls the slot to a certain coordinate. This must be between zero and scroll_max.
Calling the style method with no arguments returns a hash of the styles presently applied to this slot.
While methods such as height and width return the true pixel dimensions of the slot, you can use style[:height] or style[:width] to get the dimensions originally requested.
Shoes.app do
@s = stack width: "100%"
para @s.style[:width]
end
In this example, the paragraph under the stack will display the string "100%".
Alter the slot using a hash of style settings. Any of the methods on this page (aside from this method, of course) can be used as a style setting. So, for example, there is a width method, thus there is also a width style.
Shoes.app do
@s = stack { background green }
@s.style(width: 400, height: 200)
end
Hides the slot, if it is shown. Or shows the slot, if it is hidden.
The top pixel location of the slot. Also known as the y-axis coordinate.
The horizontal size of the slot in pixels.
Next: Traversing the Page
