AXURE8.0實現真實撥打電話

0 評論 8107 瀏覽 19 收藏 6 分鐘

本文作者與大家分享AXURE8.0是如何實現真實撥打電話,干貨滿滿,希望對你有幫助。

主要功能:實現撥號、刪除號碼、真實呼叫、判斷、全局變量……

難點:刪除電話號碼

重點:撥號功能:

tel:電話號碼

函數:字符截取函數,LVAR.substr(開始位置,截取長度),this.name:獲取元件名稱

原型:

原型拆解:

1.全局界面

2.輸入號碼

命名:文本框命名為hm,主要接收按鍵按下的內容;

3.按鍵

兩種制作方法:

  1. 組合:將矩形+數字+字母組合到一起,方便寫交互
  2. 編輯矩形:將按鍵制作成一個獨立元件,在矩形里輸入數字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 協議

更多精彩內容,請關注人人都是產品經理微信公眾號或下載App
評論
評論請登錄
  1. 目前還沒評論,等你發揮!