更改工具栏 OnsenUi 的颜色

Question

我正在为我的网络应用程序使用 OnsenUi 框架。我需要知道有什么方法可以根据页面的颜色更改工具栏的颜色。也就是说，喜欢Android 5 工具栏颜色效果。

如果可能的话，你能分享一下如何做的片段吗？

如果不是，你能告诉我在哪里手动更改颜色代码，这样我就可以模仿那种效果。我发现，我可以在 .navigation-bar 背景颜色中更改工具栏的颜色，但它使工具栏在每个页面中只显示一种颜色。谁能告诉我在哪里修改以获得不同页面的不同颜色？

更新 #1

我尝试了一个简单的方法

<ons-toolbar style="background-color:#B1797A;>

但这会破坏我的导航！！

如有任何帮助，我们将不胜感激。谢谢大家。

Answer 1

在您的 document.ready 处理程序中，获取 body 元素的背景色并将其传递到您的工具栏，如下所示：

$(document).ready(function () {
    var bgColor = $('body').css("background-color");
    $('.navigation-bar').css("background-color", bgColor);
});

您也可以在单击按钮时看到它发生，在此演示中：

Answer 2

你可以试试这个：

这个方法对我有用。

Changing the color of toolbar OnsenUi