Question

我刚刚开始在 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视图助手，在布局脚本命中 $ this-＆gt; dojo（）之前解析了dojo元素。但是，如果我将dojo元素放入布局脚本中，那么在回显 $ this-＆gt; dojo（）之后会解析元素。

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

Answer 1

只需将布局代码放在主布局文件的开头，这将强制执行正常的执行顺序。首先定义borderContainer和ContentPanes，然后将其余部分放在下面：

$这 - ＆GT;使用BorderContainer（） - ＆GT; captureStart（ '主容器'，数组（'design'=＆gt;'标题'），阵列（ '风格'=＆GT; '高度：700像素;宽度：1170px'， 'align'=＆gt; '中央' ））;

echo $ this-＆gt; contentPane（ 'contentPaneId'， $这 - ＆GT;呈现（ '_ header.phtml'）， array（'region'=＆gt;'top'）， array（'style'=＆gt;'background-color：darkblue; color：white'））;

//创建更多contentPanes并以..完成

echo $ this-＆gt; borderContainer（） - ＆gt; captureEnd（'main-container'）;

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

Answer 2

我一直试图自己解决这个问题，经过几个小时的实验和@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>包围或者它不会显示。不知道为什么但是有试图想象的很多挫折那一个。
height: 100%;的css样式必须适用于html, body和。{ borderContainer div或它不会显示。
echo $this->dojo();行必须在borderContainer语句或Zend之后道场助手将无法做到生成正确的代码。

在Zend Framework布局脚本中使用Dojo BorderContainer

2 个答案: