Erstellen eines flüssigen Layouts für ein Agile Platform-Thema

In der OutSystems Agile Platform war ich nie ganz glücklich darüber, dass die Standard-Bildschirmlayouts tabellenbasiert sind. Als Version 6.0 veröffentlicht wurde und ein neues Vorlagensystem enthielt, hoffte ich, dass die Standardvorlagen Tabellen verwenden würden, aber leider nicht. In meinem Rat Catcher-Projekt habe ich mein eigenes Layout von Grund auf mit Containern (die nur ein Widget sind, um ein zu erstellen) und CSS erstellt, was sehr gut funktioniert hat. Bei neueren Projekten habe ich jedoch auf etwas umgestellt, das in Bezug auf Design und Layout noch einfacher zu handhaben ist.

Es ist nicht schwer, das neue Layout zu erstellen. Zunächst beginne ich mit einem der flüssigen Layouts von Matthew James Taylor "The Holy Grail". Besuchen Sie die Seite mit dem gewünschten Layout, zeigen Sie die Quelle an und greifen Sie dann auf das CSS zu. Wechseln Sie zu Ihrem Agile Platform-Thema, bearbeiten Sie das Stylesheet und fügen Sie es in das CSS ein. (Während diese Layouts kostenlos verwendet werden können, akzeptiert Herr Taylor Spenden. Ich habe genug Wert aus diesen Layouts gezogen, um sie für ihn einzubauen.) Öffnen Sie als Nächstes den Layoutbildschirm des Themas. Gehen Sie ganz zum Anfang und platzieren Sie eine Reihe von Containern auf dem Bildschirm in derselben Verschachtelung wie die im Layout. Weisen Sie ihnen dabei nach Bedarf dieselben CSS-Klassen und -Namen zu. Schneiden Sie den Inhalt des vorhandenen Designs vorsichtig aus und fügen Sie ihn in die entsprechenden Behälter ein. Entfernen Sie zum Schluss die Tabelle, die jetzt eine leere Hülle sein sollte.

Voila! Sie haben jetzt ein völlig modernes, CSS-gesteuertes Thema zur Verfügung. Wenn Sie ein anderes Layout verwenden möchten, können Sie die meiste Zeit einfach das richtige CSS aus dem neuen Layout auswählen und einfügen. Bei einem kürzlich durchgeführten Projekt habe ich die zweispaltige Seitenleiste im linken Design verwendet, und das ist auch so In der Nähe des standardmäßigen Agile Platform-Themas, von dem ein anderer Entwickler tatsächlich dachte, ich hätte nur einige Schriftgrößen angepasst. Unter der Haube wurde jedoch ein viel besseres CSS und Layout verwendet, das das Projekt für lange Zeit auf die richtigen Grundlagen stellte. Mit den CSS-Medientypen können wir sie problemlos gut drucken oder auch auf Mobilgeräten gut anzeigen lassen. Dies ist zwar ein wenig mühsam, aber es lohnt sich auf lange Sicht, obwohl ich hoffe, dass OutSystems in Zukunft das Standardthema wie dieses erstellt.

J.Ja.

Lesen Sie meine anderen TechRepublic-Beiträge zu Agile Platform

  • Erstellen eines Anmeldesystems für OutSystems Agile Platform
  • Generieren eindeutiger Zeichenfolgen in Agile Platform
  • Mein Anwendungslebenszyklus in Agile Platform
  • Schreiben Sie einen erweiterten Excel-Datenimport mit Agile Platform
  • Erweiterungen im Integration Studio von Agile Platform vornehmen
  • Importieren vorhandener Datenbankschemata als Agile Platform-Entitäten

© Copyright 2021 | mobilegn.com