Allgemeines zum Umgang mit Page Objekten
Nachdem man sich mit dem GAPTEQ-Designer an einem Repository angemeldet hat, kann man Objekte wie Pages, Images oder Data layer erstellen.
Erstellt man ein Page Objekt, dann entspricht das einer Seite der Applikation, die unter diesem Namen direkt aufgerufen werden kann.
Pages können, wie alle anderen Objekte im Design Objects Explorer, in beliebiger Struktur abgelegt werden und jederzeit per Drag & Drop umorganisiert werden.
Die Namen der Page Objekte und der Verzeichnisse in denen sie abgelegt werden, sind Teil der URL in der Applikation. Deshalb verwenden Sie in Objektnamen keine Sonderzeichen und idealerweise auch keine Leerzeichen.
Im Tutorial möchten wir eine Page erstellen, erste einfache GAPTEQ-Komponenten platzieren und das Ergebnis im Browser betrachten.
Page erstellen
Eine neue Seite erstellen Sie mit Klick auf New. Im New item Dialog wählen Sie Page.
Die neue Page ist noch nicht gespeichert, deshalb klicken Sie auf Save, vergeben einen Dateinamen und speichern die Page.
Page als Startseite festlegen
Jedes Repository benötigt eine definierte Startseite. Deshalb wird beim Erstellen der ersten Page im Repository gefragt, ob man die Page als Startpage festlegen will. Man kann jederzeit eine andere Page als Startseite definieren (Rechtsklick auf ein Page Objekt und Klick auf Set as main page).
Page im Browser aufrufen und den aktuellen Stand der Entwicklung betrachten
Die Seite ist, obwohl sie noch keine Komponenten enthält, nach dem Speichern sofort verfügbar und kann im Browser aufgerufen werden. Durch Klick auf den grünen Start Button können Sie jederzeit die Startseite des Repositories aufrufen und den Fortschritt Ihrer Programmierung betrachten. Der Start Button öffnet die URL Ihrer Applikation in Ihrem Webbrowser. Jede Änderung an der Seite können Sie dann nach einem Reload der Page im Browser betrachten. Da noch keine GAPTEQ-Komponenten auf der Page positioniert sind bekommt man nun eine leere Seite angezeigt.
Komponenten per Drag & Drop in die Page ziehen
Im GAPTEQ-Designer, links von der noch leeren Page, werden die verfügbaren Komponenten aufgelistet. Diese können einfach per Drag & Drop in die Page gezogen und positioniert werden.
In diesem Tutorial verwenden wir erstmal nur Komponenten die keinen Datenbankzugriff benötigen, deshalb platzieren wir in oberster Reihe eine Headline. Anschließend unter der Headline einen Separator (Abstandshalter), ein einfaches Textelement und einen Button.
Inhalte und Eigenschaften von Komponenten ändern
Jede GAPTEQ-Komponente hat unterschiedliche Eigenschaften und stellt andere Events und Actions bereit. Ein Klick auf eine Komponente in der Page zeigt die Eigenschaften der Komponente auf der rechten Seite.
Ändern Sie den Text der zuvor erstellten Headline indem Sie die Headline anklicken. Bei der Eigenschaft Text lässt sich die Überschrift ändern und bei Type stehen unterschiedliche Überschrift-Typen zur Verfügung.
Page im Browser ansehen
Nach dem Speichern können Sie die Page durch Klick auf den grünen Start Button oder durch einen Reload in der bereits geöffneten Seite betrachten.
Weiterführendes
Eine Übersicht welche Komponenten GAPTEQ bereitstellt findet man in unserer GAPTEQ Komponenten-Demo
Ein Einstieg in die Arbeit mit Datenbank-Tabellen, inklusive einem Beispiel, findet ihr im Tutorial Datenbank-Tabellen mit GAPTEQ Komponenten darstellen
