J3.x

Entwicklung einer MVC-Komponente/Hinzufügen eines Views zum Seitenbereich

From Joomla! Documentation

< J3.x:Developing an MVC Component
Revision as of 13:05, 24 January 2020 by Blancanieve (talk | contribs)
Other languages:
Deutsch • ‎English • ‎Nederlands • ‎español • ‎français • ‎português do Brasil • ‎русский • ‎العربية • ‎中文(台灣)‎
Joomla! 
3.x
Tutorial
Entwicklung einer MVC Komponente

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

  1. Hinzufügen von ACL

Hinzufügen eines Installations-/Deinstallations-/Aktualisierungs-Skriptes

Hinzufügen eines Formulars im Frontend

  1. Hinzufügen von Bildern
  2. Hinzufügen von Karten
  3. Hinzufügen von AJAX
  4. Hinzufügen eines Alias

Benutzung des Sprachenfilters

  1. Hinzufügen von Modalen
  2. Hinzufügen von Verknüpfungen
  3. Hinzufügen der Freigabe/Sperrung von Elementen
  4. Hinzufügen von Sortierungen
  5. Hinzufügen von Ebenen
  6. Hinzufügen von Versionen
  7. Hinzufügen von Schlagwörtern (Tags)
  8. Hinzufügen von Zugriffsebenen
  9. Hinzufügen von Stapelverarbeitungen
  10. Hinzufügen eines Cache-Speichers
  11. Hinzufügen eines Feeds

Hinzufügen eines Aktualisierungs-Servers

  1. Adding Custom Fields
  2. Upgrading to Joomla4



Dies ist eine Artikel-Serie mit Tutorials über die Entwicklung einer Modal-View-Controller Komponente für Joomla! VersionJoomla 3.x.

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.
Info non-talk.png
General Information

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.