PDA

Archiv verlassen und diese Seite im Standarddesign anzeigen : Grafical User Interface ähnlich wie in Java


Small-Talk
03.10.2006, 14:27:05
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)


// 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)


<?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 &amp; &quot;Gui&quot;</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.

Opendix
03.10.2006, 18:33:15
hmm kenn mich jetzt damit nicht aus aber gibt es dafür nicht HTML-Klassen:

http://pear.php.net/packages.php?catpid=10&catname=HTML

geht doch in diese Richtung nicht?