Question

也许我错过了一些东西，但是如果你使用“入门”模板作为你的基本模型，那么在Sencha Touch中你似乎无法使用CSS的特定面板定位TitleBar。

Main.js（包含TitleBar）调用所有其他面板，因为其他面板是Main.js的子节点，其中TitleBar是这样的，因此子节点不能设置父节点的背景颜色。在这种情况下，如果您希望屏幕底部的导航栏（TitleBar）将Home.js页面中的颜色更改为您的子页面，则无法进行此操作。有人找到了解决方法吗？

<div class="Sencha-App">
    <div class="Panel"></div>
    <div class="TitleBar"> </div>
</div>

如果TitleBar是Panel的孩子，但是因为它只是你的Sencha-App的孩子，所以没有办法用CSS制作TitleBar动态，这个问题很容易解决。这是否意味着我唯一可以做的就是使用JavaScript来查找是否有一个等于“myPanel”的类，如果是这样，将TitleBar的背景设置为某种颜色？或者使用除了他们在“入门”教程中使用的其他架构？

Answer 1

可能这可以帮到你......
要更改工具栏的颜色/样式，您可以在.scss文件中创建特定的UI 并使用指南针编译它，它将反映.css文件中的更改然后只需将此UI设置为工具栏

$ base-color：＃279806;
$ base-gradient：'有光泽';
$基地活性：＃279806;
@include sencha-tabbar-ui（'TabUI'，$ base-color，$ base-gradient，$ base-active）;

var tabPanel = new Ext.TabPanel（{ 用户界面： 'TabUI' }）;

Sencha Touch 2：背景CSS按面板更改

1 个答案: