Entwicklung einer MVC-Komponente/Hinzufügen eines Views zum Seitenbereich
From Joomla! Documentation
< J3.x:Developing an MVC Component
Artikel in dieser Serie
Hinzufügen eines Menütyps zum Seitenbereich
Hinzufügen eines Models zum Seitenbereich
Hinzufügen einer variablen Anfrage zum Menütyp
Benutzung der Datenbank
Backend-Grundlagen
Hinzufügen von Sprachen
Hinzufügen von Aktionen im Backend
Hinzufügen von Dekorationen zum Backend
Hinzufügen von Validierungen
Hinzufügen von Kategorien
Hinzufügen einer Konfiguration
Hinzufügen eines Installations-/Deinstallations-/Aktualisierungs-Skriptes
Hinzufügen eines Formulars im Frontend
Benutzung des Sprachenfilters
- Hinzufügen von Modalen
- Hinzufügen von Verknüpfungen
- Hinzufügen der Freigabe/Sperrung von Elementen
- Hinzufügen von Sortierungen
- Hinzufügen von Ebenen
- Hinzufügen von Versionen
- Hinzufügen von Schlagwörtern (Tags)
- Hinzufügen von Zugriffsebenen
- Hinzufügen von Stapelverarbeitungen
- Hinzufügen eines Cache-Speichers
- Hinzufügen eines Feeds
Hinzufügen eines Aktualisierungs-Servers
Dies ist eine Artikel-Serie mit Tutorials über die Entwicklung einer Modal-View-Controller Komponente für Joomla! Version.
Beginne mit der Einführung und navigiere durch die Artikel dieser Serie mit Hilfe des Buttons am Ende der Seite oder der Box auf der rechten Seite ("Artikel in dieser Serie").
Hinweise
Dieses Tutorial ist ein Teil der Artikel-Serie Entwicklung einer MVC-Komponente für Joomla! 3.2. Es wird empfohlen, vor der Arbeit mit diesem Teil die vorherigen Teile des Tutorials zu lesen.
- Um der Komponente Hello World! einen View (eine Ansicht) hinzuzufügen, können die folgenden Schritte durchlaufen werden. Alternativ kann das entsprechende Zip-Archiv heruntergeladen werden.
- Während das Tutorial durchlaufen wird, können Probleme auftreten. In diesem Fall kann die Seite Code debuggen sehr hilfreich sein.
Dieses Tutorial wird von dem Video Step 2, Adding a View begleitet.
Hinzufügen einer Ansicht zu Hello World!
In diesem Artikel werden wir uns damit befassen, wie man eine Ansicht zu einer Joomla!-Komponente hinzufügt. Für dieses Beispiel werden wir weiterhin an der Komponente Hello World! arbeiten.
Für die Aktualisierung einer Joomla!-Komponente gibt es mehrere Möglichkeiten. In diesem Tutorial konzentrieren wir uns auf Option 2.
1 | Manuelles Hinzufügen der Dateien zu <pfad_zu_joomla>/ |
2 | Aktualisierung unter Verwendung des Joomla! Extension Managers (Menüeintrag: Erweiterungen) und des ursprünglichen, nicht komprimierten Verzeichnisses, das für die Installation der Komponente verwendet wurde |
3 | Aktualisierung mit dem Joomla! Extension Manager und einem Update-Server |
Um eine Ansicht hinzuzufügen, müssen wir zu com_helloworld navigieren, dem ursprünglichen Verzeichnis, das wir für unsere Komponente erstellt haben. Die folgenden Dateien müssen mit einem Datei-Manager erstellt bzw. aktualisert werden. Dabei wird für jede Datei der Quellcode hinzugefügt, der unter Datei-Details aufgeführt ist.
1 | Aktualisieren: helloworld.php | <path_to_com_helloworld>/site/helloworld.php |
2 | Erstellen: controller.php | <path_to_com_helloworld>/site/controller.php |
3 | Erstellen: index.html | <path_to_com_helloworld>/site/views/index.html |
4 | Erstellen: index.html | <path_to_com_helloworld>/site/views/helloworld/index.html |
5 | Erstellen: view.html.php | <path_to_com_helloworld>/site/views/helloworld/view.html.php |
6 | Erstellen: default.php | <path_to_com_helloworld>/site/views/helloworld/tmpl/default.php |
7 | Erstellen: index.html | <path_to_com_helloworld>/site/views/helloworld/tmpl/index.html |
8 | Aktualisieren: helloworld.xml | <path_to_com_helloworld/helloworld.xml |
Aktualisierung der Komponente Hello World!
Um die Hello World-Komponente in der Joomla!-Website zu aktualisieren, folgen wir den gleichen Schritten wie bei der ursprünglichen Installation.
Details der Dateien
site/helloworld.php (Note that some browsers may not copy and paste highlighted text correctly into a text editor. If you find this, then please try a different browser).
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2018 Open Source Matters, Inc. All rights reserved.
* @license GNU General Public License version 2 or later; see LICENSE.txt
*/
// No direct access to this file
defined('_JEXEC') or die('Restricted access');
// Get an instance of the controller prefixed by HelloWorld
$controller = JControllerLegacy::getInstance('HelloWorld');
// Perform the Request task
$input = JFactory::getApplication()->input;
$controller->execute($input->getCmd('task'));
// Redirect if set by the controller
$controller->redirect();
site/controller.php
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2018 Open Source Matters, Inc. All rights reserved.
* @license GNU General Public License version 2 or later; see LICENSE.txt
*/
// No direct access to this file
defined('_JEXEC') or die('Restricted access');
/**
* Hello World Component Controller
*
* @since 0.0.1
*/
class HelloWorldController extends JControllerLegacy
{
}
site/views/helloworld/view.html.php
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2018 Open Source Matters, Inc. All rights reserved.
* @license GNU General Public License version 2 or later; see LICENSE.txt
*/
// No direct access to this file
defined('_JEXEC') or die('Restricted access');
/**
* HTML View class for the HelloWorld Component
*
* @since 0.0.1
*/
class HelloWorldViewHelloWorld extends JViewLegacy
{
/**
* Display the Hello World view
*
* @param string $tpl The name of the template file to parse; automatically searches through the template paths.
*
* @return void
*/
function display($tpl = null)
{
// Assign data to the view
$this->msg = 'Hello World';
// Display the view
parent::display($tpl);
}
}
site/views/helloworld/tmpl/default.php
<?php
/**
* @package Joomla.Administrator
* @subpackage com_helloworld
*
* @copyright Copyright (C) 2005 - 2018 Open Source Matters, Inc. All rights reserved.
* @license GNU General Public License version 2 or later; see LICENSE.txt
*/
// No direct access to this file
defined('_JEXEC') or die('Restricted access');
?>
<h1><?php echo $this->msg; ?></h1>
index.html Hinweis: Diese Datei wird in allen Ordnern verwendet.
<html><body bgcolor="#FFFFFF"></body></html>
helloworld.xml
<?xml version="1.0" encoding="utf-8"?>
<extension type="component" version="3.0" method="upgrade">
<name>Hello World!</name>
<!-- The following elements are optional and free of formatting constraints -->
<creationDate>January 2018</creationDate>
<author>John Doe</author>
<authorEmail>john.doe@example.org</authorEmail>
<authorUrl>http://www.example.org</authorUrl>
<copyright>Copyright Info</copyright>
<license>License Info</license>
<!-- The version string is recorded in the components table -->
<version>0.0.2</version>
<!-- The description is optional and defaults to the name -->
<description>Description of the Hello World component ...</description>
<update> <!-- Runs on update; New since J2.5 -->
<schemas>
<schemapath type="mysql">sql/updates/mysql</schemapath>
</schemas>
</update>
<!-- Site Main File Copy Section -->
<!-- Note the folder attribute: This attribute describes the folder
to copy FROM in the package to install therefore files copied
in this section are copied from /site/ in the package -->
<files folder="site">
<filename>index.html</filename>
<filename>helloworld.php</filename>
<filename>controller.php</filename>
<folder>views</folder>
</files>
<administration>
<!-- Administration Menu Section -->
<menu link='index.php?option=com_helloworld'>Hello World!</menu>
<!-- Administration Main File Copy Section -->
<!-- Note the folder attribute: This attribute describes the folder
to copy FROM in the package to install therefore files copied
in this section are copied from /admin/ in the package -->
<files folder="admin">
<!-- Admin Main File Copy Section -->
<filename>index.html</filename>
<filename>helloworld.php</filename>
<!-- SQL files section -->
<folder>sql</folder>
</files>
</administration>
</extension>
Erklärung des Codes
Hier wird erklärt, wie der Code funktioniert.
helloworld.php
defined('_JEXEC') or die('Restricted access');
Dieser Code schafft einen sicheren Einstiegspunkt in die Joomla!-Plattform. Unter JEXEC wird die Funktionsweise im Detail erklärt.
$controller = JControllerLegacy::getInstance('HelloWorld');
JControllerLegacy ist eine Basisklasse für einen Joomla!-Controller. Damit unsere Website Controller verwenden kann, müssen wir diese Klasse für unsere Komponente erweitern. Die statische Methode getInstance der Klasse JControllerLegacy erzeugt einen Controller. Im obigen Code wird sie ein Controller-Objekt einer Klasse namens HelloWorldController erzeugen. Joomla sucht in <pfad_zu_joomla>/htdocs/components/com_helloworld/controller.php nach der Deklaration dieser Klasse.
$input = JFactory::getApplication()->input;
$controller->execute($input->getCmd('task'));
Nachdem der Controller erstellt wurde, weisen wir ihn an, die in der URL definierte Aufgabe auszuführen: <IhreWebsite>/joomla/index.php?option=com_helloworld&task=<task_name>. Wenn keine task (Aufgabe) definiert ist, wird standardmäßig display angenommen. Wenn display verwendet wird, entscheidet die Variable view, was angezeigt wird. Andere übliche tasks sind save (Speichern), edit (Bearbeiten), new (Neu) usw.
$controller->redirect();
Der Controller kann entscheiden, die Seite umzuleiten. Das passiert normalerweise, nachdem eine Aufgabe wie 'Speichern' abgeschlossen ist. Diese Anweisung kümmert sich um die eigentliche Umleitung.
Der Haupteingangspunkt unserer Komponente, helloworld.php, übergibt im im Grunde die Kontrolle an den Controller, der die Ausführung der in der Anfrage angegebenen Aufgabe übernimmt. Unser komponentenspezifischer Controller tut nichts anderes als die übergeordnete Klasse, weshalb unsere Controllerklasse leer ist.
controller.php
class HelloWorldController extends JControllerLegacy
{
}
Wenn in den Variablen in der URL keine task angegeben ist, wird die Standardaufgabe display ausgeführt. Die Klasse JControllerLegacy hat eine solche Aufgabe. In unserem Beispiel wird sie eine Ansicht namens HelloWorld anzeigen.
view.html.php
class HelloWorldViewHelloWorld extends JViewLegacy
{
function display($tpl = null)
{
// Assign data to the view
$this->msg = 'Hello World';
// Display the view
parent::display($tpl);
}
}
Die Ansicht konfiguriert den auszugebenden Text und ruft dann die Basis-Klasse für die Ansicht auf. JViewLegacy ist eine solche Basisklasse für eine Joomla!-Ansicht. In unserem Fall zeigt diese Methode Daten mit Hilfe der Datei tmpl/default.php an.
Achtung: Wenn individueller JavaScript-Code verwendet werden soll, sollte dieser nicht die view-Datei eingefügt werden. Möglicherweise wird der Code nicht eingebunden, wenn Caching aktiviert ist. Diese Skripte sollten stattdessen in den Controller eingebunden werden. Siehe auch das entsprechende Problem im Issue-Tracker.
default.php
<h1><?php echo $this->msg; ?></h1>
Dies ist unsere Template-Datei, die über die Klasse JViewLegacy eingebunden wird. Daher bezieht sich $this hier auf die Klasse HelloWorldViewHelloWorld.
helloworld.xml
<version>0.0.2</version>
Aktualisiert die Versionsnummer.
<filename>controller.php</filename>
<folder>views</folder>
Hier weisen wir die Installationsanwendung an, die Datei controller.php und das Verzeichnis views hinzuzufügen.
Inhalte der Komponente
An diesem Punkt sollte unsere Komponente die folgenden Dateien enthalten:
1 | helloworld.xml | Dies ist eine XML-Datei (Manifest), die Joomla! mitteilt, wie unsere Komponente installiert werden soll. |
2 | site/helloworld.php | Dies ist der Einstiegspunkt zur Komponente Hello World! |
3 | site/index.html | Verhindert, dass der Webserver Verzeichnisinhalte auflistet. |
4 | site/controller.php | Controller-Datei. |
5 | site/views/index.html | Verhindert, dass der Webserver Verzeichnisinhalte auflistet. |
6 | site/views/helloworld/index.html | Verhindert, dass der Webserver Verzeichnisinhalte auflistet. |
7 | site/views/helloworld/view.html.php | Datei, die die Ansicht darstellt. |
8 | site/views/helloworld/tmpl/index.html | Verhindert, dass der Webserver Verzeichnisinhalte auflistet. |
9 | site/views/helloworld/tmpl/default.php | Die standardmäßige Ansicht. |
10 | admin/index.html | Verhindert, dass der Webserver Verzeichnisinhalte auflistet. |
11 | admin/helloworld.php | Das ist der Einstiegspunkt für die Administration der Hello World! Komponente. |
12 | admin/sql/index.html | Verhindert, dass der Webserver Verzeichnisinhalte auflistet. |
13 | admin/sql/updates/index.html | Verhindert, dass der Webserver Verzeichnisinhalte auflistet. |
14 | admin/sql/updates/mysql/index.html | Verhindert, dass der Webserver Verzeichnisinhalte auflistet. |
15 | admin/sql/updates/mysql/0.0.1.sql | Datei, mit der die Schemaversion der Komponente com_helloworld initialisiert werden kann. |
Bei Code-Abweichungen oder wenn der Quellcode auf dieser Seite bearbeitet wird, sollte ein Pull Request auf https://github.com/joomla/Joomla-3.2-Hello-World-Component erstellt werden.