Famework7 安卓导航栏

Question

我正在使用 phonegap，framework7 构建一个应用程序。问题是当我在导航栏中使用 framework7 中心类时，它不会居中。但是，如果我在 ios 中使用相同的应用程序，那就很好了。

索引.html

<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no, minimal-ui">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta name="format-detection" content="telephone=no">
<meta name="msapplication-tap-highlight" content="no">
<link rel="stylesheet" href="css/styles.css">

<div class="statusbar-overlay"></div>
<!-- Views -->
<div class="views">
    <!-- Your main view, should have "view-main" class -->
    <div class="view view-main">

        <div class="pages no-toolbar no-navbar">
            <!-- Page, "data-page" contains page name -->
            <div data-page="index" class="page">
                <!-- Scrollable page content -->
                <div class="page-content">
                </div>
            </div>
        </div>
    </div>
</div>
<script src="lib/framework7/js/framework7.min.js"></script>
<script>
  (function () {
    if (Framework7.prototype.device.android) {
          Dom7('head').append(
              '<link rel="stylesheet" href="lib/framework7/css/framework7.material.min.css">' +
              '<link rel="stylesheet" href="lib/framework7/css/framework7.material.colors.min.css">'
          );
      }
      else {
          Dom7('head').append(
              '<link rel="stylesheet" href="lib/framework7/css/framework7.ios.min.css">' +
              '<link rel="stylesheet" href="lib/framework7/css/framework7.ios.colors.min.css">'
          );
      }
  })();
</script>

<script src="http://maps.google.com/maps/api/js" type="text/javascript"></script>
<script type="text/javascript" src="cordova.js"></script>
<script type="text/javascript" src="lib/framework7/js/framework7.min.js"></script>
<script type="text/javascript" src="js/my-app.js"></script>
<script type="text/javascript" src="js/notification.js"></script>

PageThatImTryingToPutTheNavBar.html

<div class="views">
<!-- Your main view, should have "view-main" class -->
<div class="view view-main">   
    <div class="pages navbar-through">
        <!-- Page, "data-page" contains page name -->
        <div data-page="dailyMenu" class="page no-toolbar">
            <!-- Scrollable page content -->
            <div class="page-content">
                <div class="navbar">
                    <div class="navbar-inner">                          
                        <div class="center">Awesome App</div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

Answer 1

根据材料设计规范，应用程序栏标题未居中。

参见材料设计结构here