0

更新：已解决

我有默认的 Polymer Starter Kit（高级）布局，其结构如下所示

<template>
    <paper-drawer-panel id="paperDrawerPanel" force-narrow>
            <paper-header-panel drawer fixed>
                <paper-toolbar id="drawerToolbar">                    
                </paper-toolbar>

            <!-- Drawer Content --> 

             </paper-header-panel>

        <paper-scroll-header-panel main id="headerPanelMain" condenses keep-condensed-header>
             <paper-toolbar id="mainToolbar" class="tall">
                <paper-icon-button id="paperToggle" icon="menu" paper-drawer-toggle></paper-icon-button>
              <!-- Toolbar icons -->

                <div class="middle middle-container">
                <div class="app-name">appname</div>
              </div>
            </paper-toolbar>                       

            <div class="content">
             <iron-pages attr-for-selected="data-route" selected="{{route}}">

                <section>
                </section>

                <section>
                </section>

             </iron-pages>
           </div>   
         </paper-scroll-header-panel>
     </paper-drawer-panel>
</template>

但是当我尝试使用paper-header-panel而不是paper-scroll-header-panel时，所有iron-pages结构都消失了。我知道这是由于paper-scroll-header-panel和paper-header-panel之间的 CSS 差异而发生的

PS我已经安装并导入了paper-header-panel

问题是我不希望我的工具栏很高，然后在滚动时逐渐压缩（这就是为什么我尝试用 paper-header-panel 替换它的原因），我希望它始终是压缩的（就像你使用时的接缝模式一样paper-header-panel，但在这种情况下，铁页不起作用，这就是问题所在）。

问题是

  • 如何使该纸张滚动标题面板始终保持压缩，而不仅仅是在您向下滚动时
  • 或者如果这是不可能的，我如何用纸张标题面板替换它并使其与<iron-pages>
4

1 回答 1

0

想出了解决办法。

对于那些会遇到同样问题的人

用固定替换condenses keep-condensed-header

然后从工具栏中删除class="tall"

像那样

  <paper-scroll-header-panel main id="headerPanelMain" fixed>
        <paper-toolbar id="mainToolbar">
         ...

它不会凝结+您将有工作<iron-pages>路线

于 2016-04-28T15:45:16.993 回答