--- sidebar_position: 2 --- # Set Up Reel Slot --- 1. Prepare the asset for symbols and reel frame. ![Add Symbol Texture](../img/05-main-scene/add-symbol-texture.png) ![Add Symbol Texture](../img/05-main-scene/add-reel-frame.png) 2. Add symbols to **SpriteFrameProvider** which allows those symbols to be accessed globally from the code. ![Sprite Frame Provider](../img/05-main-scene/sprite-frame-provider.png) 3. Add reel frame. ![Sprite Frame Provider](../img/05-main-scene/add-reel-frame-2.png) ![Sprite Frame Provider](../img/05-main-scene/reel-frame.png) 4. Config reel slot using `reel-scroller-helper`. ![Reel Scroller Helper](../img/05-main-scene/reel-scroller-helper.png) | Properties | Explaination | Example | |------------|--------------|---------| |**Cell Item Script Name**|The name of the script will be attached to each cell item.|![cell-item-script-name](../img/05-main-scene/hyper-cell-item.png)| | **Scroller Script Name** | the name of the script for handling the spinning logic.|![scroller](../img/05-main-scene/scroller.png)| |**Row Count x Reel Count**| the number of Slot Item each row and column in the reel slot panel.|![reel-row-column](../img/05-main-scene/reel-row-column.png)| |**Cell Size**| the size of each cells.|![cell-size](../img/05-main-scene/cell-size.png)| |**Cell Spacing**| the distance between each cells horizontally and vertically.|| |**Cell Dim Color**| set the dark color for the non-win cells when showing winning animation for each line.|![dim-cell-color](../img/05-main-scene/dim-cell-color.png)| |**Top Count and Bot Count**| for spinning logic to work, a certain number of cell will be added to the top and bottom of the reel.|![cell-top-bottom](../img/05-main-scene/cell-top-bottom.png)| 5. Generate panel using `reel-scroller-helper`. ![Generate Panel](../img/05-main-scene/generate-panel.png) :::tip There is a popup panel covering the entire game scene. You should turn off this panel to see the other component clearly. :::