1

我刚刚开始在Zend Framework中使用Dojo ，直到最近一切都很好。现在，我希望能够使用BorderContainer和ContentPanes制作一个简单的 GUI ，但是我发现这有点尴尬。

基本上，为了让容器 Dojo 元素工作，我发现我需要将它们放在视图脚本中，以便 Dojo 工作。但是对我来说，我可以在我的主布局文件 (layouts/scripts/default.phtml) 中放置一些元素是有意义的，因为单个视图脚本应该填充窗格而不是整个页面。

作为一个例子，如果我将它粘贴到渲染 Dojo_Form 的视图中：

<?php
$this->borderContainer()->captureStart('main-container',
    array('design' => 'headline'),
    array(
        'style'=>'height:100%;width:100%',
        'align' => 'left'
    ));

echo $this->contentPane(
'menuPane',
'This is the menu pane',
array('region' => 'top'),
array('style' => 'background-color: gray; color:white')
);

echo  $this->contentPane(
'navPane',
'This is the navigation pane',
array('region' => 'left', 'splitter' => 'true'),
array('style' => 'width: 200px; background-color: lightgray;')
);

echo $this->contentPane(
'mainPane',
$this->form,
array('region' => 'center'),
array('style' => 'background-color: white;')
);

echo $this->contentPane(
'statusPane',
'Status area',
array('region' => 'bottom'),
array('style' => 'background-color: lightgray;')
);

echo $this->borderContainer()->captureEnd('main-container');
?>

但是，如果我尝试将任何元素放入布局中，它就会停止工作。

所以，我很确定我知道为什么会发生这种情况。我假设这是因为通过将 dojo 视图助手放在视图脚本中，dojo 元素在布局脚本命中$this->dojo()之前被解析。但是，如果我将 dojo 元素放入布局脚本中，则在回显$this->dojo()后会解析这些元素。

我有兴趣看看其他人如何解决这个问题？

4

2 回答 2

1

只需将布局代码放在主布局文件的开头，这将强制执行工作顺序。所以从定义borderContainer和ContentPanes开始，然后像这样把剩下的放在下面：

$this->borderContainer()->captureStart('main-container', array('design' => 'headline'), array('style'=>'height:700px;width:1170px', 'align' = > '中心' ));

echo $this->contentPane('contentPaneId', $this->render('_header.phtml'), array('region' => 'top'), array('style' => 'background-color: darkblue;白颜色'） ）;

// 创建更多的 contentPanes 并以..结束

echo $this->borderContainer()->captureEnd('main-container');

// 然后是视图脚本的其余部分，包括 dojo()。

于 2010-10-19T12:08:58.867 回答
0

我一直在尝试自己解决这个问题，经过几个小时的试验和@marijn 回答的一些帮助，我终于让它工作了。

首先，我使用 zend 工具从简洁的设计开始。在命令行类型：

zf create project dojoTest
cd dojoTest
zf enable layout

现在编辑 layout.phtml 文件，如下所示：

<?php echo $this->doctype(); ?>

<html lang="en">
<head>
    <?php echo $this->headMeta(); ?>
    <?php echo $this->headTitle(); ?>
    <?php echo $this->headStyle(); ?>
    <?php echo $this->headLink(); ?>
    <?php echo $this->headScript(); ?>
</head>
<body class="tundra">

<?php 
$this->borderContainer()->captureStart(
        'appLayout', 
        array('design' => 'headline'), 
        array()
);

    echo $this->contentPane(
            'headerPane', 
            'This is the header pane', 
            array('region' => 'top'), 
            array('style' => 'background-color: lightblue;')
    );

    echo $this->contentPane(
            'contentPane', 
            $this->layout()->content, 
            array('region' => 'center'), 
            array()
    );

    echo $this->contentPane(
            'sidePane', 
            'This is the sidebar pane', 
            array('region' => 'right'), 
            array('style' => 'background-color: lightblue;')
    );

    echo $this->contentPane(
            'footerPane', 
            'This is the footer pane', 
            array('region' => 'bottom'), 
            array('style' => 'background-color: lightblue;')
    );

echo $this->borderContainer()->captureEnd('appLayout');
?>

<?php if( $this->dojo()->isEnabled() ) { echo $this->dojo(); } ?>
</body>
</html>

现在编辑您的 Bootstrap.php 文件，如下所示：

<?php
class Bootstrap extends Zend_Application_Bootstrap_Bootstrap
{
    protected function _initView ()
    {
        // Initialize view
        $view = new Zend_View();
        $view->doctype('HTML5');
        $view->setEncoding('UTF-8');
        $view->headTitle('Dojo Layout Test');
        $view->headMeta()->appendName('Content-Type', 'text/html; charset=UTF-8');
        $view->headMeta()->appendName('author', 'Chris OConnell');
        $view->headLink()->appendStylesheet('/css/style.css?v=1', 'all');

        // add dojo helper path to view
        Zend_Dojo::enableView($view);

        // configure Dojo view helper, disable
        $view->dojo()->setCdnBase(Zend_Dojo::CDN_BASE_GOOGLE)
                     ->addStyleSheetModule('dijit.themes.tundra')
                     ->setCdnVersion(1.6)
                     ->setDjConfigOption('parseOnLoad', TRUE)
                     ->disable();       

        // Add it to the ViewRenderer
        $viewRenderer = Zend_Controller_Action_HelperBroker::getStaticHelper('ViewRenderer');
        $viewRenderer->setView($view);

        // Return it, so that it can be stored by the bootstrap
        return $view;
    }
}

现在在公用文件夹中创建一个名为“css”的文件夹，并在该文件夹中创建一个名为“style.css”的文件并添加以下内容：

html, body {
    height: 100%;
    margin: 0;
    overflow: hidden;
    padding: 0;
}

#appLayout {
    height: 100%;
}
#sidePane {
    width: 300px;
}

那应该这样做。

我遇到的几件事给我带来了问题：

  • dojo borderContainer 不能被另一个包围，<div>否则它不会显示。不知道为什么，但在试图弄清楚这一点时感到非常沮丧。
  • 的 css 样式height: 100%;必须应用到html, body和borderContainer div，否则不会显示。
  • 该echo $this->dojo();行必须在borderContainer 语句之后，否则Zend 的dojo 助手将无法生成正确的代码。
于 2011-05-24T22:59:07.363 回答