*****登入介面製作步驟*****

1、背景色：需要設定的背景色不知道色值，可以使用截圖工具擷取一小塊貼上到axure頁面，
點選頁面樣式中的背景色左上角的取色器點選一下該色塊，即可將背景色全部填充為需要的背景色。
2、logo位置：直接使用截圖工具測量一下logo距離瀏覽器頂部的距離是多少，在頁面中點選圖片元件，
拖到頁面中，選中圖片即可設定選單欄內Y的值。在元件屬性一欄中，匯入logo圖片即可。
【裁剪工具】的使用：可以使圖片的稜角變的更清晰
【分割圖片】的使用：可以分為上下、左右的兩部分和東南西北的四部分三種情況。
【固定邊角範圍】：勾選該選項後會有四個三角，將所有三角向邊框外部拉伸，

4、元件屬性中的【元件提示】即可提現提示框的效果

5、新增互動用例時，用例的執行順序是由上至下的

6、文字框獲取焦點問題：
1）當點選文字框前面的文字說明“使用者名稱”時，游標自動定位到對應的文字框內：
給“使用者名稱”新增互動用例：點選【滑鼠單擊時】--》【獲取焦點】---》【對應的文字框名字】

2）開啟頁面時，游標自動定位到登入表單的第一個輸入框即【使用者名稱】的文字框：

7、按鈕的條件【登入按鈕】
選中登入按鈕---》【滑鼠單擊時】----》【新增用例】----》【新增條件】
若是需要設定多個條件，可點選最右側的“+”即可新增更多的條件（只有當用戶名和密碼的文字值都

*****條件********

選中要設定條件的元件---》【滑鼠單擊時】----》【新增用例】--》【增加條件】即可設定條件
注意：1、新增用例且增加條件的部分都是執行的if後面（即成立且為true）的語句；
2、新增用例但是沒有設定條件的則是執行else的語句（即與if對立的語句）；
3、條件的執行順序是從上至下。
4、當新增用例但是沒有設定條件的用例切換為（if True）時，則將無條件執行該用例，
並將之前的所有用例覆蓋，即使該用例在最後面也是如此。
5、要想用例無條件執行且不會覆蓋之前設定好的條件用例，則需要在被操作的元件之後複製
一個與之相同的元件，且只設置一個不加條件的用例，並把其轉換為（if True）。
6、【元件】-【設定文字】-【設定文字為】-【富文字】--【編輯文字】即可編輯文字樣式

*********深入設定登入框的互動效果***********

1）當用戶名和密碼都不輸入就點選登入：
則提示使用者名稱和密碼不能為空；且游標定位在使用者名稱文字框內

2）當輸入使用者名稱，不輸入密碼就點選登入按鈕：
則會提示密碼不能為空，同時游標定位在密碼的文字框內

3）當不輸入使用者名稱，直接輸入密碼，就點選登入：
則提示使用者名稱不能為空，同時游標定位在使用者名稱的文字框內，且清空密碼文字框。

4）使用者名稱和密碼都不為空時點選登入，
則提示登入驗證。

******動態面板*******

1、定義：能夠實現多種動態效果的多空間元件容器。

1）拖動動態面板到頁面中，雙擊開啟動態面板，雙擊開啟state1即可看到動態面板是
一個帶有虛線的編輯區，透明的但是確實存在的多空間元件，（即生成html元素在
瀏覽器中什麼都看不到）

2）動態面板內部可以放多個基本元件，且可無限放大或縮小

3）若添加了多個狀態，即state2、state3，一般情況顯示第一層（state1）內部的所有元件，
若想顯示第一層之外的元件則在【元件管理】內調整狀態的層級，點擊向上箭頭即可

2、實現效果

1）表單上方的提示元件在沒有點選登入按鈕之前是沒有顯示出來的：
選中所有要操作的元件，右鍵【轉換為動態面板】。選單欄勾選【隱藏】取名tishi，

2）點選登入按鈕後表單整體往下移，且上方顯示提示元件內容
首先將要往下移的元件整體向上移並與提示元件持平。切記：必須持平否則在整個表單在往下移
的時候會出錯。修改登入按鈕的互動效果，雙擊有提示的用例，找到【組織動作】內有提示的文字，
【元件】下【顯示/隱藏】---》【更多選項】--》【推動元件】--》【確定】。

3、使用動態面板須知：【推動元件*】

1）錯誤操作：當多個元件需要同時操作且顯示一樣的效果時可以使用動態面板將元件包含起來
（比如：將所有的提示元件內容使用等同大小的動態面板包含起來。
這樣生成html時就是隱藏的。）。但是有個弊端：提示元件設定的有提示文字，要是但是會使設定
的文字提示失效，即（設定文字於“不明”xxx 也就是找不到）

2）正確操作：選中所有要操作的元件，右鍵【轉換為動態面板】，選單欄勾選【隱藏】即可。

3）修改登入按鈕的互動效果，雙擊有提示的用例，找到【組織動作】內有提示的文字，【元件】
下【顯示/隱藏】---》【更多選項】--》【推動元件】--》【確定】。
注：此時轉換的動態面板大小與元件一樣大，要是直接下移會與表單連在一起，所以需要調整
動態面板的高度，這樣下移就能與表單有一定距離

4）切記：在整個表單在往上移的時候必須與提示元件持平。否則會出錯

*******元件的移動效果*******

1、當用戶名或密碼其中之一沒有輸入，或者兩者輸入了但是驗證不通過的時候點選登入按鈕，表單都會
左右抖動：
選中整個表單元件，右鍵轉換為動態面板，此時登入按鈕已經無法操作，需要雙擊開啟該面板，
再次開啟狀態1才能操作按鈕

2、左右晃動的效果實現原理：【線性*】

1）絕對位置：選中元件後選單欄裡 X 和 Y 的值就是該元件的絕對位置
2）相對距離：將某元件向左移動距離N,相對距離為：X-N;(負值)
該元件向右移動距離M,相對距離為M-X（正值）

3）實現左右晃動的動畫為【線性】【相對距離】
首先將元件向左移動N(負值)，則向右就要移動|2*N|（2倍的N加上絕對值為正值）,
反覆操作幾次後，最後一次需要返回到最開始的位置，所以一定是第一次移動的值N(負值)

4）時間單位：毫秒，值越小表示時間越快

5）注意互動用例的順序，用例是從上至下執行的，表單抖動是在提示資訊顯示後並整體向下移動時
才開始左右抖動的。

6）實現左右晃動的動畫為【線性】【絕對位置】座標為（X,Y）
X值：元件左移M（實際值為：X-M）,向右移動N(實際值為：X+N)；
Y值：元件下移的值H+元件原來的座標值Y；實際值為：H+Y