想自己利用HTML + CSS + JavaScript製作iOS上頭的數位出版品app的朋友，Baker ebook framework，目前的版本，幾乎只要利用HTML、CSS、JavaScript就可以搞定，幾乎免碰Obj-C。但是如果需要修改到介面的話，可能就需要自己動手改。這framework沒有提供到書架的功能有點可惜，希望以後可以support一本以上的電子書。
http://bakerframework.com
可以配合Laker就可以製作出相當精美的電子書 http://www.lakercompendium.com/
下列連結為有網友中文化的Baker guide
http://b.hjwu.me/blog/2011/11/07/getting-started-with-Baker-framework/
設計
利用 Baker 創建出一本書就像架設一個網站一樣，你所需要的只有
- 一些關於 HTML 跟 CSS 的基本知識
- 編輯網頁的編輯器 (TextMate, iWeb, Dreamwaver, Rapidweaver 等等)
假設上述兩點你都已經具備了，接下來就是回答下面三個問題
- 你要如何將你的書中內容分開成多個 HTML pages ?Baker 做出來的書是由多個 HTML page 所組成。由於 HTML page 並沒有限制內容的長度，所以你可以把一整個章節全部放在單一個 page 內。
- 你是要放在那種平台上 ?Baker 支援 iPhone/iPod 跟 iPad, 所以請選擇你想要放置的平台並針對它去設計你的書。
- 你希望書籍是以何種方向呈現Baker 支援橫向與縱向兩種樣式。選擇一個你喜歡的書籍樣式，或著針對這兩種提供一個漂亮的樣式。
如果你對上面的問題都有了答案，那你你可以開始設計你的書。別忘了你可以利用所有 HTML5 與 CSS3 的特點，以及適用於 WebKit 的 JavaScript libraries. 如果你想要測試你的成果，試著以 Safari Mobile [註1] 方式瀏覽: Baker 呈現的方式正如同它們在你希望的平台。
[註1]應該是指修改 Safari 的 “開發人員” -> “使用者代理程式”。
套件
現在你的書已經準備好了，接下來就打包它成為一個套件然後丟到 Baker 吧:
- 先建立一個名為 “book” 的資料夾，並且複製所有你的書本檔案丟進去 “book” 裡面。所有的 HTML 檔案跟書中內容都需要在 “book” 資料夾中, Baker 只會看到 “book” 資料夾內的內容。
- 再建立一個名為 “book.json” 的檔案，裡面包含了 Baker 所需要的參數，以便 Baker 能正確顯示你的書。這個檔案被稱為 manifest 並且需滿足 HPub 標準。你可以在這裡找到所有參數的完整解釋。在做完上面的步驟後，你的 “book” 資料夾將會是一個 HPub 套件，接著就是讓它轉成 APP 吧。
附註： 你可能注意到，HPub 套件只是一堆 HTML pages。 這意味著，一旦你確定所有 page 彼此被鏈接，你能發佈它在網路上而不用另外的工作以及你的使用者能夠在標準的瀏覽器上閱讀它
第一次建置
現在準備開始使用 Baker，在此之前你還需要兩個東西:
- 最新版本的 Xcode。如果你是註冊過的 Apple developer，你可以從 Apple Developers website 免費下載。 如果你還沒有註冊過, 你可以到這裡註冊. 如果你不想註冊而只是想測試 Baker 在你的機器上，那麼你可以從 Mac App Store 下載。
- 一臺 Mac。很遺憾，在 Windows 上是沒有 Xcode。
準備好了嗎？讓我們開始在模擬器上測試你的 APP 吧:
- 下載最新版本的 Baker Framework package 並將它解壓縮至 Baker 資料夾。
- 將你自己的 “book” 資料夾 取代 Baker 資料夾中預設的 “book” 資料夾。
- 雙擊 Baker.xcodeproj 這個檔案以讓 Xcode 開啓這個 project。
- 檢查左上角的 “Scheme” 是顯示 “Baker > iPad 5.0 Simulator”。
- 點擊 “Run” 按鈕。
如果一切都沒問題的話，你應該會看到你的 Baker app 會在 iPad 模擬器上執行，並且展開妳書本中的第一頁。
如果有出錯的話, 請在完全的清除之後重新再執行一次: 移除模擬器上的 app (就如同你在實際的 iPad 上移除的方法) 然後按 Product -> Clean Build Folder 來清理 Xcode 的建置… (打開 Product 選單時，你需要按alt才能夠看到這個選項)
個人化你的書
你已經快做好了。現在在送上 App Store 前，放一些注意力在你的 app 上。
- 重新命名你的 app在 project 的 Navigator 邊欄上選擇(最上面的) “Baker” 然後按 “enter”：你應該能夠改變名字。重新命名為你想要的(這個將會是你的 APP 在 APP Store 上的名字)。
- 選擇你要建置的機器平台在 Project 的主要視窗 (當你點擊 Project Navigator 的最上方選項，它應該會自動被打開) 點擊 “Build Settings”. 搜尋 “Targeted Device Family” 然後選擇你要的機器平台。
- 選擇適合的 iOS在 Project 的主要視窗點擊 “Info” 的 “Deployment Target” 內的 “iOS Deployment Target” [註2]。選擇你希望你的 APP 可以運行的 iOS 版本: Baker 可以在 iOS 4.0 以上的版本運行。[註2] 原文是 In the Project Build Settings, right under the “Targeted Device Family” entry, you should see another one called “iOS Deployment Target”. 但是我在 “Targeted Device Family” 下並沒有看到，而是在 “Info” 內看到
- 改變你的 APP 圖示你應該為你的 APP 使用個人的圖示。請參照 Apple Custom Icon and Image Creation Guidelines 來製造你的圖示並將它們放到 “Baker” 資料夾內的 “Resource” 資料夾。
- 檢查 Baker 的擴充 HPub 參數除了標準的 HPub 設定之外，Baker 提供一系列的參數來客制化你的書的外觀。這些參數都列在這裡。
就這樣。現在重新再執行你的 app 在模擬器上 : 當你已經準備好的話。
請不要太相信你的模擬器: 記住你的使用者是在真實的 iPad 跟 iPhone 上看你的 APP。請先在實機上測試過後再釋出你的 APP。
發佈在 Apple App Store
在發佈你的 APP 到 App Store 上時，請參照 Apple 提供的詳細教學(需要登入):
- 你在進入 iTunes Connect website 時必須準備好應用程式.
- 你必須依照 iOS Provisioning Portal under Distribution 的指示建立好編譯過的應用程式以釋出。
- 你必須要上傳編譯過的應用程式。
這部分完全由 Apple 控管，所以你可以使用官方的 channels 跟教學來了解如何去做.. 或是在網路上發問。Apple 上也有一些有趣的額外提示。
全部就這樣，歡呼吧 :)
沒有留言:
張貼留言