Zgledi: Uvodni primeri

Naloga 1:Sestavi spletno stran, ki omogoča enostavno risanje

Ideja:
Uporabili bomo pripravljen programček. Eden takih je k SUN SDK priloženi Drawtest. Vzamemo torej ustrezni programček, si ogledamo, kako ga uporabimo in sestavimo svojo datoteko HTM.
Rešitev:
Uporabimo programček s povezave DrawTest. Datoteko ZIP razpakirajmo v poljubni imenik. Če si ogledamo datoteko example1.html, dobimo vsa navodila. Potrebujemo datoteke DrawControls.class, DrawPanel.class in DrawTest.class.
Sestavimo ustrezno datoteko HTM. Ta je zelo enostavna, ker programček ne uporablja parametrov.


<HTML>
<HEAD>
<TITLE>Risanje</TITLE>
<BODY>
Tukaj lahko pokažeš svoje risarske sposobnosti:
<APPLET CODE="Drawtest.class" WIDTH=400 HEIGHT=400>
</APPLET>
</BODY>
</HTML>

Poskusi, kaj se zgodi, če spreminjaš WIDTH in HEIGHT. Ali imaš na strani lahko več risarskih površin?

Naloga 2:Sestavi spletno stran, ki vsebuje pretvornik valut.

Ideja:
Uporabili bomo pripravljen programček. Eden takih je RealConverter, ki ga najdemo tudi na CDju in v seznamu programčkov pri literaturi. Vzamemo torej ustrezni programček, si ogledamo, kako ga uporabimo in sestavimo svojo datoteko HTM.
Rešitev:
Uporabimo programček s povezave Convert. Datoteko ZIP razpakirajmo v poljubni imenik. Če si ogledamo datoteko index.html, dobimo vsa navodila. Potrebujemo le datoteko RealConverter.class.
Sestavimo ustrezno datoteko HTM. Seveda bomo vpisali točne vrednosti tečajev, ki jih bomo poiskali npr. na spletni strani kakšne banke.


<HTML>
<HEAD>
<TITLE>Prevtornik valut</TITLE>
<BODY>
Če se odpravljaš na pot, ti bo prav prišel tale pretvornik
valut:
<APPLET CODE="RealConverter.class" WIDTH=400 HEIGHT=100>
<PARAM NAME=BackgroundColor VALUE="FFFFFF">
<PARAM NAME=ForegroundColor VALUE="000000">
<PARAM NAME=BackgroundPicture VALUE="none">

<PARAM NAME=TagButton VALUE="Pretvori">
<PARAM NAME=TagInputField VALUE="?"><
<PARAM NAME=TagOutputField VALUE="?">

<PARAM NAME=InputListItemIndex VALUE="1">
<PARAM NAME=OutputListItemIndex VALUE="1">

<PARAM NAME=OutputDecimals VALUE="5">
<PARAM NAME=AlwaysShowDecimals VALUE="yes">
<PARAM NAME=AmountStyle VALUE="eur-low">

<PARAM NAME=Converter1Listing VALUE="Tolar (SIT)">
<PARAM NAME=Converter1Measure VALUE="SIT">
<PARAM NAME=Converter1Value VALUE="1">

<PARAM NAME=Converter3Listing VALUE="evro (EUR)">
<PARAM NAME=Converter3Measure VALUE="EUR">
<PARAM NAME=Converter3Value VALUE="225,21">

<PARAM NAME=Converter2Listing VALUE="dolar (USD)">
<PARAM NAME=Converter2Measure VALUE="USD">
<PARAM NAME=Converter2Value VALUE="249,13">
</APPLET>

</BODY>
</HTML>

Dodaj še kakšno valuto!

Naloga 3:Popravimo prejšnji program tako, da bo med sabo pretvarjal ure, minute, sekunde

Ideja:
Prilagodimo parametre!
Rešitev:


<HTML>
<HEAD>
<TITLE>Pretvornik časa</TITLE>
<BODY>
Koliko ur, minut, sekund je to:
<APPLET CODE="RealConverter.class" WIDTH=400 HEIGHT=100>
<PARAM NAME=BackgroundColor VALUE="FFFFFF">
<PARAM NAME=ForegroundColor VALUE="000000">
<PARAM NAME=BackgroundPicture VALUE="none">

<PARAM NAME=TagButton VALUE="Pretvori">
<PARAM NAME=TagInputField VALUE="?"><
<PARAM NAME=TagOutputField VALUE="?">

<PARAM NAME=InputListItemIndex VALUE="1">
<PARAM NAME=OutputListItemIndex VALUE="1">

<PARAM NAME=OutputDecimals VALUE="5">
<PARAM NAME=AlwaysShowDecimals VALUE="yes">
<PARAM NAME=AmountStyle VALUE="eur-none">

 <PARAM NAME=Converter1Listing VALUE="ure">
 <PARAM NAME=Converter1Measure VALUE="h">
 <PARAM NAME=Converter1Value VALUE="1">

 <PARAM NAME=Converter3Listing VALUE="minute">
 <PARAM NAME=Converter3Measure VALUE="min">
 <PARAM NAME=Converter3Value VALUE="60">

 <PARAM NAME=Converter2Listing VALUE="sekunde">
 <PARAM NAME=Converter2Measure VALUE="sek">
 <PARAM NAME=Converter2Value VALUE="3600">
</APPLET>

</BODY>
</HTML>

Dodaj še dan, teden in milisekundo.

Naloga 4:Sestavi spletno stran, ki prikazuje plapolajočo zastavo.

Ideja:
V spletu lahko najdemo več pripravljenih programčkov, ki znajo statično sliko preoblikovati tako, da daje vtis plapolanja. Na CDju in v seznamu programčkov pri literaturi tudi najdemo dva taka programa (zastava in zastava2). Vzamemo torej ustrezni programček, si ogledamo, kako ga uporabimo in sestavimo svojo datoteko HTM.
Rešitev:
Uporabimo programček s povezave zastava2. Datoteko ZIP razpakirajmo v poljubni imenik. Če si ogledamo datoteko readme.html, dobimo vsa navodila. Potrebujemo torej le ustrezno datoteko GIF z zastavo in datoteko FlagApplet.jar. Slednja je posebna arhivska datoteka, v kateri se "skrivajo" potrebne datoteke CLASS.

Sedaj sestavimo ustrezno datoteko HTM.


<HTML>
<HEAD>
<TITLE>Moja zastava</TITLE>
</HEAD>

<BODY>
Ponosno vihra moja zastava:
<APPLET ARCHIVE="FlagApplet.jar" CODE="FlagApplet.class" WIDTH=160
HEIGHT=100>

     <PARAM NAME="copyright" VALUE="(c) 1999 Dan MacFarlane">
     <PARAM NAME="home"      VALUE="http://www.dancity.com/">
     <PARAM NAME="image"     VALUE="myflag.gif">

</APPLET>
</BODY>
</HTML>

Namesto myflag.gif seveda navedemo sliko svoje zastave.

Naloga 5:Sestavi programček, ki izpiše tvoje ime in priimek, spodaj pa šolo, na kateri učiš!

Ideja:
Uporabimo standardni "okvir" za izdelavo programčka. Izpis opravimo z metodo drawString.Pozorni moramo biti, da program shranimo z enakim imenom, kot ga ima razred (class).
Rešitev:


import java.applet.*;
import java.awt.*;

public class Vizitka extends Applet
{
   public void paint(Graphics okno)
   {
      // Moja vizitka
      okno.drawString("Matija Lokar", 10, 20);
      okno.drawString("Fakulteta za matematiko in fiziko", 10, 40);
    }
}

Kaj se zgodi, če med seboj zamenjaš drugi in tretji parameter pri obeh klicih metode drawString? Spremeni ime razreda (Vizitka) v Jaz in shrani spremembe v isto datoteko (Vizikta.java). Kaj se zgodi?

Naloga 6:Nariši krog z radijem 100

Ideja:
Prometni znak je okrogel, rumene barve z rdečim robom. Krog bomo narisali z ukazom drawOval. Ta ima štiri parametre, ki določajo okvir, znotraj katerega narišemo krog. Če ima levi zgornji kot koordinati npr. (20, 45), sta koordinati desnega spodnjega kota (20 + 2 * 100, 45 + 2 * 100).
Rešitev:


import java.awt.*;
import java.applet.*;

public class Krog extends Applet
{
  public void paint(Graphics g)
  {
    g.drawOval(20,45,220,245);
  }
}

Krogu očrtaj še kvadrat!

Naloga 7:Nariši prometni znak za prepoved vožnje za vsa vozila.

Ideja:
Prometni znak je okrogel, rumene barve z rdečim robom. Poln krog bomo narisali z ukazom fillOval(xzgorajdesno, yzgorajdesno, xspodajlevo, yspodajlevo), ki znotraj "škatle" nariše poln krog. Barvo določimo z metodo setColor, ki ji kot parameter damo Color.red oziroma Color.yellow.
Rešitev:


import java.awt.*;
import java.applet.*;

public class Znak_prepovedano extends Applet
{
  public void paint(Graphics g)
  {
    g.setColor(Color.red); // največji krog je rdeč
    g.fillOval(0,0,100,100);
    g.setColor(Color.yellow);  // notranji je rumen
    g.fillOval(10,10,80,80);
  }
}

Kaj se zgodi, če med seboj zamenjaš vrstni red risanja krogov?