Использование Dojo BorderContainer в скрипте макета Zend Framework - PullRequest
Новая
       16

Использование Dojo BorderContainer в скрипте макета Zend Framework

1 голос
/ 30 сентября 2010

Я только начал играть с использованием Dojo в Zend Framework , и до недавнего времени все было хорошо.Сейчас я хотел бы иметь возможность создать простой графический интерфейс с использованием BorderContainer и ContentPanes , однако я обнаружил, что это немного неудобно.

заставить работать элементы контейнера 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 () .

Мне интересно посмотреть, что все остальные делают собойти эту проблему?

Ответы [ 2 ]

1 голос
/ 19 октября 2010

Просто поместите код макета в начало основного файла макета, что обеспечит выполнение рабочего порядка выполнения. Итак, начните с определения borderContainer и ContentPanes, а затем разместите остальные ниже так:

$ this-> BorderContainer () -> captureStart ( 'главный-контейнер', массив ('design' => 'headline'), массив ( 'Стиль' => 'Высота: 700px; ширина: 1170px', 'align' => 'center' ));

echo $ this-> contentPane ( 'ContentPaneId', $ This-> Render ( '_ header.phtml'), массив ('region' => 'top'), массив ('style' => 'background-color: darkblue; цвет: белый') );

// создаем еще несколько контент-панелей и заканчиваем ..

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

// затем остальная часть скрипта вида, включая dojo ().

0 голосов
/ 25 мая 2011

Я пытался выяснить это сам, и после нескольких часов экспериментов и некоторой помощи из ответа @ 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, иначе он не будет отображаться.
  • Строка echo $this->dojo(); должна идти после операторов borderContainer, иначе помощники Zend не смогут сгенерировать правильный код.
...