PS-Trainer Java - Interaktion
Homepage von PS-Trainer - Entwicklung - Java - an PS-Trainer

PS-Trainer PS-Trainer



Die ersten eigenen Java-Applets:

In dieser Trainings-Einheit vertiefen sie ihre Kenntnis von Java-Grundelementen


Sie erzeugen ein Applet, das mit seiner Webseite nicht nur einmalig, sondern mehrfach interaktiv zusammenarbeitet: Ihr Web-User reagiert auf die Webseite mit Eingabe, diese werden durch JavaScript an das Applet weitergereicht und ausgeführt. Dieser Zyklus kann beliebig oft wiederholt werden.



Java
Inhalt dieser Seite:

Formulare, ihre Verarbeitung
Zugriff auf öffentliche Applet-Methoden
Aufgaben
 



Formulare:
Verwenden sie auf Webseiten, um User-Eingabe zu erhalten, zu verarbeiten und weiterzugeben. Wichtig: Benennen sie jedes Form-Element, damit sie es in JavaScript ansprechen können.
Hier ein einfaches Beispiel für ein Form mit 3 Tasten (buttons) und 2 Eingabe-Feldern.
Die Formatierung ist für bessere Übersicht weggelassen, diese bringen sie nach eigenem Ermessen an.
Die Namen der Elemente werden mit dem name Attribut vergeben.
Mit type="button" erzeugen sie eine Taste, mit type="text" ein Feld für Text-Eingabe.
Die Breite der Textfelder = max. Anzahl Zeichen stelen sie mit maxlength ein.
Standardwerte (default) geben sie als value ein.
Mit onclick geben sie das script an, mit dem sie die Eingabe verarbeiten.

<form name="EingabeForm" action="">
<input type="button" value="Neu Laden" onclick="form_reload()">
<input type="button" value="Löschen" onclick="form_clear()">
<input type="button" value="Eingabe" onclick="form_input()">
<input name="TextFeld" type="text" size="50" maxlength="100" value="Das ist der AnwenderInnen-Text">
<input name="ZahlFeld" type="text" size="50" maxlength="5" value="3">

Die Verarbeitung von Formularen erfolgt normalerweise mit JaavaScript. Hier ein Beispiel zur Verarbeitung der oben vorgestellten form:
Über den Objektnamen erhalten sie Zugriff auf jedes benannte Element der Form.
Mit Methode value erhalten sie die Daten bzw. können die Daten ändern.
Die Spezialität dieses Beispiels:
Die Verarbeitung erfolgt durch ein Java-Applet. Dazu müssen sie zuerst ein Applet programmieren und in die Webseite integrieren. Wenn sie in ihrem Applet eine Methode (public) zur Verfügung stellen, dann kann diese auch von JavaScript genutzt werden, hier z.B. die selbst programmierte Methode redraw.me(t,n).
<script type="text/javascript">
function form_reload() {
location.reload();
}
function form_input() {
t=document.EingabeForm.TextFeld.value;
n=document.EingabeForm.ZahlFeld.value;
//alert("t="+t);
//alert("n="+n);
document.testapplet.redraw_me(t,n);
}
function form_clear() {
document.EingabeForm.TextFeld.value="Geben sie hier einen Text ein !";
document.EingabeForm.ZahlFeld.value="4";
}
</script>
Das verwendete Applet wird wie üblich aufgerufen:
Als Parameter übergeben sie Start-Werte.
<applet name="testapplet" code="JS2J.class" width=600 height=300>
<param name="text_h" value="Dieser Text wird von HTML an Java übergeben">
<param name="number_h" value="4">
Java ist abgeschaltet
</applet>



Java-Applet:
Der Einfachheit halber wird ein Applet aus der vorhergehenden Trainingseinheit verwendet und modifiziert:
Das Applet schreibt einen Text mehrfach zeilenweise auf. Sowohl Text als auch Anzahl werden als Parameter übergeben.
Java:
/* Applet JS2J
Version 1.0 / 2002.06.01.
Author: pstrainer@gmx.net

Demo-Beispiel für die Zusammenarbeit User - HTML - JavaScript - Java
*/

import java.applet.*;
import java.awt.*;
public class JS2J extends Applet {
String errtxt,mytext,mynumtxt;
int pos_x,pos_y,d_y,mynum,i;

// Here is where we get a parameter from html
public void init(){
mytext=getParameter("text_h");
if (mytext==null){mytext="Von HTML wurde kein Text an Java übergeben";}
mynumtxt=getParameter("number_h");
if (mynumtxt==null) {mynumtxt="1";}
// number input with exc handler
try {

mynum=Integer.valueOf(mynumtxt).intValue();
}
catch (NumberFormatException e) {
mynum=0;
}

d_y=15;
System.out.println("Applet JS2J inited ("+mytext+", "+mynum+")");
}

public void paint (Graphics g) {
pos_x=20;
pos_y=20;
// headline
g.drawString("Applet JS2J",pos_x+50,pos_y);
pos_y+=d_y;
// errortext
if (mynum<1) {
mynum=1;
errtxt="Fehler bei der numerischen Eingabe";
}
else if (mynum>20) {
errtxt="Numerische Eingabe wird auf 20 begrenzt";
mynum=20;
}
else { errtxt=""; }
if (errtxt.length()>0) {
g.drawString(errtxt,pos_x,pos_y);
pos_y+=d_y;
}
// show number
g.drawString("Der Text wird "+mynum+"x wiederholt",pos_x,pos_y);
pos_y+=d_y;
pos_y+=d_y;

// loop
System.out.println("Applet JS2J draw ("+mytext+", "+mynum+")");
for (i=0;i<mynum;i++) {
g.drawString(""+(i+1)+")",pos_x,pos_y);
g.drawString(mytext,pos_x+20,pos_y);
pos_y+=d_y;
}
}

// This method can be used by JavaScript

public void redraw_me(String newtext,String newnumtxt) {
System.out.println("Applet JS2J redraw ("+newtext+", "+newnumtxt+")");
if(newtext!=null) {
mytext=newtext;
if (newnumtxt==null) {
newnumtxt="0";
}
mynum=Integer.valueOf(newnumtxt).intValue();
repaint();
System.out.println("Applet JS2J redraw ("+mytext+", "+mynum+")");
}
else {
System.out.println("Applet JS2J nodraw");
}
}


}

Hinweise:
Sie müssen ihre Methode public deklarieren, damit sie von JavaScript aus der Webseite verwendet werden kann.
Sie können Parameter übergeben, so wie hier newtext und newnumtext.



JavaAufgaben:
Interaktives Applet Programmieren sie eine Webseite ähnlich dem vorgestellten Muster: Über ein Formular wird ein Text und eine Zahl eingegeben, dieser wird im Applet verschieden oft dargestellt, je nach Zahl.
Einfaches Diagramm Programmieren sie ein Applet, das eine einfache Säulengrafik von 5 Werten erzeugt.
Fügen sie eine interaktive Steuerung dazu: die 5 Zahlenwerte werden vom User über ein Formular eingegeben.
Verwenden sie dazu einige der weiteren Methoden des Graphics-Objekts:
drawLine(int x1, int y1, int x2, int y2) zieht eine Linie von (x1,y1) nach (x2,y2)
drawString (String s, int x, int y) zeichnet einen Text.
drawRect (int x, int y, int width, int height) zeichnet ein Rechteck.
fillRect (int x, int y, int width, int height) zeichnet gefüllte Rechtecke.
drawOval (int x, int y, int width, int height) zeichnet Kreise oder Ovale.
fillOval (int x, int y, int width, int height) zeichnet gefüllte Kreise oder Ovale.



Homepage von PS-Trainer - Entwicklung - Java - an PS-Trainer

Geocities