Hi Ihr,
ich hatte letztens wieder einmal probleme mit unterschiedlichen Browsern und der anzeige von bestimmten elementen in HTML. Habe mir gedacht, dass könnte man doch so oder so ähnlich in PHP HTML-Seiten erstellen, wie man auch in Java GUI's baut.
Für Feedback wäre ich sehr dankbar.
Hir mal nen Beispiel-Code, wie man solch eine Bibliothek nutzen könnte:
(Das Beispiel funktioniert schon)
PHP-Code:
// Erstellen einer neuen Gui-Instance
$gui = new Mabe_Gui('display');
$gui->setEncoding('UTF-8');
// Hauptfenster konfigurieren
$gui->getMainFrame()->setTitle(new Mabe_String('Erstellt mit Mabe & "Gui"'));
$gui->getMainFrame()->setBackgroundColor(0xF8F8F8);
// Erstellen eines scrollbaren elements
// + konfigurieren dieses Elements
$mainPanel = new Mabe_Gui_Element_ScrollPane($gui, 'mainPanel');
$mainPanel->setSize(900, 570);
$mainPanel->setAlign(Mabe_Gui::ALIGN_CENTER + Mabe_Gui::ALIGN_TOP);
$mainPanel->setBorder(Mabe_Gui::BORDER_STYLE_SOLID, 0xAAAAAA, 1);
$mainPanel->setMargin(0, 10, 0, 10);
// Element zum Hauptfenster hinzufühgen
$gui->getMainFrame()->setContent($mainPanel);
// weitere Elemente erstellen
// + konfigurieren
// + hinzufühgen
$mainPanel->setContent(new Mabe_Gui_Element_Frame($gui, 'frame'));
$gui->getElement('frame')->setContent(new Mabe_Gui_Element_Label($gui, 'text'));
$gui->getElement('frame')->setTitle(new Mabe_Gui_Element_Text($gui, 'title'));
$gui->getElement('text')->setText(new Mabe_String('Hallo Welt', 'UTF-8', 'plain'));
$gui->getElement('frame')->setSize(150, 100, null, Mabe_Gui::MEASURE_PERCENT);
$gui->getElement('frame')->setAlign(Mabe_Gui::ALIGN_LEFT + Mabe_Gui::ALIGN_MIDDLE);
$gui->getElement('text')->setAlign(Mabe_Gui::ALIGN_CENTER + Mabe_Gui::ALIGN_MIDDLE);
$gui->getElement('text')->setBorder(Mabe_Gui::BORDER_STYLE_SOLID, 0xFF0000, 1);
$gui->getElement('title')->setText(new Mabe_String('Navigation', 'UTF-8', 'plain'));
$gui->getElement('title')->setSize(130, 20);
$gui->getElement('title')->setAlign(Mabe_Gui::ALIGN_RIGHT + Mabe_Gui::ALIGN_TOP);
$gui->getElement('title')->getBorder()->setLeftStyle(Mabe_Gui::BORDER_STYLE_DOTTED);
$gui->getElement('title')->getBorder()->setLeftDimension(1);
$gui->getElement('title')->getBorder()->setLeftColor(0xFF0000);
$gui->getElement('title')->getBorder()->setTopStyle(Mabe_Gui::BORDER_STYLE_DOTTED);
$gui->getElement('title')->getBorder()->setTopDimension(1);
$gui->getElement('title')->getBorder()->setTopColor(0xFF0000);
$gui->getElement('title')->getBorder()->setRightStyle(Mabe_Gui::BORDER_STYLE_DOTTED);
$gui->getElement('title')->getBorder()->setRightDimension(1);
$gui->getElement('title')->getBorder()->setRightColor(0xFF0000);
// anzeigen aller Elemente
echo $gui->render();
Dabei kommt raus:
(Habe leider grad keinen Server zur hand läuft lokal,
also zum angucken in ne html-datei kopieren)
Code:
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" dir="ltr">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
<meta http-equiv="Content-Script-Type" content="text/javascript" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<title>Erstellt mit Mabe & "Gui"</title>
<style type="text/css">
body, html {
height: 100%;
width: 100%;
margin: 0px;
padding: 0px;
overflow: auto;
}
p {
margin: 0px;
padding: 0px;
}
</style>
<style type="text/css">
#main {
height: 100%;
width: 100%;
border-left-style:none;border-left-color:#000000;border-left-width:0px;border-top-style:none;border-top-color:#000000;border-top-width:0px;border-right-style:none;border-right-color:#000000;border-right-width:0px;border-bottom-style:none;border-bottom-color:#000000;border-bottom-width:0px;
margin-left:0px;
margin-top:0px;
margin-right:0px;
margin-bottom:0px;
background-color:#f8f8f8;
}
#mainPanel {
height: 570px;
width: 900px;
border-left-style:solid;border-left-color:#aaaaaa;border-left-width:1px;border-top-style:solid;border-top-color:#aaaaaa;border-top-width:1px;border-right-style:solid;border-right-color:#aaaaaa;border-right-width:1px;border-bottom-style:solid;border-bottom-color:#aaaaaa;border-bottom-width:1px;
margin-left:0px;
margin-top:10px;
margin-right:0px;
margin-bottom:10px;
}
#frame {
height: 100%;
width: 150px;
border-left-style:none;border-left-color:#000000;border-left-width:0px;border-top-style:none;border-top-color:#000000;border-top-width:0px;border-right-style:none;border-right-color:#000000;border-right-width:0px;border-bottom-style:none;border-bottom-color:#000000;border-bottom-width:0px;
margin-left:0px;
margin-top:0px;
margin-right:0px;
margin-bottom:0px;
}
#text {
height: 100%;
width: 100%;
border-left-style:solid;border-left-color:#ff0000;border-left-width:1px;border-top-style:solid;border-top-color:#ff0000;border-top-width:1px;border-right-style:solid;border-right-color:#ff0000;border-right-width:1px;border-bottom-style:solid;border-bottom-color:#ff0000;border-bottom-width:1px;
margin-left:0px;
margin-top:0px;
margin-right:0px;
margin-bottom:0px;
}
#title {
height: 20px;
width: 130px;
border-left-style:dotted;border-left-color:#ff0000;border-left-width:1px;border-top-style:dotted;border-top-color:#ff0000;border-top-width:1px;border-right-style:dotted;border-right-color:#ff0000;border-right-width:1px;border-bottom-style:none;border-bottom-color:#000000;border-bottom-width:0px;
margin-left:0px;
margin-top:0px;
margin-right:0px;
margin-bottom:0px;
}
</style>
</head>
<body>
<table cellpadding="0" cellspacing="0" border="0" style="height:100%;width:100%;">
<tr>
<td align="left" valign="top"><table id="main" cellpadding="0" cellspacing="0" border="0">
<tr>
<td><table cellpadding="0" cellspacing="0" border="0" style="height:100%;width:100%;">
<tr>
<td align="center" valign="top"><table id="mainPanel" cellpadding="0" cellspacing="0" border="0">
<tr><td><div style="table-layout:fixed;overflow:auto;width:900px;height:570px;"><table cellpadding="0" cellspacing="0" border="0" style="height:100%;width:100%;">
<tr>
<td align="left" valign="middle"><table id="frame" cellpadding="0" cellspacing="0" border="0">
<tr>
<th><table cellpadding="0" cellspacing="0" border="0" style="height:100%;width:100%;">
<tr>
<td align="right" valign="top"><table id="title" cellpadding="0" cellspacing="0" border="0">
<tr><td align="right" valign="top">Navigation</td></tr>
</table></td>
</tr>
</table></th>
</tr>
<tr>
<td style="height:100%;"><table cellpadding="0" cellspacing="0" border="0" style="height:100%;width:100%;">
<tr>
<td align="center" valign="middle"><table id="text" cellpadding="0" cellspacing="0" border="0">
<tr><td align="center" valign="middle">Hallo Welt</td></tr>
</table></td>
</tr>
</table></td>
</tr>
</table></td>
</tr>
</table></div></td></tr>
</table></td>
</tr>
</table></td>
</tr>
</table></td>
</tr>
</table>
</body>
</html>
Feedback gewünscht.