在本節的視頻Rooms Part 3： Creating a New Post里，我們將在上次課程的基礎上，繼續制作創建新內容的交互。因為視頻較長，將會分成上、中、下三次課程和大家一起學習。最后希望達到的效果是：點擊首頁右下角的添加按鈕，從下往上彈出發表新內容的頁面，在這個頁面上，點擊關閉按鈕，可以回到首頁；點擊發表，則新內容會以柔和的動畫插進首頁的頭部。
首先，請下載Origami入門教程7材料，提取密碼: qzmm。我們先給添加按鈕加動畫。一般來說，按下按鈕后，按鈕應該有一定的變化，我們這里希望按下添加按鈕，它會動態地變小一些。先添加Interaction 2模塊，把它插到添加按鈕的Layer上，使它只作用在添加按鈕的圖層上。想要有動畫很簡單，把光標懸停在Interaction 2模塊的Down端口上，按下鍵盤“a”，就添加了Pop Animation模塊。此外，我們需要控制一下按鈕大小變化的范圍，顯然，添加Transition模塊就可以了。把光標懸停在Pop Animation模塊的Progress端口上，按下鍵盤“t”，即添加成功。接下來，把Transition模塊的Value插到添加按鈕Layer的Scale端口上。沒按下按鈕的時候，Down輸出是0，也就是Transition模塊的Progress值為0，此時按鈕應該以最大的尺寸顯示，所以Transition的Star Value應該設為1。按下按鈕后，Down輸出是1，也就是Transition模塊的Progress值為1，此時希望按鈕變小一些，可以把End Value設為0.8。這樣，按下按鈕后，它會動態地變為原來大小的80%。如果覺得動畫的彈力不夠，把Pop Animation模塊的bounciness改大一些就可以了。這里設為10，感覺還不錯。
Creating a New Post（添加發布窗口）#
現在我們開始添加發布窗口。先把材料里的Composer.png拖進文檔里。我們希望是，當點擊了添加按鈕后，這個頁面才顯示，所以肯定需要控制Y Position的數值。把光標移到這個圖片對應的Layer模塊的Y Position端口，按下鍵盤“t”，添加Transition模塊。沒有點擊按鈕的時候，需要把這個頁面移到下方看不到的地方，調整Star Value的數值，這里設為-1341就差不多了。當按下添加按鈕時，頁面應該出現，因為這時Progress輸入為1，所以End Value要設為0，最后輸出才會為0，顯示整個頁面。當顯示這個頁面時，也需要動畫效果，所以光標懸停在Transition模塊的Progress端口，按下鍵盤“a”，添加Pop Animation模塊。根據我們的需求，是否點擊添加按鈕會有不同的狀態，顯然，我們需要一個開關來判斷手指是不是在屏幕上，當手指離開了屏幕，才彈出這個頁面。把光標懸停在Pop Animation模塊的Number端口，按下鍵盤“shift+s”，添加Switch模塊。為了之后能更清晰地理解它，我們可以對它重命名為“Composer is Visible”。接下來，就讓按鈕打開這個開關。
在控制開關之前，我們來深入認識一下Interaction 2模塊的幾個輸出端口。Down端口在按下圖層時會輸出1，否則輸出0，用在需要判斷按下狀態的情況；Up端口在圖層被松開時會輸出1，適用于使用按鈕的情況；Tap端口在圖層在固定位置輕按時會輸出1，適用于按鈕處在可滾動圖層上的情況;Drag端口則在被按下直到松開的整個過程中都會輸出1。這里，我們只需要使用Up端口。把它插到Switch模塊的Flip端口，然后再點擊添加按鈕，松手后，發布頁面就從下往上彈出來了。
Going Back（返回）#
點擊發布頁面左上角的交叉按鈕和右上角的Post按鈕，都希望可以返回到首頁信息流。這就要求點擊這兩個按鈕后，可以把Switch模塊代表的開關關閉掉。顯然，我們需要在這兩個按鈕上添加Hit Area。因為點擊區域和這個頁面是永遠一起顯示的，所以需要把它們放在圖層組里。把光標懸停在Composer這個Image上，按下鍵盤“g”，把這個Layer Group再雙擊進入圖層組，按下鍵盤“h”，添加Hit Area。將Anchor Point設為Top Left，Width和Height分別調節為139和187。再復制粘貼一個Hit Area，Anchor Point設為Top Right。這樣，兩個點擊區域都設置完成了。接著，把光標懸停在Hit Area的輸入口，按下鍵盤“i”，分別都添加上Interaction 2模塊。
我們希望把Up口與外面的Switch模塊相連，按之前課程講過的，可以對準Up口按下鍵盤“p”，把這個端口放到外面去。在這里，向大家介紹另一種有用的方法。在Origami里，有一個新模塊叫“Wireless Broadcast”，它能夠以無線方式把數值傳遞到文檔里任一模塊。把光標懸停在Up端口，按下鍵盤“w”。雙擊它重命名為“Close Button Up”。同樣的方法，添加“Post Button Up”。
返回上一層，我們看不到哪里有顯示跟這個無線模塊有關的東西。按下鍵盤“shift+w”，發現添加了一個“Wireless Receiver”模塊，用它就能接收剛才設置的兩個發送器的數值。按下鍵盤“command+2”，進入它的設置，選擇需要接收的發送器名字。先選擇“Close Button Up”發送器，把它插到Switch模塊的Off端口。此時在右邊的手機屏幕上點擊左上角交叉按鈕，頁面就從上往下收回了。
Logic Patch（邏輯模塊）#
同樣，我們再設一個“Wireless Receiver”模塊來接收Post Button Up的數值。不過，當嘗試把它插到Switch模塊的Off端口時會發現，剛才連接“Close Button Up”接收器的線不見了。這是因為不允許同時有2根線插到同一個端口。解決這個問題的方法就是使用Logic Patch（邏輯模塊）。按下鍵盤“shift+a”，就成功添加了一個邏輯模塊。雙擊此模塊，可以發現，它有AND、OR、NOT也就是與、或、非等多種邏輯可選，我們用得最多也就是這三種了。我們是想按下關閉或者發布按鈕，這個頁面都往下彈走，所以這里應該選擇OR。把這兩個接收器插入到邏輯模塊的輸入口，再把邏輯模塊的輸出口插到Switch模塊的Off端口，就可以了。
