更多

    Apple 推出 LivePhotosKit JS API 幫你將 Live Photos 嵌入網頁

    Mickey Chan
    Mickey Chan
    愛騎單車的宅,眼鏡娘控。 1.膽固醇跟美味是成正比的; 2.所有人都可以騙,但絕對不能騙自己; 3.賣掉的貨才是錢,不賣的收藏品不值一文; 4.踩單車,是為了吃更多美食! 5.正義的話語,不一定出自正義之人的口;

    【iOS14 升級精讀】怎樣取得 iPhone 畫面上的顏色?

    以往在 iPhone 拍照後想在照片上畫圖寫字的話,都只能選用有限色彩,無法使用照片上的顏色做配襯。大家都好想有個像電腦圖像編輯軟件的「吸管」工具來擷取照片顏色。現在這個功能終於登陸 iOS 14 了!

    Android 版 Xbox 程式公測版推出    齊齊串流主機 Xbox 遊戲

    Microsoft 在今年 1 月讓 Xbox Insider 用戶率先試用 Xbox 主機串流手機遊玩。經過 9 個月預覽, Microsoft 終於向一般公眾開放這功能,並同時推出 Xbox 應用程式( Beta )。這個功能除了可以在 Xbox One 主機上使用之外,當然也可以在 Xbox Series X|S 主機上使用。

    【跳級公測】 iOS 14.2 公測開始

    Apple 今日開放 iOS 14.2 首個測試版給公眾公測,大家可以按照過往 iOS 14 公測程序,登入這個網站進行登記。不過現時 iOS 14.2 公測版不支援 iPhone Xr 、 iPhone 11 和剛推出的 iPad 8 代。

    Live Photos 是自 iPhone6s 推出的拍攝功能之一,讓用戶可以簡單地拍攝三秒鐘有動態的照片。早前 Apple 開放讓開發人可以將 Live Photos 嵌入 App 裡顯示,而今天 Apple 更推出 LivePhotosKit JS API ,讓架網站的人可以將 Live Photos 嵌入 網頁上,而方法就只不過是上載照片和加兩個標籤而已。
    網頁簡易嵌入 Live Photos 方法
    1. 從 iPhone 輸出 Live Photos 到電腦,這會輸出到一個 JPG 檔和一個 MOV 檔;

    使用 Image Capture (Mac) 或 File Explorer (Win) 瀏覽「(你的電腦)> Internal Storage > DCIM 」來匯入 Live Photos;
    使用 Image Capture (Mac) 或 File Explorer (Win) 瀏覽「(你的電腦)> Internal Storage > DCIM 」來匯入 Live Photos;

    2. 在 HTML 檔的 head 部分插入以下一句:

    <script src=」https://cdn.apple-livephotoskit.com/lpk/1/livephotoskit.js」></script>

    3. 在網頁想顯示 Live Photos 位置,插入以下這一段便完成:

    <div data-live-photo
    data-photo-src=“JPG 檔相對路徑”
    data-video-src=“MOV 檔相對路徑”
    data-proactively-loads-video=」true」
    style=」width:圖片顯示闊度;height:圖片顯示高度;」
    ></div>

    我們製了一個示範圍網頁,大家可以到這裡看看效果。

    LivePhotosKit JS 官方文件:按此
    其實, Google 去年在 iOS 就推出了《 Motion Stills 》 App ,可以比較方便地將 Live Photos 變換成 GIF 動畫。不過 GIF 圖檔要容量小就要犧牲畫質,而這個 LivePhotosKit JS 就可以原汁原味呈現 Live Photos 效果,還有 API 可讓大家以程式來控制播放。
    下載 Motion Stills iOS 版:按此

    Google 的《 Motion Stills 》 App ,可以將 Live Photos 變換成 GIF 動畫,好處是方便,缺點是畫質受限亦沒有控制播放的方法。
    Google 的《 Motion Stills 》 App ,可以將 Live Photos 變換成 GIF 動畫,好處是方便,缺點是畫質受限亦沒有控制播放的方法。

    您會感興趣的內容

    相關文章