修复Canvas大小变更时UI不随之移动错误。使用UIColorContainer来储存Color信息。

2023-10-16 19:41:25 +09:00
13 changed files with 171 additions and 154 deletions
--- a/Assets/ML-Agents/Timers/StartScene_timers.json
+++ b/Assets/ML-Agents/Timers/StartScene_timers.json
@ -1 +1 @@
-{"count":1,"self":10.2447512,"total":10.2987626,"children":{"InitializeActuators":{"count":2,"self":0.0009994,"total":0.0009994,"children":null},"InitializeSensors":{"count":2,"self":0.00099859999999999988,"total":0.00099859999999999988,"children":null},"AgentSendState":{"count":169,"self":0.0025004,"total":0.009501299999999999,"children":{"CollectObservations":{"count":169,"self":0.0050025999999999994,"total":0.0050025999999999994,"children":null},"WriteActionMask":{"count":169,"self":0.0004994,"total":0.0004994,"children":null},"RequestDecision":{"count":169,"self":0.0014988999999999998,"total":0.0014988999999999998,"children":null}}},"DecideAction":{"count":169,"self":0.0025041,"total":0.0025041,"children":null},"AgentAct":{"count":169,"self":0.0400077,"total":0.0400077,"children":null}},"gauges":{},"metadata":{"timer_format_version":"0.1.0","start_time_seconds":"1696963654","unity_version":"2021.3.14f1","command_line_arguments":"C:\\Program Files\\Unity\\Hub\\Editor\\2021.3.14f1\\Editor\\Unity.exe -projectpath C:\\Users\\UCUNI\\OneDrive\\Unity\\ML-Agents\\Aimbot-ParallelEnv -useHub -hubIPC -cloudEnvironment production -licensingIpc LicenseClient-UCUNI -hubSessionId 7c3dcd5a-daae-43b1-a2e8-4bb346bbb4e5 -accessToken G6W4ifPeN-JJvIEsustzRofGrXpwOepV108yPK_cjPA00ef","communication_protocol_version":"1.5.0","com.unity.ml-agents_version":"2.0.1","scene_name":"StartScene","end_time_seconds":"1696963665"}}
+{"count":1,"self":96.1897728,"total":96.582275299999992,"children":{"InitializeActuators":{"count":16,"self":0.00099899999999999989,"total":0.00099899999999999989,"children":null},"InitializeSensors":{"count":16,"self":0.0009993,"total":0.0009993,"children":null},"AgentSendState":{"count":867,"self":0.019012499999999998,"total":0.1588117,"children":{"CollectObservations":{"count":6936,"self":0.1277917,"total":0.1277917,"children":null},"WriteActionMask":{"count":6936,"self":0.0040009,"total":0.0040009,"children":null},"RequestDecision":{"count":6936,"self":0.0080066,"total":0.0080066,"children":null}}},"DecideAction":{"count":867,"self":0.0100142,"total":0.0100142,"children":null},"AgentAct":{"count":867,"self":0.2216761,"total":0.2216761,"children":null}},"gauges":{},"metadata":{"timer_format_version":"0.1.0","start_time_seconds":"1697442592","unity_version":"2021.3.14f1","command_line_arguments":"C:\\Program Files\\Unity\\Hub\\Editor\\2021.3.14f1\\Editor\\Unity.exe -projectpath C:\\Users\\UCUNI\\OneDrive\\Unity\\ML-Agents\\Aimbot-ParallelEnv -useHub -hubIPC -cloudEnvironment production -licensingIpc LicenseClient-UCUNI -hubSessionId e4e811a4-b1b9-40c9-bb87-1f58481c4f0b -accessToken CFEM6A4XwpAEfTmhoY1tJ77LSedBMNIqUlXBOmvKzJY00ef","communication_protocol_version":"1.5.0","com.unity.ml-agents_version":"2.0.1","scene_name":"StartScene","end_time_seconds":"1697442688"}}
--- a/Assets/ML-Agents/Timers/Train_timers.json
+++ b/Assets/ML-Agents/Timers/Train_timers.json
@ -1 +1 @@
-{"count":1,"self":66.9065984,"total":71.9882009,"children":{"InitializeActuators":{"count":16,"self":0.0009969,"total":0.0009969,"children":null},"InitializeSensors":{"count":16,"self":0.0009994,"total":0.0009994,"children":null},"AgentSendState":{"count":3334,"self":0.044007,"total":0.43848919999999997,"children":{"CollectObservations":{"count":26672,"self":0.3689863,"total":0.3689863,"children":null},"WriteActionMask":{"count":26672,"self":0.0044905,"total":0.0044905,"children":null},"RequestDecision":{"count":26672,"self":0.0210054,"total":0.0210054,"children":null}}},"DecideAction":{"count":3334,"self":0.0480142,"total":0.0480142,"children":null},"AgentAct":{"count":3334,"self":4.5931028,"total":4.5931029,"children":null}},"gauges":{"AKMAgent.CumulativeReward":{"count":18,"max":4761.187,"min":-3316.413,"runningAverage":119.63308,"value":4761.187,"weightedAverage":2609.449}},"metadata":{"timer_format_version":"0.1.0","start_time_seconds":"1697400022","unity_version":"2021.3.14f1","command_line_arguments":"C:\\Program Files\\Unity\\Hub\\Editor\\2021.3.14f1\\Editor\\Unity.exe -projectpath C:\\Users\\UCUNI\\OneDrive\\Unity\\ML-Agents\\Aimbot-ParallelEnv -useHub -hubIPC -cloudEnvironment production -licensingIpc LicenseClient-UCUNI -hubSessionId e4e811a4-b1b9-40c9-bb87-1f58481c4f0b -accessToken gZraEFpga1zyWWe2F_cgXvA55kRNGoKgEeraCZAmspA00ef","communication_protocol_version":"1.5.0","com.unity.ml-agents_version":"2.0.1","scene_name":"Train","end_time_seconds":"1697400094"}}
+{"count":1,"self":28.5910528,"total":28.601550099999997,"children":{"InitializeActuators":{"count":16,"self":0.0010008,"total":0.0010008,"children":null},"InitializeSensors":{"count":16,"self":0.001,"total":0.001,"children":null},"AgentSendState":{"count":1,"self":0.0009989,"total":0.0034985,"children":{"CollectObservations":{"count":8,"self":0.0014998,"total":0.0014998,"children":null},"WriteActionMask":{"count":8,"self":0,"total":0,"children":null},"RequestDecision":{"count":8,"self":0.0009998,"total":0.0009998,"children":null}}},"DecideAction":{"count":1,"self":0.0005,"total":0.0005,"children":null},"AgentAct":{"count":1,"self":0.0044989,"total":0.0044989,"children":null}},"gauges":{},"metadata":{"timer_format_version":"0.1.0","start_time_seconds":"1697452285","unity_version":"2021.3.14f1","command_line_arguments":"C:\\Program Files\\Unity\\Hub\\Editor\\2021.3.14f1\\Editor\\Unity.exe -projectpath C:\\Users\\UCUNI\\OneDrive\\Unity\\ML-Agents\\Aimbot-ParallelEnv -useHub -hubIPC -cloudEnvironment production -licensingIpc LicenseClient-UCUNI -hubSessionId e4e811a4-b1b9-40c9-bb87-1f58481c4f0b -accessToken CFEM6A4XwpAEfTmhoY1tJ77LSedBMNIqUlXBOmvKzJY00ef","communication_protocol_version":"1.5.0","com.unity.ml-agents_version":"2.0.1","scene_name":"Train","end_time_seconds":"1697452314"}}
--- a/Assets/Prefeb/UIColors.asset
+++ b/Assets/Prefeb/UIColors.asset
@ -0,0 +1,42 @@
+%YAML 1.1
+%TAG !u! tag:unity3d.com,2011:
+--- !u!114 &11400000
+MonoBehaviour:
+  m_ObjectHideFlags: 0
+  m_CorrespondingSourceObject: {fileID: 0}
+  m_PrefabInstance: {fileID: 0}
+  m_PrefabAsset: {fileID: 0}
+  m_GameObject: {fileID: 0}
+  m_Enabled: 1
+  m_EditorHideFlags: 0
+  m_Script: {fileID: 11500000, guid: 3fef23608d0a5d242a781d8ca28ed23b, type: 3}
+  m_Name: UIColors
+  m_EditorClassIdentifier: 
+  normal:
+    text:
+      serializedVersion: 2
+      rgba: 4293717228
+    bg:
+      serializedVersion: 2
+      rgba: 16777215
+  highLight:
+    text:
+      serializedVersion: 2
+      rgba: 3861457193
+    bg:
+      serializedVersion: 2
+      rgba: 1744830463
+  pressed:
+    text:
+      serializedVersion: 2
+      rgba: 4026531840
+    bg:
+      serializedVersion: 2
+      rgba: 2701131775
+  disabled:
+    text:
+      serializedVersion: 2
+      rgba: 1354020020
+    bg:
+      serializedVersion: 2
+      rgba: 16777215
--- a/Assets/Prefeb/UIColors.asset.meta
+++ b/Assets/Prefeb/UIColors.asset.meta
@ -0,0 +1,8 @@
+fileFormatVersion: 2
+guid: c75edf08eba25eb40896936387c07e89
+NativeFormatImporter:
+  externalObjects: {}
+  mainObjectFileID: 11400000
+  userData: 
+  assetBundleName: 
+  assetBundleVariant: 
--- a/Assets/Scenes/StartScene.unity
+++ b/Assets/Scenes/StartScene.unity
@ -942,7 +942,7 @@ RectTransform:
  m_LocalEulerAnglesHint: {x: 0, y: 0, z: 0}
  m_AnchorMin: {x: 0, y: 1}
  m_AnchorMax: {x: 0, y: 1}
-  m_AnchoredPosition: {x: -61, y: 215}
+  m_AnchoredPosition: {x: 411.6, y: -24.599976}
  m_SizeDelta: {x: 200, y: 50}
  m_Pivot: {x: 0.5, y: 0.5}
 --- !u!114 &431112176
@ -2096,55 +2096,6 @@ Transform:
  m_Father: {fileID: 0}
  m_RootOrder: 4
  m_LocalEulerAnglesHint: {x: 0, y: 0, z: 0}
--- !u!1 &1129476375
-GameObject:
-  m_ObjectHideFlags: 0
-  m_CorrespondingSourceObject: {fileID: 0}
-  m_PrefabInstance: {fileID: 0}
-  m_PrefabAsset: {fileID: 0}
-  serializedVersion: 6
-  m_Component:
-  - component: {fileID: 1129476376}
-  - component: {fileID: 1129476377}
-  m_Layer: 5
-  m_Name: UIColorContainer
-  m_TagString: Untagged
-  m_Icon: {fileID: 0}
-  m_NavMeshLayer: 0
-  m_StaticEditorFlags: 0
-  m_IsActive: 1
--- !u!224 &1129476376
-RectTransform:
-  m_ObjectHideFlags: 0
-  m_CorrespondingSourceObject: {fileID: 0}
-  m_PrefabInstance: {fileID: 0}
-  m_PrefabAsset: {fileID: 0}
-  m_GameObject: {fileID: 1129476375}
-  m_LocalRotation: {x: 0, y: 0, z: 0, w: 1}
-  m_LocalPosition: {x: 0, y: 0, z: 0}
-  m_LocalScale: {x: 1, y: 1, z: 1}
-  m_ConstrainProportionsScale: 0
-  m_Children: []
-  m_Father: {fileID: 1144208399}
-  m_RootOrder: 10
-  m_LocalEulerAnglesHint: {x: 0, y: 0, z: 0}
-  m_AnchorMin: {x: 0.5, y: 0.5}
-  m_AnchorMax: {x: 0.5, y: 0.5}
-  m_AnchoredPosition: {x: 0, y: 0}
-  m_SizeDelta: {x: 100, y: 100}
-  m_Pivot: {x: 0.5, y: 0.5}
--- !u!114 &1129476377
-MonoBehaviour:
-  m_ObjectHideFlags: 0
-  m_CorrespondingSourceObject: {fileID: 0}
-  m_PrefabInstance: {fileID: 0}
-  m_PrefabAsset: {fileID: 0}
-  m_GameObject: {fileID: 1129476375}
-  m_Enabled: 1
-  m_EditorHideFlags: 0
-  m_Script: {fileID: 11500000, guid: 3fef23608d0a5d242a781d8ca28ed23b, type: 3}
-  m_Name: 
-  m_EditorClassIdentifier: 
 --- !u!1 &1144208395
 GameObject:
  m_ObjectHideFlags: 0
@ -2247,7 +2198,6 @@ RectTransform:
  - {fileID: 1614969824}
  - {fileID: 1899537997}
  - {fileID: 237721382}
-  - {fileID: 1129476376}
  m_Father: {fileID: 0}
  m_RootOrder: 0
  m_LocalEulerAnglesHint: {x: 0, y: 0, z: 0}
@ -2645,10 +2595,10 @@ MonoBehaviour:
  gotoButton: {fileID: 1614969818}
  freeButton: {fileID: 1899537996}
  animeDuration: 0.2
-  mixDestination: {x: -85, y: 29, z: 0}
-  attackDestination: {x: -100, y: 0, z: 0}
-  gotoDestination: {x: -115, y: -29, z: 0}
-  freeDestination: {x: -130, y: -58, z: 0}
+  animeMoveXDistance: 5
+  animeMoveYDistance: 10
+  animeScaleX: 3
+  animeScaleY: 3
  maskScaleX: 1
  maskScaleY: 0.4
 --- !u!114 &1432557595
@ -2670,32 +2620,9 @@ MonoBehaviour:
  unclickableButton:
  - {fileID: 850190065}
  - {fileID: 546575679}
-  normalTextColor:
-    serializedVersion: 2
-    rgba: 4293717228
-  normalBGColor:
-    serializedVersion: 2
-    rgba: 16777215
-  highLightTextColor:
-    serializedVersion: 2
-    rgba: 3861457193
-  highLightBGColor:
-    serializedVersion: 2
-    rgba: 1744830463
-  pressedTextColor:
-    serializedVersion: 2
-    rgba: 4026531840
-  pressedBGColor:
-    serializedVersion: 2
-    rgba: 2701131775
-  disableTextColor:
-    serializedVersion: 2
-    rgba: 1354020020
-  disableBGColor:
-    serializedVersion: 2
-    rgba: 16777215
  colorChangeSpeed: 0.1
  clickable: 1
+  uiColor: {fileID: 11400000, guid: c75edf08eba25eb40896936387c07e89, type: 2}
 --- !u!1 &1575146385
 GameObject:
  m_ObjectHideFlags: 0
@ -2729,9 +2656,9 @@ RectTransform:
  m_Father: {fileID: 1144208399}
  m_RootOrder: 2
  m_LocalEulerAnglesHint: {x: 0, y: 0, z: 0}
-  m_AnchorMin: {x: 0.5, y: 0.5}
-  m_AnchorMax: {x: 0.5, y: 0.5}
-  m_AnchoredPosition: {x: 0, y: 0}
+  m_AnchorMin: {x: 0, y: 1}
+  m_AnchorMax: {x: 0, y: 1}
+  m_AnchoredPosition: {x: 50, y: -50}
  m_SizeDelta: {x: 100, y: 100}
  m_Pivot: {x: 0.5, y: 0.5}
 --- !u!1 &1614969818
@ -3403,7 +3330,7 @@ RectTransform:
  m_LocalEulerAnglesHint: {x: 0, y: 0, z: 0}
  m_AnchorMin: {x: 0, y: 1}
  m_AnchorMax: {x: 0, y: 1}
-  m_AnchoredPosition: {x: -372, y: 211}
+  m_AnchoredPosition: {x: 100.6, y: -28.6}
  m_SizeDelta: {x: 200, y: 50}
  m_Pivot: {x: 0.5, y: 0.5}
 --- !u!114 &2145851918
--- a/Assets/Scenes/Train.unity
+++ b/Assets/Scenes/Train.unity
@ -10008,7 +10008,7 @@ Mesh:
  m_CorrespondingSourceObject: {fileID: 0}
  m_PrefabInstance: {fileID: 0}
  m_PrefabAsset: {fileID: 0}
-  m_Name: pb_Mesh30798
+  m_Name: pb_Mesh30802
  serializedVersion: 10
  m_SubMeshes:
  - serializedVersion: 2
@ -12884,7 +12884,7 @@ Mesh:
  m_CorrespondingSourceObject: {fileID: 0}
  m_PrefabInstance: {fileID: 0}
  m_PrefabAsset: {fileID: 0}
-  m_Name: pb_Mesh27090
+  m_Name: pb_Mesh27092
  serializedVersion: 10
  m_SubMeshes:
  - serializedVersion: 2
@ -15870,7 +15870,7 @@ Mesh:
  m_CorrespondingSourceObject: {fileID: 0}
  m_PrefabInstance: {fileID: 0}
  m_PrefabAsset: {fileID: 0}
-  m_Name: pb_Mesh27172
+  m_Name: pb_Mesh27174
  serializedVersion: 10
  m_SubMeshes:
  - serializedVersion: 2
@ -25621,7 +25621,7 @@ Mesh:
  m_CorrespondingSourceObject: {fileID: 0}
  m_PrefabInstance: {fileID: 0}
  m_PrefabAsset: {fileID: 0}
-  m_Name: pb_Mesh26962
+  m_Name: pb_Mesh26964
  serializedVersion: 10
  m_SubMeshes:
  - serializedVersion: 2
@ -39264,14 +39264,14 @@ MonoBehaviour:
  m_Name: 
  m_EditorClassIdentifier: 
  m_Material: {fileID: 2100000, guid: f6d46f1e916b3486c90a448a441fac6a, type: 2}
-  m_Color: {r: 1, g: 1, b: 1, a: 0}
+  m_Color: {r: 0.8867924, g: 0.8867924, b: 0.8867924, a: 1}
  m_RaycastTarget: 1
  m_RaycastPadding: {x: 0, y: 0, z: 0, w: 0}
  m_Maskable: 1
  m_OnCullStateChanged:
    m_PersistentCalls:
      m_Calls: []
-  m_Sprite: {fileID: 10905, guid: 0000000000000000f000000000000000, type: 0}
+  m_Sprite: {fileID: 0}
  m_Type: 1
  m_PreserveAspect: 0
  m_FillCenter: 1
@ -39307,8 +39307,8 @@ RectTransform:
  m_LocalEulerAnglesHint: {x: 0, y: 0, z: 0}
  m_AnchorMin: {x: 1, y: 1}
  m_AnchorMax: {x: 1, y: 1}
-  m_AnchoredPosition: {x: -94.1, y: -35.076}
-  m_SizeDelta: {x: 171.8483, y: 52.1512}
+  m_AnchoredPosition: {x: -98.800446, y: -35.076004}
+  m_SizeDelta: {x: 181.2491, y: 52.1512}
  m_Pivot: {x: 0.5, y: 0.5}
 --- !u!1 &1403501266
 GameObject:
@ -40705,7 +40705,7 @@ RectTransform:
  m_LocalEulerAnglesHint: {x: 0, y: 0, z: 0}
  m_AnchorMin: {x: 0, y: 1}
  m_AnchorMax: {x: 1, y: 1}
-  m_AnchoredPosition: {x: 0.000030517578, y: -246.20192}
+  m_AnchoredPosition: {x: 0.000030517578, y: -246.20204}
  m_SizeDelta: {x: 0, y: 0}
  m_Pivot: {x: 0, y: 0}
 --- !u!114 &1442113294
@ -43031,15 +43031,15 @@ MonoBehaviour:

    In Next Episode'
  m_isRightToLeft: 0
-  m_fontAsset: {fileID: 11400000, guid: 8f586378b4e144a9851e7b34d9b748ee, type: 2}
-  m_sharedMaterial: {fileID: 2180264, guid: 8f586378b4e144a9851e7b34d9b748ee, type: 2}
+  m_fontAsset: {fileID: 11400000, guid: 07e34e9000492a2468743178b0960f4e, type: 2}
+  m_sharedMaterial: {fileID: -5512001432465614552, guid: 07e34e9000492a2468743178b0960f4e, type: 2}
  m_fontSharedMaterials: []
  m_fontMaterial: {fileID: 0}
  m_fontMaterials: []
  m_fontColor32:
    serializedVersion: 2
-    rgba: 4281479730
-  m_fontColor: {r: 0.19607843, g: 0.19607843, b: 0.19607843, a: 1}
+    rgba: 4294967295
+  m_fontColor: {r: 1, g: 1, b: 1, a: 1}
  m_enableVertexGradient: 0
  m_colorMode: 3
  m_fontColorGradient:
@ -43056,10 +43056,10 @@ MonoBehaviour:
  m_faceColor:
    serializedVersion: 2
    rgba: 4294967295
-  m_fontSize: 24
+  m_fontSize: 21.45
  m_fontSizeBase: 24
  m_fontWeight: 400
-  m_enableAutoSizing: 0
+  m_enableAutoSizing: 1
  m_fontSizeMin: 18
  m_fontSizeMax: 72
  m_fontStyle: 0
--- a/Assets/Script/UI/ButtonActivateColorChanger.cs
+++ b/Assets/Script/UI/ButtonActivateColorChanger.cs
@ -10,29 +10,25 @@ public class ButtonActivateColorChanger : MonoBehaviour
    public List<Button> clickableButton = new List<Button>();
    public List<Button> unclickableButton = new List<Button>();

-    public Color32 normalTextColor = new Color32(236, 236, 236, 255);
-    public Color32 normalBGColor = new Color32(255, 255, 255, 0);
-    public Color32 highLightTextColor = new Color32(41, 41, 41, 230);
-    public Color32 highLightBGColor = new Color32(255, 255, 255, 103);
-    public Color32 pressedTextColor = new Color32(0, 0, 0, 240);
-    public Color32 pressedBGColor = new Color32(255, 255, 255, 160);
-    public Color32 disableTextColor = new Color32(180, 180, b: 180, 80);
-    public Color32 disableBGColor = new Color32(255, 255, b: 255, 0);
    public float colorChangeSpeed = 0.1f;

    public bool clickable = true;

+    [SerializeField] private UIColorContainer uiColor;
+
    // Start is called before the first frame update
    private void Start()
    {
        foreach (Button btn in clickableButton)
        {
            InitializeEventTriggers(btn, true);
+            InitializeButtonColor(btn);
        }

        foreach (Button btn in unclickableButton)
        {
            InitializeEventTriggers(btn, false);
+            InitializeButtonColor(btn);
        }
    }

@ -58,6 +54,15 @@ private void InitializeEventTriggers(Button btn, bool isClickable)
        }
    }

+    private void InitializeButtonColor(Button btn)
+    {
+        if (btn.interactable)
+        {
+            btn.image.DOColor(uiColor.normal.bg, colorChangeSpeed);
+            btn.GetComponentInChildren<TextMeshProUGUI>().DOColor(uiColor.normal.text, colorChangeSpeed);
+        }
+    }
+
    /// <summary>
    /// Adds an event trigger entry to an event trigger.
    /// </summary>
@ -76,8 +81,8 @@ private void OnPointerEnter(Button btn)
    {
        if (btn.interactable)
        {
-            btn.image.DOColor(highLightBGColor, colorChangeSpeed);
-            btn.GetComponentInChildren<TextMeshProUGUI>().DOColor(highLightTextColor, colorChangeSpeed);
+            btn.image.DOColor(uiColor.highLight.bg, colorChangeSpeed);
+            btn.GetComponentInChildren<TextMeshProUGUI>().DOColor(uiColor.highLight.text, colorChangeSpeed);
        }
    }

@ -85,8 +90,8 @@ private void OnPointerExit(Button btn)
    {
        if (btn.interactable)
        {
-            btn.image.DOColor(normalBGColor, colorChangeSpeed);
-            btn.GetComponentInChildren<TextMeshProUGUI>().DOColor(normalTextColor, colorChangeSpeed);
+            btn.image.DOColor(uiColor.normal.bg, colorChangeSpeed);
+            btn.GetComponentInChildren<TextMeshProUGUI>().DOColor(uiColor.normal.text, colorChangeSpeed);
        }
    }

@ -94,8 +99,8 @@ private void OnPointerDown(Button btn)
    {
        if (btn.interactable)
        {
-            btn.image.DOColor(pressedBGColor, colorChangeSpeed);
-            btn.GetComponentInChildren<TextMeshProUGUI>().DOColor(pressedTextColor, colorChangeSpeed);
+            btn.image.DOColor(uiColor.pressed.bg, colorChangeSpeed);
+            btn.GetComponentInChildren<TextMeshProUGUI>().DOColor(uiColor.pressed.text, colorChangeSpeed);
        }
    }

@ -103,8 +108,8 @@ private void OnPointerUp(Button btn)
    {
        if (btn.interactable)
        {
-            btn.image.DOColor(highLightBGColor, colorChangeSpeed);
-            btn.GetComponentInChildren<TextMeshProUGUI>().DOColor(normalTextColor, colorChangeSpeed);
+            btn.image.DOColor(uiColor.highLight.bg, colorChangeSpeed);
+            btn.GetComponentInChildren<TextMeshProUGUI>().DOColor(uiColor.highLight.text, colorChangeSpeed);
        }
    }

@ -118,13 +123,13 @@ public void ChangeInteractableColor(Button btn, bool changeTo)
        btn.interactable = changeTo;
        if (changeTo)
        {
-            btn.image.DOColor(normalBGColor, colorChangeSpeed);
-            btn.GetComponentInChildren<TextMeshProUGUI>().DOColor(normalTextColor, colorChangeSpeed);
+            btn.image.DOColor(uiColor.normal.bg, colorChangeSpeed);
+            btn.GetComponentInChildren<TextMeshProUGUI>().DOColor(uiColor.normal.text, colorChangeSpeed);
        }
        else
        {
-            btn.image.DOColor(disableBGColor, colorChangeSpeed);
-            btn.GetComponentInChildren<TextMeshProUGUI>().DOColor(disableTextColor, colorChangeSpeed);
+            btn.image.DOColor(uiColor.disabled.bg, colorChangeSpeed);
+            btn.GetComponentInChildren<TextMeshProUGUI>().DOColor(uiColor.disabled.text, colorChangeSpeed);
        }
    }

@ -151,13 +156,13 @@ public void InitializeAllButtonColor()
    {
        foreach (Button btn in clickableButton)
        {
-            btn.image.color = normalBGColor;
-            btn.GetComponentInChildren<TextMeshProUGUI>().color = normalTextColor;
+            btn.image.color = uiColor.normal.bg;
+            btn.GetComponentInChildren<TextMeshProUGUI>().color = uiColor.normal.bg;
        }
        foreach (Button btn in unclickableButton)
        {
-            btn.image.color = disableBGColor;
-            btn.GetComponentInChildren<TextMeshProUGUI>().color = disableTextColor;
+            btn.image.color = uiColor.disabled.bg;
+            btn.GetComponentInChildren<TextMeshProUGUI>().color = uiColor.disabled.text;
        }
    }
-}
+}
--- a/Assets/Script/Start/StartMenuAnimations.cs
+++ b/Assets/Script/Start/StartMenuAnimations.cs
@ -11,10 +11,11 @@ public class StartMenuAnimations : MonoBehaviour

    public float animeDuration = 0.2f;

-    public Vector3 mixDestination = new Vector3(-85, 29, 0);
-    public Vector3 attackDestination = new Vector3(-100, 0, 0);
-    public Vector3 gotoDestination = new Vector3(-115, -29, 0);
-    public Vector3 freeDestination = new Vector3(-130, -58, 0);
+    public float animeMoveXDistance = 20f;
+    public float animeMoveYDistance = 20f;
+
+    public float animeScaleX = 1.2f;
+    public float animeScaleY = 1.2f;

    public float maskScaleX = 1;
    public float maskScaleY = 0.4f;
@ -24,11 +25,19 @@ public class StartMenuAnimations : MonoBehaviour
    private Vector3 gotoOriginDestination;
    private Vector3 freeOriginDestination;

+    private Vector3 mixDestination;
+    private Vector3 attackDestination;
+    private Vector3 gotoDestination;
+    private Vector3 freeDestination;
+
+    private Vector3 originalCanvas;
+
    private PolygonCollider2D parallelogramPolygon;
    private bool isMouseOverMask = false;

    private void Start()
    {
+        originalCanvas = transform.parent.position;
        // get start position
        mixOriginDestination = mixButton.transform.position;
        attackOriginDestination = attackButton.transform.position;
@ -36,10 +45,10 @@ private void Start()
        freeOriginDestination = freeButton.transform.position;

        // transform local vector3 to world vector3 by parent
-        mixDestination += mixButton.transform.parent.position;
-        attackDestination += attackButton.transform.parent.position;
-        gotoDestination += gotoButton.transform.parent.position;
-        freeDestination += freeButton.transform.parent.position;
+        mixDestination = mixButton.transform.position + new Vector3(animeScaleX * animeMoveXDistance, animeScaleY * animeMoveYDistance, 0);
+        attackDestination = attackButton.transform.position + new Vector3(animeMoveXDistance, animeMoveYDistance, 0);
+        gotoDestination = gotoButton.transform.position - new Vector3(animeMoveXDistance, animeMoveYDistance, 0);
+        freeDestination = freeButton.transform.position - new Vector3(animeScaleX * animeMoveXDistance, animeScaleY * animeMoveYDistance, 0);

        //get polygon from maskOBJ
        parallelogramPolygon = maskObj.GetComponent<PolygonCollider2D>();
@ -66,20 +75,20 @@ private void Update()
    private void OnMaskPointerEnter()
    {
        // dotween move button
-        mixButton.transform.DOMove(mixDestination, animeDuration, true).SetEase(Ease.OutCirc).Play();
-        attackButton.transform.DOMove(attackDestination, animeDuration, true).SetEase(Ease.OutCirc).Play();
-        gotoButton.transform.DOMove(gotoDestination, animeDuration, true).SetEase(Ease.OutCirc).Play();
-        freeButton.transform.DOMove(freeDestination, animeDuration, true).SetEase(Ease.OutCirc).Play();
+        mixButton.transform.DOMove(fixCanvas(mixDestination), animeDuration, true).SetEase(Ease.OutCirc).Play();
+        attackButton.transform.DOMove(fixCanvas(attackDestination), animeDuration, true).SetEase(Ease.OutCirc).Play();
+        gotoButton.transform.DOMove(fixCanvas(gotoDestination), animeDuration, true).SetEase(Ease.OutCirc).Play();
+        freeButton.transform.DOMove(fixCanvas(freeDestination), animeDuration, true).SetEase(Ease.OutCirc).Play();
        MaximizeMaskObj();
    }

    private void OnMaskPointerExit()
    {
        // dotween move button batck to original position
-        mixButton.transform.DOMove(mixOriginDestination, animeDuration, true).SetEase(Ease.OutCirc).Play();
-        attackButton.transform.DOMove(attackOriginDestination, animeDuration, true).SetEase(Ease.OutCirc).Play();
-        gotoButton.transform.DOMove(gotoOriginDestination, animeDuration, true).SetEase(Ease.OutCirc).Play();
-        freeButton.transform.DOMove(freeOriginDestination, animeDuration, true).SetEase(Ease.OutCirc).Play();
+        mixButton.transform.DOMove(fixCanvas(mixOriginDestination), animeDuration, true).SetEase(Ease.OutCirc).Play();
+        attackButton.transform.DOMove(fixCanvas(attackOriginDestination), animeDuration, true).SetEase(Ease.OutCirc).Play();
+        gotoButton.transform.DOMove(fixCanvas(gotoOriginDestination), animeDuration, true).SetEase(Ease.OutCirc).Play();
+        freeButton.transform.DOMove(fixCanvas(freeOriginDestination), animeDuration, true).SetEase(Ease.OutCirc).Play();
        MinimizeMaskObj();
    }

@ -96,4 +105,12 @@ private void MaximizeMaskObj()
        maskObj.transform.DOScaleX(1, animeDuration).SetEase(Ease.OutCirc).Play();
        maskObj.transform.DOScaleY(1, animeDuration).SetEase(Ease.OutCirc).Play();
    }
+
+    private Vector3 fixCanvas(Vector3 vector)
+    {
+        // fix position of button while canvas is changed
+        Vector3 fixedV = vector;
+        fixedV += (transform.parent.position - originalCanvas);
+        return fixedV;
+    }
 }
--- a/Assets/Script/Start/StartMenuAnimations.cs.meta
+++ b/Assets/Script/Start/StartMenuAnimations.cs.meta
--- a/Assets/Script/Start/StartUIManager.cs
+++ b/Assets/Script/Start/StartUIManager.cs
--- a/Assets/Script/Start/StartUIManager.cs.meta
+++ b/Assets/Script/Start/StartUIManager.cs.meta
--- a/Assets/Script/UI/UIColorContainer.cs
+++ b/Assets/Script/UI/UIColorContainer.cs
@ -1,18 +1,36 @@
-using System.Collections;
-using System.Collections.Generic;
 using UnityEngine;

-public class UIColorContainer : MonoBehaviour
+[CreateAssetMenu(fileName = "UIColors", menuName = "UI/UIColors")]
+public class UIColorContainer : ScriptableObject
 {
-    // Start is called before the first frame update
-    void Start()
+    [System.Serializable]
+    public struct UIButtonStateColors
    {
-        
+        public Color32 text;
+        public Color32 bg;
    }

-    // Update is called once per frame
-    void Update()
+    public UIButtonStateColors normal = new UIButtonStateColors()
    {
-        
-    }
+        text = new Color32(236, 236, 236, 255),
+        bg = new Color32(255, 255, 255, 0)
+    };
+
+    public UIButtonStateColors highLight = new UIButtonStateColors()
+    {
+        text = new Color32(41, 41, 41, 230),
+        bg = new Color32(255, 255, 255, 103)
+    };
+
+    public UIButtonStateColors pressed = new UIButtonStateColors()
+    {
+        text = new Color32(0, 0, 0, 240),
+        bg = new Color32(255, 255, 255, 160)
+    };
+
+    public UIButtonStateColors disabled = new UIButtonStateColors()
+    {
+        text = new Color32(180, 180, b: 180, 80),
+        bg = new Color32(255, 255, b: 255, 0)
+    };
 }
--- a/UserSettings/EditorUserSettings.asset
+++ b/UserSettings/EditorUserSettings.asset
@ -9,13 +9,13 @@ EditorUserSettings:
      value: 55090405535008090b5608764626074415151c79747c74602b7c1861e4b96c6c
      flags: 0
    RecentlyUsedSceneGuid-1:
-      value: 5453565f53020f085f5d0e72157a0844454f4c2b757d7265757a4f64b7b4313c
+      value: 06570c0704040b0e5a575520137b5e44154f192e292d22367c2c4866b7b3376f
      flags: 0
    RecentlyUsedSceneGuid-2:
-      value: 5703025650035e5d090f087148715d4443161e2c7e2c20357b281b31b0e43060
+      value: 5453565f53020f085f5d0e72157a0844454f4c2b757d7265757a4f64b7b4313c
      flags: 0
    RecentlyUsedSceneGuid-3:
-      value: 06570c0704040b0e5a575520137b5e44154f192e292d22367c2c4866b7b3376f
+      value: 5703025650035e5d090f087148715d4443161e2c7e2c20357b281b31b0e43060
      flags: 0
    RecentlyUsedScenePath-0:
      value: 22424703114646680e0b0227036c6c111b07142f1f2b233e2867083debf42d