axure商城

Axure RP 9和10如何在手機主屏幕上添加原型圖標

有同學提問:在Axure RP 9 /10中創建的原型演示地址,如何添加自定義圖標到手機桌面。這是 RP 8 中的標準功能,不幸的是Axure RP 9 /10上被取消了。

好消息:利用Axure Cloud的插件功能我們可以很容易實現這個效果。

我們可以使用 JS代碼在原型的 <head> 中添加所需的圖標圖像鏈接,JS代碼會自動包含在每個原型中。

先決條件

  • 您需要將原型發布到官方Axure Cloud
  • 您需要一個地方來托管您的圖標圖像,并且需要可以通過https訪問(可以在本文評論中上傳圖標,備注一下是用作原型演示圖標,我們就不會刪除。)

步驟

1、登錄您的 Axure Cloud 儀表板,然后轉到您要為其添加圖標的項目。

2、向項目添加“插件”

3、將插件設置為“bottom of <body>”

4、將以下代碼/ javascript添加到插件并將您的 url 修改為你自己的圖標:

<script>
(function($) {
$(document).ready(function() {
let url = 'https://cdn2.axureshop.com/wp-content/uploads/2018/05/starshop.png'; //<- 修改為你自己的圖標地址,必須是https
$('head', window.parent.document).append('<link rel="apple-touch-icon" sizes="128x128" href="'+url+'">');
$('link[rel="shortcut icon"]', window.parent.document).attr("href", url);
});
})(jQuery);
</script>

5、將插件包含到所有頁面。

現在,當您將原型添加到您的移動主屏幕時,您將看到一個您指定的漂亮圖標!

如何添加到手機主屏幕?

復制你的演示地址,蘋果手機用Safari瀏覽器打開,底部下方正中間的分享圖標點開。找到【添加到主屏幕】就可以了。

注意,只在蘋果手機上測試了。理論上來說在安卓手機上也是一樣的,大家可以試一試。

 

給TA買糖
共{{data.count}}人
人已贊賞
高級教程

MAC安裝Axure后打開提示:“Axure RP 9.app已損壞,無法打開。”的解決辦法

2021-6-7 14:40:55

產品經理高級教程

【產品設計】云服務產品維護方案(二)

2021-7-8 12:21:03

axure商城
9 條回復 A文章作者 M管理員
  1. 47啊

    111

  2. ??108324

    支持

  3. 迎鑫

    lihailihai

  4. NanJn

    ??

  5. NanJn

    zan

  6. 彭大仙

    干貨

  7. 坦

    很棒呀

  8. mark102765

    ????????

?
個人中心
購物車
優惠劵
今日簽到
有新私信 私信列表
搜索
俄罗斯videoxxxoo