AXURE8.0實現真實撥打電話
本文作者與大家分享AXURE8.0是如何實現真實撥打電話,干貨滿滿,希望對你有幫助。
主要功能:實現撥號、刪除號碼、真實呼叫、判斷、全局變量……
難點:刪除電話號碼
重點:撥號功能:
tel:電話號碼
函數:字符截取函數,LVAR.substr(開始位置,截取長度),this.name:獲取元件名稱
原型:
原型拆解:
1.全局界面
2.輸入號碼
命名:文本框命名為hm,主要接收按鍵按下的內容;
3.按鍵
兩種制作方法:
- 組合:將矩形+數字+字母組合到一起,方便寫交互
- 編輯矩形:將按鍵制作成一個獨立元件,在矩形里輸入數字2,回車換行,再輸入字母ABC,然后調整字符大小即可
命名:以其具體數字或符號命名:如“1”號鍵命名1;“2”號鍵命名2;依此類推,“#”號鍵命名#。這樣我就可以通過[[this.name]],獲取到按鈕內容;
交互:
1.數字按鍵交互—單擊時事件
- 需要完成的動作:將按鍵內容,輸入“輸入號碼”處(注意:電話號碼是以連接的格式進行輸入,所以我們在輸入新的號碼時,先把“hm”框中的內容獲取放在最前面)。
- 因此是“設置文本”動作,如下:
2.刪除鍵交互—單擊時事件
- 需要完成的功能:每單擊一次從”hm”文本框中,將最后一位數字刪除
- 注意:每刪除一個數字后,還需要將新的字符串,放回hm文本框中,因此還是“設置文本”動作
- 表達式解釋:[[LVAR1.substr(0,LVAR1.length-1)]]:將hm的值傳遞給局部變量LVAR1
每單擊一次,從hm文本框中進行截取,0:表示從第一位開始截取,LVAR1.length-1:表示從hm文本框字符位數減1,為截取長度;
3.呼出鍵交互—單擊時
需要完成的動作:呼出撥出的號碼。
打開鏈接—當前窗口—鏈接到URL:tel:[[LVAR1]]。
[LVAR1]]:為hm傳遞的值。
這里加了一個判斷:如果hm文本框有內容,說明有輸入電話號碼,單擊撥號呼出的是hm的內容;如果hm文本框為空,則呼出的應該是歷史呼出的第一個電話號碼,這里可以自字義一個;
4.歷史通話記錄交互
單擊歷史通話記錄,只需要執行撥打當前歷史記錄電話號碼即可:tel:xxxx……
5.當直接按下撥號鍵時,如果沒有撥號碼,這時呼出的電話就應該是,歷史記錄中的第一條記錄,所以我需要判斷撥號鍵的交互;
- 先撥手機號+再單擊呼出鍵
- 直接單擊呼出鍵;
所有交互制作完成,即可預覽;
預覽地址:https://ijdnup.axshare.com
溫馨備注:mac電腦可以直接測試效果,或使用手機進行預覽測試。
原型下載:鏈接:https://pan.baidu.com/s/13rKejhqkU7n6TBOdty1W-Q 密碼:0966
本文由 @松林放牛娃 原創發布于人人都是產品經理。未經許可,禁止轉載
題圖來自 Unsplash,基于 CC0 協議
- 目前還沒評論,等你發揮!