Compare commits

..

1 Commits

Author SHA1 Message Date
cb61aca9d4 add setup item description 2025-05-19 09:49:51 +07:00

View File

@ -4,7 +4,7 @@ sidebar_position: 7
# Item Description
Provides players with detailed information about each item in the game.
Provides players with detailed information about each item of the game.
---
@ -16,61 +16,61 @@ Provides players with detailed information about each item in the game.
## Prepare the assets
| Assets | Description |
|--------|-------------|
| ![Info Page Prepare Assets](./img/07-item-description/prepare-assets-1.png) | Used to Setup the background. |
| ![Info Page Prepare Assets](./img/07-item-description/prepare-assets-2.png) | Used to Setup the static symbol. |
| ![Info Page Prepare Assets](./img/07-item-description/prepare-assets-3.png) | Used to Setup the animation symbol. |
| ![Info Page Prepare Assets](./img/07-item-description/prepare-assets-4.png) | Used to Setup the payout/description. |
| ![Info Page Prepare Assets](./img/07-item-description/prepare-assets-1.png) | Used to setup background. |
| ![Info Page Prepare Assets](./img/07-item-description/prepare-assets-2.png) | Used to setup for static symbol. |
| ![Info Page Prepare Assets](./img/07-item-description/prepare-assets-3.png) | Used to setup for animation symbol. |
| ![Info Page Prepare Assets](./img/07-item-description/prepare-assets-4.png) | Used to setup Payout/Description. |
## Setup Prefabs Item Description
| Step | Action | Description | Image Reference |
| :--: | :----- | :---------- | :-------------: |
| 1 | Locate all template prefabs needed for the **Item Description** | Search for the `template-item-description` prefab. | ![Locate Prefabs](./img/07-item-description/prepare-prefabs-1.png) |
| 2 | Clone assets| Copy and paste them to the game assets location, then rename the copied prefabs by removing unnecessary prefixes. | ![Locate Prefabs](./img/07-item-description/prepare-prefabs-2.png) |
| 1 | Locate all template prefabs need for **Item Description** | Search for the `template-item-description` prefab. | ![Locate Prefabs](./img/07-item-description/prepare-prefabs-1.png) |
| 2 | Clone assets| Copy/Pase to game assets location, then rename the copied prefabs by removing unnecessary prefixes. | ![Locate Prefabs](./img/07-item-description/prepare-prefabs-2.png) |
### item-description-small
Setup the `item-description-small` prefab for items have a win payout:
Setup prefab `item-description-small` for item have win payout:
![Locate Prefabs](./img/07-item-description/setup-item-small-overview.png)
| Step | Action | Image Reference |
| :--: | :----- | :-------------: |
| 1 | - Setup the **Sprite Frame** in the `background` using the prepared assets. | <img width="1000"/>![Locate Prefabs](./img/07-item-description/setup-item-small-1.png) |
| 2 | - Name the item prefab following the format item-description-**name**".<br/> - Setup the **Animation Name** to match the item's name in the **Animation Provider**.| ![Locate Prefabs](./img/07-item-description/setup-item-small-2.png) |
| 3 | - Setup the **Sprite Frame** in the `sprite-item` using the same name as the item from the prepared assets. | ![Locate Prefabs](./img/07-item-description/setup-item-small-3.png) |
| 4 | - Adjust **Color**, **Font** and **Font Size** in `multi-x...` and `oods-x...` according to the game design.<br/> - Use [Bitmap Font Creator](http://localhost:3000/docs/category/game-asset-structure) if you need to create a Bitmap Font.| ![Locate Prefabs](./img/07-item-description/setup-item-small-4.png) |
| 1 | - Setup **Sprite Frame** in `background` from prepared assets. | <img width="1000"/>![Locate Prefabs](./img/07-item-description/setup-item-small-1.png) |
| 2 | - Setup Item with prefab name follow format item-description-**name**".<br/> - Setup **Animation Name** with animation name of item in **Animation Provider**.| ![Locate Prefabs](./img/07-item-description/setup-item-small-2.png) |
| 3 | - Setup **Sprite Frame** in `sprite-item` same name with item from prepared assets. | ![Locate Prefabs](./img/07-item-description/setup-item-small-3.png) |
| 4 | - Change **Color**, **Font** and **Font Size** in `multi-x...` and `oods-x...` follow the game design.<br/> - Use [Bitmap Font Creator](http://localhost:3000/docs/category/game-asset-structure) to create Font Bitmap if you need it.| ![Locate Prefabs](./img/07-item-description/setup-item-small-4.png) |
### item-description-no-odds
Setup the `item-description-no-odds` prefab for items that have a description but no win payout:
Setup prefab `item-description-no-odds` for item have description without win payout:
![Locate Prefabs](./img/07-item-description/setup-item-no-odds-overview.png)
| Step | Action | Image Reference |
| :--: | :----- | :-------------: |
| 1 | - Setup the **Sprite Frame** in the `background` using the prepared assets. | <img width="1000"/>![Locate Prefabs](./img/07-item-description/setup-item-no-odds-1.png) |
| 2 | - Name the item prefab following the format item-description-**name**".<br/> - Setup **Animation Name** to match the item's name in the **Animation Provider**.| ![Locate Prefabs](./img/07-item-description/setup-item-no-odds-2.png) |
| 3 | - Setup the **Sprite Frame** in the `sprite-item` using the same name as the item from the prepared assets. | ![Locate Prefabs](./img/07-item-description/setup-item-no-odds-3.png) |
| 4 | - Set the **String** and adjust **Color**, **Font** and **Font Size** in the `description` according to the game design.<br/> - Use [Bitmap Font Creator](http://localhost:3000/docs/category/game-asset-structure) if you need to create a Bitmap Font. | ![Locate Prefabs](./img/07-item-description/setup-item-no-odds-4.png) |
| 1 | - Setup **Sprite Frame** in `background` from prepared assets. | <img width="1000"/>![Locate Prefabs](./img/07-item-description/setup-item-no-odds-1.png) |
| 2 | - Setup Item with prefab name follow format item-description-**name**".<br/> - Setup **Animation Name** with animation name of item in **Animation Provider**.| ![Locate Prefabs](./img/07-item-description/setup-item-no-odds-2.png) |
| 3 | - Setup **Sprite Frame** in `sprite-item` same name with item from prepared assets. | ![Locate Prefabs](./img/07-item-description/setup-item-no-odds-3.png) |
| 4 | - Setup **String**, change **Color**, **Font** and **Font Size** in `description` follow the game design.<br/> - Use [Bitmap Font Creator](http://localhost:3000/docs/category/game-asset-structure) to create Font Bitmap if you need it.| ![Locate Prefabs](./img/07-item-description/setup-item-no-odds-4.png) |
### item-description-big
Setup the `item-description-big` prefab for items that include both a win payout and a description:
Setup prefab `item-description-big` for item have win payout and description:
![Locate Prefabs](./img/07-item-description/setup-item-big-overview.png)
| Step | Action | Image Reference |
| :--: | :----- | :-------------: |
| 1 | - Setup the **Sprite Frame** in the `background` using the prepared assets. | <img width="1000"/>![Locate Prefabs](./img/07-item-description/setup-item-big-1.png) |
| 2 | - Setup the payout by following **Step 4** in **Setup prefab `item-description-small`** | [Configure Item Description Small](./item-description#item-description-small) | |
| 3 | - Setup the description by following **Step 4** in **Setup prefab `item-description-no-odds`** | [Configure Item Description No Odds](./item-description#item-description-no-odds) | |
| 1 | - Setup **Sprite Frame** in `background` from prepared assets. | <img width="1000"/>![Locate Prefabs](./img/07-item-description/setup-item-big-1.png) |
| 2 | - Setup Payout for item, we do **Step 4** in **Setup prefab `item-description-small`** | [Configure Item Description Small](./item-description#item-description-small) | |
| 3 | - Setup Payout for item, we do **Step 4** in **Setup prefab `item-description-no-odds`** | [Configure Item Description No Odds](./item-description#item-description-no-odds) | |
:::tip
Use Helper to setup:
1. Setup **Content Size** and **Cell Item Size** according to the game design.
2. Use prepared bitmap fonts to Setup the **Labels** font.
3. Click **Set Size** to run the helper.
4. Setup the **Background**, **Sprite Frame**, **Animation**, **Payout**, **Description** of the item using the prepared assets.
1. Setup **Content Size** and **Cell Item Size** follow game design.
2. Use prepared fonts (Bitmap) to setup **Labels** font.
3. Click **Set Size** to run helper.
4. Setup **Background**, **Sprite Frame**, **Animation**, **Payout**, **Description** of item from prepared assets.
![Locate Prefabs](./img/07-item-description/setup-item-helper.png)
:::