- Anima for Sketch
- Install Plugin
- Create a Project
- Preview & Sync Project
- Upgrade a Team
- Tutorial Files
- Stacks (Flexbox)
- Screen Presets
- Keyboard Shortcuts
- Install Plugin
- Set Homepage
- Hover Effects
- Entrance Animation
- Fixed Position
- Text Input & Forms
- Embed Code
- Interaction & Animation
- Interactions Intro
- Collaborate In Teams
- Export Sketch to HTML
- Publish Your Website
- Manage Website
- Custom Domains
- Manage Access Levels
Built with ❤️   in NYC & TLV
A Stack is a special type of Group that defines the layout of its child Layers.
To Stack layers or groups, select them and click the Stack button in Layout panel.
A Stack has 3 properties:
- Direction: Defines if stacking of child Layers is Horizontal or Vertical
- Alignment: Can be Top/Center/Bottom/Spread
- Spacing: Defines the spacing between each child Layer
Defines if stacking of child Layers is Horizontal or Vertical.
Can be Top/Center/Bottom/Spread
Defines the spacing between each child Layer.
When you hide a layer, or override a symbol to ‘none’, the stack will ignore it while rearranging the other layers.
Notice how in the example below, the Body Layer replaces the space of the hidden Subtitle Layer when collpasing is checked in.
Stacks can be nested within other Stacks.
If you have a single Stack Group as a Symbol, it will resize the Symbol instance for Overrides. This is optional, but default for new Stacks is On.
You can use negative values. Main use-case here is overlapping border.
Click the spacing label and drag it to the sides for easier use.
Scaling Text Background
Sample Sketch File: Download
Note: Some of these tutorials use an older Anima interface.
Walkthrough Video (29:09) by Pablo Stanley
Questions? Join our Community