close

妙用 jQuery Mobile Toolbars 設計及製作手機應用程式 @ compbrother 腦爸打

 

小知識教學類型: 手機應用程式開發

手機應用程式Apps 並不像網站程式有著足夠大的空間,在有限的手機界面中如何有效地整理及展示資訊,是每位手機應用程式開發者必需要處理的課題,而jQuery Mobile Toolbars則提供了這方面的方便性。

Header Bars
- 手機程式頂端的Toolbars,通常位處logo旁,可以分為左上或右上的工具列,例如:
data-role="header", class="ui-btn ui-icon-home ui-btn-icon-left" 用以創建左上角的 Mobile Header Toolbars 按鈕

data-role="header", class="ui-btn ui-btn-right ui-icon-home ui-btn-icon-left" 用以創建右上角的 Mobile Header Toolbars 按鈕

Footer Bars
- 手機程式底端的Toolbars,通常位處底部中間的工具列,例如:
data-role="footer", class="ui-btn ui-icon-plus ui-btn-icon-left"

而 Header Bars 或 Footer Bars 皆可以重新被Positioning:
- Inline - 默認選項,頁頂和頁腳與頁面內容內聯
- Fixed - 頁頂和頁腳將保持在頁面的頂部和底部
- Fullscreen - 表現得像固定的,頁頂和頁腳將保持在頂部和底部,但也位於頁面內容之上,也有點透視感

手機應用程式開發員只要好好善用jQuery Mobile Toolbars,就可以在有限的手機界面上有條理地展示上資料,對手機UI有著莫大的幫助!


 

如需協助 「手機應用程式開發」 ,歡迎立即 聯絡我們!

 

 

https://compbrother.com/article/view.php?article_id=120

arrow
arrow
    創作者介紹
    創作者 腦爸打 的頭像
    腦爸打

    腦爸打 CompBrother 部落格

    腦爸打 發表在 痞客邦 留言(0) 人氣()