底部工具栏中的“启动UI操作”按钮

我需要在下面的问题上得到帮助,这是我几天都在努力解决的问题。

我正在尝试将onsen ui框架中的块组合起来,以创建一个固定的脚踏板,该脚踏板将具有下面带有图标和文本的动作按钮,而不会在其中加载其他页面的内容,就像我在

    <ons-list-item style="text-align:center;padding-top:4px;"modifier="action-buttons">
        <ons-row  class="action">
          <ons-col class="action-col"> 
            <div class="action-icon">
              <ons-icon icon="ion-ios-calendar-outline"></ons-icon></div>
            <div class="action-label">Check Now</div>
          </ons-col>
          ....

        </ons-row>
    </ons-list-item>
  </ons-list>

http://codepen.io/Cadmos/pen/BybqpR/

这是因为它不是一个固定的页脚,在您到达页面内容的底部之前不会显示。

我尝试结合使用底部工具栏模拟不同的版本,该工具栏用于固定页脚,但不成功,因为它不会在图标下方显示任何文本,并且会在其中加载其他页面的内容(我不希望)

<ons-bottom-toolbar>
    <div class="tab-bar">
      <label ng-click="menu.setMainPage('home.html')" class="tab-bar__item">
        <input type="radio" name="tab-bar-b">
             <button class="tab-bar__button">
               <ons-icon icon="fa-twitter" fixed-width="true"></ons-icon>Home
             </button>
      </label>
      ......
    </div>
  </ons-bottom-toolbar>

http://codepen.io/Cadmos/pen/JozmEQ/

当加载其他页面的内容时,它还会导致左上角的幻灯片菜单显示两次。

纯格式的底部工具栏将非常适合我的需要,但它应该只存在于母版页内显示其他页面的不同内容(我不希望这样),这也使得菜单工具栏在存在时可以加载两次