|
This is the first top component | This is the left component | This is the second top component | This is the right component | This is a ScrollPanel contained at the center of a DockPanel. By putting some fairly large contents in the middle and setting its size explicitly, it becomes a scrollable area within the page, but without requiring the use of an IFRAME.
Here's quite a bit more meaningless text that will serve primarily to make this thing scroll off the bottom of its visible area. Otherwise, you might have to make it really, really small in order to see the nifty scroll bars! | This is the second bottom component | This is the first bottom component |
.pmk-DockPanel {
}
.cw-DockPanel td {
border: 1px solid #BBBBBB;
padding: 3px;
}
|
<?php
include_once 'phpmoko/ui/DockPanel.php';
include_once 'phpmoko/ui/HTML.php';
include_once 'phpmoko/ui/ScrollPanel.php';
class ModuleDemo implements WebModule
{
function getWidget()
{
$dock = new DockPanel();
$dock->setStyleName('cw-DockPanel');
$dock->setSpacing(4);
// Add text all around
$dock->add(new HTML('This is the <i>first</i> top component'), DockStyle::TOP);
$dock->add(new HTML('This is the <i>first</i> bottom component'), DockStyle::BOTTOM);
$dock->add(new HTML('This is the right component'), DockStyle::RIGHT);
$dock->add(new HTML('This is the left component'), DockStyle::LEFT);
$dock->add(new HTML('This is the <i>second</i> top component'), DockStyle::TOP);
$dock->add(new HTML('This is the <i>second</i> bottom component'), DockStyle::BOTTOM);
// Add scrollable text in the center
$contents = new HTML('This is a <code>ScrollPanel</code> contained at '.
'the center of a <code>DockPanel</code>. '.
'By putting some fairly large contents '.
'in the middle and setting its size explicitly, it becomes a '.
'scrollable area within the page, but without requiring the use of '.
'an IFRAME.<br><br>'.
'Here\'s quite a bit more meaningless text that will serve primarily '.
'to make this thing scroll off the bottom of its visible area. '.
'Otherwise, you might have to make it really, really small in order '.
'to see the nifty scroll bars!');
$scroller = new ScrollPanel($contents);
$scroller->setSize('400px', '100px');
$dock->add($scroller, DockStyle::FILL);
// Return the content
$dock->setId('cwDockPanel');
return $dock;
}
}
?>
|
|
