用ASM實現Navigator效果

用Unity的ASM硬幹Navigator

ASM(Animation State Machines)

stacknavigator和tabnavigator

其實就是在處理狀態的轉移

所以用ASM就可以搞出一樣的效果

下面的狀態機是參考自這個頁面的UI配置

• murobox

當時在練習使用Unity的UI ( 還不是為了 😍 錢錢

區塊代表的意義

• 深橘色是大狀態，用來達到tabnavigator的劃分功能。
• 淺橘色是子狀態，用來達到stacknavigator的回朔和記憶(memory)功能。

線段代表的意義

• 淺藍、深藍線代表由上而下，比如說「Selector」到「音樂庫(1)」；
• 或是「memory」到「全部樂曲」；只要從「memory」出發的就會是深藍線。
• 紅線代表由下而上，比如說「全部樂曲」返回「音樂庫」。

舉個例子

• User正在「全部樂曲」Panel。此時他點擊分頁按鈕「我的清單」，會產生goTop訊息給State Machine，「Any」子狀態收到goTop後會轉移到「Selector」狀態；「Selctor」狀態依據target會前往「我的清單(2)」狀態，並進入「memory」子狀態；假設之前已經進入過我的清單，而且是停在「清單樂曲」，就會由「memory」直接轉移到「清單樂曲」。
• User正在「清單樂曲」Panel，這時他點擊其中一首曲子播放，於是「播放曲目」Panel會更新正在播放的曲目資訊。接著他點擊「播放曲目」Panel上的編輯按鈕，會產生goTop訊息，「Any」子狀態收到goTop後會轉移到「Selector」狀態；「Selector」跟據target會前往「編曲(3)」狀態。當他編曲結束後按某個按鈕會產生goTop，然後轉移到「Selector」。由於from有記錄他之前是在「我的清單(2)」狀態，「Selector」會把他導向那裡。進入「memory」後因為有過去的記錄，接著又導向「清單樂曲」狀態。
• User正在「清單樂曲」Panel，此時他點擊分頁按鈕「編曲」，會產生goTop訊息，「Any」子狀態收到goTop後會轉移到「Selector」狀態；以下的Flow就不再重述，但是這個動作會產生新的編曲，而不是編輯舊的曲目。

DB的部分

那時傻傻的，沒想過可以直接用json做假資料

結果就把db的部分也硬幹出來了

UI長這樣

果然還是需要專業的配色呢

想了一下ig可能怎麼實作