Monaca溫泉2.0 ons-tabbar材質設計

我正在製作一個新的Monaca溫泉2.0的材質設計應用程序，我使用了ons-toolbar並且工作正常，但我無法理解如何在材質上使用ons-tabbar，一些詭計？Monaca溫泉2.0 ons-tabbar材質設計

<ons-toolbar modifier="material"> WORKS FINE </ons-toolbar> 

<ons-tabbar modifier="material"> NOT WORKING WITH MATERIAL </ons-tabbar>

來源

2016-01-07 Federico González Brizzio

我只看到了與單選按鈕一起使用的材質tabbar，例如在下面的css參考中，但我不確定如何使它像1.x標籤欄一樣平滑。 https://onsen.io/2/reference/css.html –

你可能應該重新說明你的問題。我很想知道如何讓材質修改器顯示出來。其他材質組件工作，但由於某種原因，這個tabbar不會 –

你的代碼是錯誤的，因爲ons-tabbar應始終包含至少一個ons-tab。

看看這CodePen example，一切工作正常。

下面是代碼：

<ons-tabbar modifier="material"> 
    <ons-tab page="comments.html" label="Comments" icon="ion-chatbox-working"></ons-tab> 
    <ons-tab page="tags.html" label="Tags" icon="ion-ios-pricetag"></ons-tab> 
    <ons-tab page="settings.html" label="Settings" icon="ion-ios-cog"></ons-tab> 
</ons-tabbar> 

<ons-template id="home.html"> 
    <ons-toolbar> 
    <div class="center">Home</div> 
    </ons-toolbar> 

    <p style="padding-top: 100px; color: #999; text-align: center">Page Contents</p> 
</ons-template> 

<ons-template id="comments.html"> 
    <ons-toolbar> 
    <div class="center">Comments</div> 
    </ons-toolbar> 

    <p style="padding-top: 100px; color: #999; text-align: center">Page Contents</p> 
</ons-template> 

<ons-template id="tags.html"> 
    <ons-toolbar> 
    <div class="center">Tags</div> 
    </ons-toolbar> 

    <p style="padding-top: 100px; color: #999; text-align: center">Page Contents</p> 
</ons-template> 

<ons-template id="feed.html"> 
    <ons-toolbar> 
    <div class="center">Feed</div> 
    </ons-toolbar> 

    <p style="padding-top: 100px; color: #999; text-align: center">Page Contents</p> 
</ons-template> 

<ons-template id="settings.html"> 
    <ons-toolbar> 
    <div class="center">Settings</div> 
    </ons-toolbar> 

    <p style="padding-top: 100px; color: #999; text-align: center">Page Contents</p> 
</ons-template>

來源

2016-01-08 05:38:13

檢查onsenui.js
其實，我覺得有可能是在莫尼卡項目頁面可能沒有被更新到最新的溫泉UI 2.0。這似乎是我的情況。它可以在第一行說：

/*! onsenui v2.0.0-beta - 2015-11-11 */

你可能需要更新一個像一個安迪Pavllo使用

/*! onsenui v2.0.0-beta.2 - 2015-12-01 */

但是在Github上最新Onsen UI 2.0實際上是

/*! onsenui v2.0.0-beta.5 - 2016-01-08 */

而且你不能換掉你需要安裝整個軟件包的js。

*編輯：我注意到我安裝了新的軟件包後，一切正常，但是當我嘗試使用主題滾輪時，它恢復到舊的標籤欄。所以主題輥可能不會更新。

來源

2016-01-08 20:01:12

這解決了我的問題，使用modifier =「材料」 –

Monaca溫泉2.0 ons-tabbar材質設計

回答

相關問題