⭐ 欢迎来到虫虫下载站！ | 📦 资源下载 📁 资源专辑 ℹ️ 关于我们
⭐ 虫虫下载站
📤 上传资源

📄 ballbewegungdeu.html

📁 java tutorial all about java game design
💻 HTML
字号:
🔍 
<html><!-- InstanceBegin template="/Templates/template.dwt" codeOutsideHTMLIsLocked="false" -->
<head>
<!-- InstanceBeginEditable name="doctitle" -->
<title>Java Cooperation: how to move a ball</title>
<!-- InstanceEndEditable --><meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<link href="jc_style.css" rel="stylesheet" type="text/css">
<script src="klayers.js"></script>

<script>

function cancelCloseMenu(){
        if(self.tm) clearTimeout(tm) // cancel delayed closing
}

function showMenu(){
        if(!self.menu || !self.submenu){
                menu=layer("menulayer")
                submenu=layer("submenulayer")
        }

        cancelCloseMenu()

        submenu.moveTo(menu.getAbsoluteLeft(), menu.getAbsoluteTop() + menu.getHeight()) // move second menu relatively
        submenu.show()
}

function initiateHideMenu(){
        tm=setTimeout("hideMenu()",400) // 1 second delay to close a submenu
}

function hideMenu(){
        submenu.hide()
}

</script>

<!-- InstanceBeginEditable name="head" --><!-- InstanceEndEditable -->
</head>
<body bgcolor="#ffffff" leftmargin="0" topmargin="0" rightmargin="0" bottommargin="0">
<div align="center">
  <a name="top"></a>
  <table bgcolor="#737373" border="0" cellpadding="0" cellspacing="0" width="618">
  <tr>
<td rowspan="8" bgcolor="#000000"><img src="Pics/spacer.gif" width="1" height="1" border="0" alt=""></td>
   <td bgcolor="#000000"><img src="Pics/spacer.gif" width="131" height="1" border="0" alt=""></td>
   <td bgcolor="#000000"><img src="Pics/spacer.gif" width="13" height="1" border="0" alt=""></td>
   <td bgcolor="#000000"><img src="Pics/spacer.gif" width="58" height="1" border="0" alt=""></td>
   <td bgcolor="#000000"><img src="Pics/spacer.gif" width="94" height="1" border="0" alt=""></td>
   <td bgcolor="#000000"><img src="Pics/spacer.gif" width="81" height="1" border="0" alt=""></td>
   <td bgcolor="#000000"><img src="Pics/spacer.gif" width="48" height="1" border="0" alt=""></td>
   <td bgcolor="#000000"><img src="Pics/spacer.gif" width="23" height="1" border="0" alt=""></td>
   <td bgcolor="#000000"><img src="Pics/spacer.gif" width="38" height="1" border="0" alt=""></td>
   <td bgcolor="#000000"><img src="Pics/spacer.gif" width="19" height="1" border="0" alt=""></td>
   <td bgcolor="#000000"><img src="Pics/spacer.gif" width="108" height="1" border="0" alt=""></td>
   <td bgcolor="#000000"><img src="Pics/spacer.gif" width="5" height="1" border="0" alt=""></td>

  </tr>

  <tr>
   <td rowspan="5"><a href="index.html"><img name="fab_r1_c1" src="Pics/fab_r1_c1.gif" width="131" height="71" border="0" alt="Java cooperation home"></a></td>
   <td rowspan="6" bgcolor="#737373"></td>
   <td colspan="9" height="15" bgcolor="#737373"></td>
   <td rowspan="8" bgcolor="#000000"><img src="Pics/spacer.gif" width="1" height="1" border="0" alt=""></td>
  </tr>
  <tr>
   <td colspan="5"><div class="colontitul"><!-- InstanceBeginEditable name="Colontitul" -->Tutorial<!-- InstanceEndEditable --></div></td>
   <td colspan="2" bgcolor="#737373"><img name="fab_r2_c8" src="Pics/fab_r2_c8.gif" width="57" height="19" border="0" alt="type and press Enter"></td>
   <td colspan="2">
<FORM method=GET action="http://www.google.com/search">
<TABLE bgcolor="#FFFFFF" cellpadding="0" cellspacing="0" height="10px"><tr>
<td height="10" valign="middle">
<INPUT TYPE=text name=q size=18 maxlength=60 value="" style="font-size:12px; color:#000000; border-width: 0px;">
<input type=hidden name=domains value="http://javacooperation.gmxhome.de/">
<input type=hidden name=sitesearch value="http://javacooperation.gmxhome.de/" checked>
</td></tr></TABLE>
</td>
</form>
   <td><img src="Pics/spacer.gif" width="1" height="19" border="0" alt=""></td>
  </tr>
  <tr>
   <td colspan="9" bgcolor="#666666"><img name="fab_r3_c3" src="Pics/fab_r3_c3.gif" width="474" height="8" border="0" alt=""></td>
   <td><img src="Pics/spacer.gif" width="1" height="8" border="0" alt=""></td>
  </tr>
  <tr>
   <td colspan="6"><a href="TutorialStartDeu.html"><img src="Pics/deupanel_01.gif" width="56" height="22" border="0"></a><a href="OnlineSpieleStartDeu.html"><img src="Pics/deupanel_02.gif" width="94" height="22" border="0"></a><a href="DownloadsDeu.html"><img src="Pics/deupanel_03.gif" width="76" height="22" border="0"></a><a href="LinksDeu.html"><img src="Pics/deupanel_04.gif" width="52" height="22" border="0"></a><a href="KontaktDeu.html"><img src="Pics/deupanel_05.gif" width="64" height="22" border="0"></a></td>
   <td><img name="fab_r4_c9" src="Pics/fab_r4_c9.gif" width="19" height="22" border="0" alt=""></td>
   <td width="108" height="22" bgcolor="#666666"><div align="center"><span id="menulayer" style="position: relative; background-color:#666666; width:108; height:20; vertical-align:baseline; border:1px solid #FFFFFF"><a href="#" class="text" onmouseover="showMenu(); return true" onmouseout="initiateHideMenu(); return true">Select language</a></span>
   </div>
     <div id="submenulayer" style="position: absolute; visibility: hidden; background-color: #666666; width:108px;">
         <div class="text" style="border:1px solid #FFFFFF; border-top-width:0; padding:5px">
<a href="#" onmouseover="cancelCloseMenu(); return true" onmouseout="initiateHideMenu(); return true">German</a><br>
<a href="indexEng.html" onmouseover="cancelCloseMenu(); return true" onmouseout="initiateHideMenu(); return true">English</a><br>
<a href="http://javacooperation.dev.juga.ru/index.html" onmouseover="cancelCloseMenu(); return true" onmouseout="initiateHideMenu(); return true">Russian</a>
</div>
</div>
</td>
   <td><img name="fab_r4_c11" src="Pics/fab_r4_c11.gif" width="5" height="22" border="0" alt=""></td>
   </tr>
  <tr>
   <td colspan="9"><img name="fab_r5_c3" src="Pics/fab_r5_c3.gif" width="474" height="7" border="0" alt=""></td>
  </tr>
<tr>
<td colspan="11" style="padding:18; background-color:#333333; vertical-align:top;">
<div class="text">
  <!-- InstanceBeginEditable name="EditRegion" -->
  <h2>Die Bewegung eines Balles &uuml;ber das Applet</h2>
  <p align="justify">
  Zun&auml;chst wollen wir uns mit einer einfachen Animation besch&auml;ftigen. Wir wollen ein Java Applet programmieren, dass einen Kreis (Ball) von der einen Seite des Applets auf die andere bewegt. Dies ist sicherlich noch keine Gro&szlig;tat, aber irgendwie m&uuml;ssen wir ja beginnen.<br><br>

  Zu Beginn m&uuml;ssen wir wieder unsere Applet Grundstruktur implementieren, wobei wir allerdings noch zwei Dinge hinzuf&uuml;gen m&uuml;ssen. Als Erstes muss man, um eine Animation in Java verwirklichen zu k&ouml;nnen das Interface Runnable implementieren und die dazugeh&ouml;rige Methode run(). Wir m&uuml;ssen unser Applet also folgenderma&szlig;en erweitern:</p>

  import java.applet.*;<br>
  import java.awt.*;<br><br>

  public class BallApplet extends Applet <i>implements Runnable</i><br>
  {
  <ul>
          public void init() { }<br><br>

          public void start() { }<br><br>

          public void stop() { }<br><br>

          public void destroy() { }<br><br>

          <i>public void run () { }</i><br><br>

          public void paint (Graphics g) { }<br><br>
  </ul>
  }

  <p align="justify">
  Um nun ein Graphik - Objekt zu bewegen, brauchen wir au&szlig;erdem einen sogenannten Thread, den wir in der Start - Methode schaffen: </p>

  <p align="justify"><u>Threads</u><br>
  Ein Thread ist ein eigenst&auml;ndiges Programmfragment, das parallel zu anderen Threads (Multithreading) laufen kann. Threads werden in Java durch die Klasse Thread und das Interface Runnable sowie die dazugeh&ouml;rige Funktion run() implementiert , was wir im obigen Abschnitt ja schon getan haben. Wichtige Funktionen zur Erzeugung eines Threads sind:</p>
  <ul>
  <li>Thread.start(): Startet einen Thread </li>
  <li>Thread.stop(): Stopt einen Thread</li>
  <li>Thread.sleep(Zeit in Millisekunden): Stopt den Thread f&uuml;r die Angegebene Zeitspanne</li>
  </ul>
  <p>
  Die weiteren Funktionen der Klasse Thread k&ouml;nnen in der Java - API nachgelesen werden.</p>

  public void start ()<br>
  {
  <ul>
          // Schaffen eines neuen Threads, in dem das Spiel l&auml;uft<br>
          Thread th = new Thread (this);<br>
          // Starten des Threads<br>
          th.start ();<br>
  </ul>
  }

  <p align="justify">
  Diesen Thread lassen wir nun in der Run - Methode laufen. Nach jedem Durchlauf der Run - Methode stoppen wir den Thread f&uuml;r eine gewisse Zeit um ihn dann erneut durchlaufen zu lassen:
  Die run - Methode sollte also folgenderma&szlig;en aussehen:
  </p>

  public void run ()<br>
  {
  <ul>
          // Erniedrigen der ThreadPriority <br>
          Thread.currentThread().setPriority(Thread.MIN_PRIORITY);<br><br>

          // Solange true ist l&auml;uft der Thread weiter<br>
          while (true)<br>
          {
          <ul>
                  // Neuzeichnen des Applets<br>
                  repaint();<br><br>

                  try<br>
                  {
                  <ul>
                          // Stoppen des Threads f&uuml;r in Klammern angegebene Millisekunden<br>
                          Thread.sleep (20);<br>
                  </ul>
                  }<br>
                  catch (InterruptedException ex)<br>
                  {
                  <ul>
                          // do nothing<br>
                  </ul>
                  }<br><br>

                  // Zur&uuml;cksetzen der ThreadPriority auf Maximalwert<br>
                  Thread.currentThread().setPriority(Thread.MAX_PRIORITY);<br>
          </ul>
          }
  </ul>
  }

  <p align="justify">
  Wir haben nun eine Endlosschleife, die alle Anweisungen innerhalb des while (true) - Blockes ausf&uuml;hrt, 20 Millisekunden wartet um dann die selben Anweisungen erneut auszuf&uuml;hren. Wie aber sollen wir nun einen Kreis, der vom Applet gezeichnet wird bewegen. <br>
  Nun, der Kreis hat ja eine x - Koordinate und eine y - Koordinate. Wenn wir nun in jedem Durchlauf des Threads die x - Koordinate um eins erh&ouml;hen w&uuml;rden, so w&uuml;rde sich der Ball entlang der x - Achse, bei gleichbleibender y- Koordinate, bewegen.   <br><br>

  Zeichnen wir also zun&auml;chst einen Kreis. Dazu ver&auml;ndern wir die paint - Methode wie folgt: </p>
  public void paint (Graphics g)<br>
  {
         <ul>
         // Setzten der Zeichenfarbe auf Rot<br>
          g.setColor (Color.red);<br><br>

          // Zeichen eines gef&uuml;llten Kreises<br>
          g.fillOval (x_pos - radius, y_pos - radius, 2 * radius, 2 * radius);<br>
          </ul>
  }

  <p align="justify">
  und m&uuml;ssen noch folgende Instanzvariablen (am Kopf des Programmes) initialisieren:<br><br>

  int x_pos = 10;<br>
  int y_pos = 100;<br>
  int radius = 20;<br><br>


  Um den Ball nun zu bewegen ver&auml;ndern wir pro Threaddurchlauf die x -Koordinate um eins, die run - Methode sieht also jetzt so aus:
  </p>

  public void run ()<br>
  {<br>
  ...
          <ul>
          while (true)<br>
          {
                  <ul>
                  <i>// Ver&auml;ndern der X - Koordinate des Balles<br>
                  x_pos ++;</i><br>
                  ...<br>
                  </ul>
          }</ul>
  }

  <p align="justify">
  Wenn man das Applet nun wie im 1. Kapitel gesehen in eine Html - Seite einbindet, dann sollte sich ein roter Ball einmal quer &uuml;ber das Applet bewegen.
  </p>

  <p><a href="SourceCodes/Ballbewegung1/Ballbewegung1.java">SourceCode download</a><br>
  <a href="Applets/Ballbewegung1/BallBewegung1Applet.html">Applet ansehen</a>
  <h4>N&auml;chstes Kapitel</h4>
<a href="BildschirmflackernDeu.html">Reduzierung des Bildschirmflackerns</a>
  <!-- InstanceEndEditable -->
</div>
</td>
</tr>

<tr>
<td colspan="11" style="background-color:#990000" align="center">
<table width="100%" style="padding:0"><tr>
  <td width="88" bgcolor="#993300"><div align="center" style="font-size:10px; color: #FFFFFF;">  <a href="#top"> to top </a></div></td>
  <td><div align="center" style="font-size:10px; color: #FFFFFF;">
<a href="mailto:javacooperation@gmx.de">Fabian Birzele</a>, 2001-2004.<br>
web-design: <a href="http://www.freehand.str.ru/">Vadim Murzagalin</a>, 2004.
</div></td>
<td width="88">
</td>
</tr>
</table>

</td>

</tr>

</table>
</div>

</body>
<!-- InstanceEnd --></html>

⌨️ 快捷键说明

复制代码 Ctrl + C
搜索代码 Ctrl + F
全屏模式 F11
切换主题 Ctrl + Shift + D
显示快捷键 ?
增大字号 Ctrl + =
减小字号 Ctrl + -