Merge remote-tracking branch 'origin/feature/add-git-using' into feature/20250521-update-doc
@ -5,48 +5,62 @@ sidebar_position: 10
|
|||||||
|
|
||||||
The bottom bar UI on desktop provides a functional interface for gameplay control
|
The bottom bar UI on desktop provides a functional interface for gameplay control
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
### Overview
|
### Overview
|
||||||
- Full bottom bar with all controls visible
|
- Full bottom bar with all controls visible
|
||||||
- Horizontal layout maximizing screen width
|
- Horizontal layout maximizing screen width
|
||||||
|
|
||||||

|
---
|
||||||
|
|
||||||
## Implementation
|
## Prepare Prefabs
|
||||||
|
|
||||||
### Step 1: Set Up Prefab Editor
|
### Step 1: ui-bottom-bar-panel
|
||||||
|
|
||||||
| Step | Action | image |
|
**Copy** `template-new-ui-bottom-bar-panel`
|
||||||
|------|---------|--------------|
|
from `assets\core-assets\hyper-core\packages\ui\desktop-ui\prefabs\template-ui-bottom-bar-panel`
|
||||||
| 1. Locate Prefab | Search for `ui-bottom-bar-panel` prefab |  |
|
|
||||||
| 2. Find Assets | Navigate to `core/editor` directory |  |
|

|
||||||
| 3. Clone Assets | Copy / Paste to game assets location |  |
|
|
||||||
|
**Past & rename** `assets\game-assets\prefabs\ui-bottom-bar-panel.prefab`
|
||||||
|
:::warning
|
||||||
|
Must rename to **ui-bottom-bar-panel**
|
||||||
|
:::
|
||||||
|
|
||||||
|

|
||||||
|
|
||||||
|
|
||||||
|
### Step 2: template-label
|
||||||
|
|
||||||
|
**Copy 2 prefab** `template-label-auto-selection` & `template-label-title`
|
||||||
|
|
||||||
|
**From** `assets\core-assets\hyper-core\packages\ui\desktop-ui\editor\`
|
||||||
|
|
||||||
|

|
||||||
|
|
||||||
|
**To** `assets\game-assets\editor\bottom-ui\`
|
||||||
|
|
||||||
|

|
||||||
|
|
||||||
|
### Step 3: template-label-auto-selection
|
||||||
|
|
||||||
|
**To and rename** `template-label-auto-selection` & `template-label-title`
|
||||||
|
|
||||||
|
From `assets\core-assets\hyper-core\packages\ui\desktop-ui\prefabs\`
|
||||||
|
|
||||||
|

|
||||||
|
|
||||||
|
**To** `assets\game-assets\prefabs\`
|
||||||
|
|
||||||
|
:::warning
|
||||||
|
Must rename to **button-auto-selection**
|
||||||
|
:::
|
||||||
|
|
||||||
|

|
||||||
|
|
||||||
---
|
---
|
||||||
|
|
||||||
### Step 2: Configure Prefabs
|
## Edit prefab
|
||||||
|
|
||||||
#### Core Prefabs Structure
|
### Step 1: button-auto-selection
|
||||||
Navigate to the location where the prefabs: `assets\core-assets\hyper-core\packages\ui\desktop-ui\prefabs\`
|
|
||||||

|
|
||||||
|
|
||||||
#### Rename Prefabs
|
|
||||||
Rename the copied prefabs by removing unnecessary prefixes:
|
|
||||||
| Prefix to Remove | Original Prefab Name | Final Name |
|
|
||||||
|------------------|----------------------|------------|
|
|
||||||
| `template-new-` | `template-new-ui-bottom-bar-panel` | `ui-bottom-bar-panel` |
|
|
||||||
| `template-` | `template-button-auto-selection` | `button-auto-selection` |
|
|
||||||
|
|
||||||
|
|
||||||
```jsx title="The folder structure is as follows:"
|
|
||||||
assets\game-assets\prefabs
|
|
||||||
```
|
|
||||||
|
|
||||||
|
|
||||||

|
|
||||||
|
|
||||||
#### Customize *`button-auto-selection`* Label
|
|
||||||
|
|
||||||
**Follow Design:**
|
**Follow Design:**
|
||||||
Use the `template-label-auto-selection` to customize the appearance of the label inside the `button-auto-selection` prefab.
|
Use the `template-label-auto-selection` to customize the appearance of the label inside the `button-auto-selection` prefab.
|
||||||
@ -59,10 +73,11 @@ Use the `template-label-auto-selection` to customize the appearance of the label
|
|||||||
|
|
||||||

|

|
||||||
|
|
||||||
#### Customize *`ui-bottom-bar-panel`* Label
|
### Step 2: template-label-title
|
||||||
|
|
||||||
Use `assets\game-assets\editor\bottom-ui\template-label-title` to customize the `ui-bottom-bar-panel`:
|
Use `assets\game-assets\editor\bottom-ui\template-label-title` to customize the `ui-bottom-bar-panel`:
|
||||||
:::info
|
:::info
|
||||||
🔗[Follow the same configuration as Button Auto Selection Labels](#customize-button-auto-selection-label)
|
🔗[Follow the same configuration as button-auto-selection](#edit-prefab)
|
||||||
Bottom bar labels include a localization component for multi-language support
|
Bottom bar labels include a localization component for multi-language support
|
||||||
:::
|
:::
|
||||||
|
|
||||||
@ -77,29 +92,33 @@ The `FormatText` property controls text formatting behavior for label components
|
|||||||
|
|
||||||
---
|
---
|
||||||
|
|
||||||
### Step 3: Set Up UI In Main Scenes
|
## Setup Main Scene
|
||||||
|
|
||||||
Create new node and configuration in your main scene:
|
**Create new node** and **configuration** in your main scene:
|
||||||

|
|
||||||
|
|
||||||
#### Platform Node Spawner Settings
|

|
||||||
|
|
||||||
🔗 Details: [Platform Node Spawner](http://localhost:3000/docs/faqs/setup-cocos-scene#platform-node-spawner)
|
🔗 Details: [Platform Node Spawner](http://localhost:3000/docs/faqs/setup-cocos-scene#platform-node-spawner)
|
||||||
|
|
||||||
### Step 4: Apply Textures
|
**Position Y** : normally is -415
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## Apply Textures
|
||||||
|
|
||||||
|
**Checklist assets** completed for bottom UI and button UI text
|
||||||
|
|
||||||
#### Texture Button Bar
|
|
||||||
Checklist assets completed for bottom UI and button UI text
|
|
||||||
:::info
|
:::info
|
||||||
🔗 Details: [Game Asset Structure](http://localhost:3000/docs/category/game-asset-structure)
|
🔗 Details: [Game Asset Structure](http://localhost:3000/docs/category/game-asset-structure)
|
||||||
:::
|
:::
|
||||||

|

|
||||||
|
|
||||||
#### Run the Helper Tool
|
**Run the Helper Tool** to configure the bottom bar UI helper.
|
||||||
|
|
||||||
To configure the bottom bar UI helper.
|
|
||||||
:::info
|
:::info
|
||||||
🔗Details: [UI Bottom Bar Desktop Helper](http://localhost:3000/docs/submodule/hyper-editor-package#mobile-ui-helper)
|
🔗Details: [UI Bottom Bar Desktop Helper](http://localhost:3000/docs/submodule/hyper-editor-package#mobile-ui-helper)
|
||||||
:::
|
:::
|
||||||
|
|
||||||
|

|
||||||
|
|
||||||
|
|
||||||
---
|
---
|
After Width: | Height: | Size: 8.9 KiB |
After Width: | Height: | Size: 3.7 KiB |
After Width: | Height: | Size: 11 KiB |
After Width: | Height: | Size: 7.9 KiB |
After Width: | Height: | Size: 4.0 KiB |
After Width: | Height: | Size: 6.1 KiB |
BIN
docs/git-using.rar
Normal file
136
docs/git-using/01-git-using.md
Normal file
@ -0,0 +1,136 @@
|
|||||||
|
# USING FORK
|
||||||
|
|
||||||
|
---
|
||||||
|
### AMEND
|
||||||
|
|
||||||
|
**BEFORE**
|
||||||
|
|
||||||
|
You already push some file and want to add more to this commit.
|
||||||
|
|
||||||
|

|
||||||
|
|
||||||
|
Your local change
|
||||||
|
|
||||||
|

|
||||||
|
|
||||||
|
**AFTER**
|
||||||
|
|
||||||
|
You can see all file local change will appear in your commit.
|
||||||
|
|
||||||
|

|
||||||
|
|
||||||
|
#### Step1: Stage all your local change
|
||||||
|
|
||||||
|

|
||||||
|
|
||||||
|
#### Step2: Check Amend & Click Amend Last Commit
|
||||||
|
|
||||||
|

|
||||||
|
|
||||||
|
---
|
||||||
|
### REBASE
|
||||||
|
|
||||||
|
**BEFORE**
|
||||||
|
|
||||||
|

|
||||||
|
|
||||||
|
**AFTER**
|
||||||
|
|
||||||
|

|
||||||
|
|
||||||
|
#### Step1: Amend or Commit all your local change.
|
||||||
|
#### Step2: Right click rebase where you want
|
||||||
|
|
||||||
|

|
||||||
|
|
||||||
|
#### Step2: Click rebase
|
||||||
|
|
||||||
|

|
||||||
|
:::warning
|
||||||
|
If you missing step 1, this popup will appear. Back to step 1 and do it again.
|
||||||
|

|
||||||
|
:::
|
||||||
|
|
||||||
|
#### Step3: Finish.
|
||||||
|
:::warning
|
||||||
|
With no conflict, you can see the result like image After.
|
||||||
|
|
||||||
|
If conflict, scroll down to check how to **RESOLVE CONFLICT**
|
||||||
|
:::
|
||||||
|
---
|
||||||
|
### DROP COMMIT
|
||||||
|
In this case: I want to create **PullRequest** merge to **develop** but only commit **test2**.
|
||||||
|
My branch **feature/test2** must split from **develop** and only have one commit **test2**.
|
||||||
|
|
||||||
|
**BEFORE**
|
||||||
|
|
||||||
|

|
||||||
|
|
||||||
|
**AFTER**
|
||||||
|
|
||||||
|

|
||||||
|
|
||||||
|
#### Step1: Amend or Commit all your local change.
|
||||||
|
|
||||||
|
#### Step2:
|
||||||
|
|
||||||
|

|
||||||
|
|
||||||
|
#### Step3:
|
||||||
|
|
||||||
|

|
||||||
|
|
||||||
|
#### Step4: Click rebase.
|
||||||
|
|
||||||
|
|
||||||
|
---
|
||||||
|
### CONFLICT RESOLVE
|
||||||
|
|
||||||
|
:::warning
|
||||||
|
Any time in this step, if you see many problem and can't resolve conflict.
|
||||||
|
Click this button to exit what are you doing. And try another way.
|
||||||
|
|
||||||
|

|
||||||
|
|
||||||
|
:::
|
||||||
|
|
||||||
|
|
||||||
|
When you meet this warning:
|
||||||
|
|
||||||
|

|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
Step1: Click **Local Change**
|
||||||
|
Step2: Select version you want
|
||||||
|
Step3: Click Choose
|
||||||
|
:::warning
|
||||||
|
If you have multi file conflict. All files will appear in *Unstaged**
|
||||||
|
You have to resolve all these files.
|
||||||
|
:::
|
||||||
|
|
||||||
|
Step3: Click **Continue Rebase**
|
||||||
|
|
||||||
|
|
||||||
|

|
||||||
|
|
||||||
|
|
||||||
|
---
|
||||||
|
### PUSH FAIL
|
||||||
|
|
||||||
|

|
||||||
|
|
||||||
|
If you see this image, It's mean you already push it.
|
||||||
|
|
||||||
|

|
||||||
|
|
||||||
|
**2 ways to fix it **
|
||||||
|
|
||||||
|
**Rebase to old commit** and resolve conflict to keep all file in old version.
|
||||||
|
|
||||||
|

|
||||||
|
|
||||||
|
**Force Push** to remove old version branch in git & using this branch like newest.
|
||||||
|
|
||||||
|

|
||||||
|
|
13
docs/git-using/02-tip-setup-spin-panel.md
Normal file
@ -0,0 +1,13 @@
|
|||||||
|
# TIP SETUP SPIN PANEL
|
||||||
|
|
||||||
|
Add reel-bg for each reel
|
||||||
|
Add reel-frame
|
||||||
|
Setting spacing: layout (reels-frame node)
|
||||||
|
Find size item:
|
||||||
|
+Heigh: average item size => 220. Set spin-panel
|
||||||
|
+Width: size reel-bg = 240 + setting spacing(20) = 260
|
||||||
|
|
||||||
|
landing-panel
|
||||||
|
present-win-cell-panel
|
||||||
|
present-win-border-panel
|
||||||
|
item-description
|
7
docs/git-using/03-test special-win.md
Normal file
@ -0,0 +1,7 @@
|
|||||||
|
# TIP TEST SPECIAL WIN
|
||||||
|
|
||||||
|
You have to test a lot when working on localization.
|
||||||
|
|
||||||
|
By this way, every time you spin will display all special-win.
|
||||||
|
|
||||||
|

|
33
docs/git-using/04-work-flow.md
Normal file
@ -0,0 +1,33 @@
|
|||||||
|
# WORK FLOW
|
||||||
|
|
||||||
|
## Team VN
|
||||||
|
|
||||||
|
_Create Issue: include feature & bug
|
||||||
|
|
||||||
|
_Prepare all assets for that feature & bug.
|
||||||
|
|
||||||
|
_Update documentation.
|
||||||
|
|
||||||
|
## Team Italy
|
||||||
|
|
||||||
|
_Using gitea: drag issue from : ToDo -> In Progress -> Done (Git auto change to done)
|
||||||
|
|
||||||
|
_Support teamVN feedback about documentation.
|
||||||
|
|
||||||
|
|
||||||
|
## GIT FLOW
|
||||||
|
|
||||||
|
**Team Italy** after finish any feature or bug.
|
||||||
|
:::tip
|
||||||
|
Create PullRequest: Title format should be: `Close #{Issue ID}: {content}` (Following this format will help automate the closing of linked issues when the pull request is merged).
|
||||||
|
:::
|
||||||
|
|
||||||
|
**Team VN** will try to review and merge as soon as possible.
|
||||||
|
|
||||||
|
|
||||||
|
:::tip
|
||||||
|
Sometimes **team VN** still not merge PullRequest and **team Italy** want to do next issue.
|
||||||
|
To avoid conflicts, recommend using prefabs for features and notifying team members whenever update the SCENE.
|
||||||
|
|
||||||
|
Normally, if PullRequest1 is good and merge to develop. PullRequest2 will not conflict.
|
||||||
|
:::
|
8
docs/git-using/_category_.json
Normal file
@ -0,0 +1,8 @@
|
|||||||
|
{
|
||||||
|
"label": "USING GIT",
|
||||||
|
"collapsible": true,
|
||||||
|
"collapsed": false,
|
||||||
|
"link": {
|
||||||
|
"title": "USING GIT"
|
||||||
|
}
|
||||||
|
}
|
BIN
docs/git-using/image.png
Normal file
After Width: | Height: | Size: 37 KiB |
BIN
docs/git-using/img/after.png
Normal file
After Width: | Height: | Size: 23 KiB |
BIN
docs/git-using/img/amend-1.png
Normal file
After Width: | Height: | Size: 20 KiB |
BIN
docs/git-using/img/amend-2.png
Normal file
After Width: | Height: | Size: 37 KiB |
BIN
docs/git-using/img/amend-3.png
Normal file
After Width: | Height: | Size: 17 KiB |
BIN
docs/git-using/img/amend-4.png
Normal file
After Width: | Height: | Size: 56 KiB |
BIN
docs/git-using/img/amend-5.png
Normal file
After Width: | Height: | Size: 22 KiB |
BIN
docs/git-using/img/before.png
Normal file
After Width: | Height: | Size: 22 KiB |
BIN
docs/git-using/img/drop-1.png
Normal file
After Width: | Height: | Size: 9.2 KiB |
BIN
docs/git-using/img/drop-2.png
Normal file
After Width: | Height: | Size: 25 KiB |
BIN
docs/git-using/img/drop-3.png
Normal file
After Width: | Height: | Size: 17 KiB |
BIN
docs/git-using/img/drop-4.png
Normal file
After Width: | Height: | Size: 5.9 KiB |
BIN
docs/git-using/img/push-fail-1.png
Normal file
After Width: | Height: | Size: 23 KiB |
BIN
docs/git-using/img/push-fail-2.png
Normal file
After Width: | Height: | Size: 8.3 KiB |
BIN
docs/git-using/img/push-fail-3.png
Normal file
After Width: | Height: | Size: 24 KiB |
BIN
docs/git-using/img/push-fail-4.png
Normal file
After Width: | Height: | Size: 11 KiB |
BIN
docs/git-using/img/rebase-1.png
Normal file
After Width: | Height: | Size: 29 KiB |
BIN
docs/git-using/img/rebase-2.png
Normal file
After Width: | Height: | Size: 14 KiB |
BIN
docs/git-using/img/rebase-3.png
Normal file
After Width: | Height: | Size: 17 KiB |
BIN
docs/git-using/img/resolve-conflic-1.png
Normal file
After Width: | Height: | Size: 31 KiB |
BIN
docs/git-using/img/resolve-conflic-2.png
Normal file
After Width: | Height: | Size: 89 KiB |
BIN
docs/git-using/img/resolve-conflic-3.png
Normal file
After Width: | Height: | Size: 174 KiB |
BIN
docs/git-using/img/test-special-win.png
Normal file
After Width: | Height: | Size: 321 KiB |
19
docs/git-using/test.md
Normal file
@ -0,0 +1,19 @@
|
|||||||
|
# MD
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
| Step | Action | image |
|
||||||
|
|------|---------|--------------|
|
||||||
|
| 1. Locate Prefab | Search for `ui-bottom-bar-panel` prefab |  |
|
||||||
|
| 2. Find Assets | Navigate to `core/editor` directory |  |
|
||||||
|
| 3. Clone Assets | Copy / Paste to game assets location |  |
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|

|
||||||
|
|
||||||
|
|
||||||
|
:::warning
|
||||||
|
If you missing step 1, this popup will appear. Back to step 1 and do it again.
|
||||||
|

|
||||||
|
:::
|