Selasa, 25 Maret 2014

Berikut adalah persiapan yang harus anda miliki untuk mulai membuat aplikasi android.
  • Siapkan Android SDK
  • Buka SDK Manager di dalam folder Android SDK, Install Package dan centang versi Android yang anda inginkan
  • Buka Eclipse.exe di dalam folder Eclipse
  • Download ADT Plugin, pilih Help - Install New Software. Pilih add masukkan nama : ADT Plugin dan Location : https://dl-ssl.google.com/android/eclipselalu OK. Setelah itu Pilih Next sampai muncul tulisan Finish. Eclipe akan meminta di Restart
  • Download MDS Applaud / Phonegap.  
  • Lalu ikuti langkah-langkahnya Screenshoot :



  • bila ingin mendownload APK nya disini
  • berikut contoh coding
<!DOCTYPE HTML>
<html>
  <head>
    <meta http-equiv="Content-type" name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no, width=device-width">
    <title></title>

<link rel="stylesheet" href="index.css" /> 
<script type="text/javascript" charset="utf-8" src="cordova-1.9.0.js"></script>
  </head>
  
  <body onload="init();">
<div id="header" >
<h1>Tugas 1 Pemrograman Mobile</h1>
</div>
<div id="subheader">
            <select>
            <option value="intro">Salam Pembuka</option>
            <option value="accelerometer">Identitas</option>
<option value="camera">Kata Mutiara</option>
</select>
    </div>
<div id="sidebar">
<ul>
</ul>
</div><!-- /sidebar -->
<div id="scrollable">
        <div id="content">                
   <div class="api-div" id="api-intro">
        <h2>My First Android Application</h2>
<blockquote>
  <p>HALLO BRO!</p>
</blockquote>

<div>
<!--<h4>Select a <b>PhoneGap API </b>to see it demonstrated.</h4>
<h4 class="help">See <b>assets/www/apis/</b> for JavaScript implementations of each API.</h4>-->
<p style="color:#767573;">&copy; 2014 By M.Hasyim.Yahya</p>
</div>    
</div>

   <div class="api-div" id="api-accelerometer">
        
<blockquote>
  <p>Nama : Mohamad.Hasyim.Yahya<br/>Nim : A11.2011.06365<br/>Kelompok : A11.4609</p>
</blockquote>
<!--<h4 class="help"><b>Toggle</b> to stop/start
accelerometer watch.<br/><b>Get Current</b> for one-time accelerometer reading.</h4>
<a class="btn deux" onclick="toggleAccel();">Toggle</a>
<a class="btn deux" onclick="getAccel();">Get Current</a>
    <dl id="accel-data">
      <dt>X:</dt><dd id="x">&nbsp;&nbsp;&nbsp;</dd>
      <dt>Y:</dt><dd id="y">&nbsp;&nbsp;&nbsp;</dd>
      <dt>Z:</dt><dd id="z">&nbsp;&nbsp;&nbsp;</dd>
    </dl>
    <div>Timestamp: <b id="accel_timestamp">0</b></div>-->
</div>

   <div class="api-div" id="api-camera">
                
<blockquote>
  <p>YOU ONLY LIVE ONCE IF YOU DO IT RIGHT ONCE IS ENAUGH!!!.</p>
</blockquote>
<!--<h4 class="help"><b>Take a Picture</b> using device camera.<br/>
<b>Select</b> to get picture from album or library.</h4>
<a class="btn deux" onclick="take_pic();">Take a Picture</a>
<a class="btn deux" onclick="album_pic();">Select</a>
<div class="result-block"></div>
      <img id="cameraImage" src="" />-->
</div>

   <div class="api-div" id="api-capture">
<h2>Capture</h2>
<blockquote>
<p>Provides access to the audio, image, and video capture capabilities of the device.</p>
</blockquote>
<a class="btn trois" onclick="captureAudio();">Audio</a>
<a class="btn trois" onclick="captureImage();">Image</a>
<a class="btn trois" onclick="captureVideo();">Video</a>
<div class="result-block">
Capture Result: <span id="capture-result"></span><br/>
<span id="format-data"></span><br/>
</div>
</div>

   <div class="api-div" id="api-compass">
<h2>Compass</h2>
<blockquote>
<p>Obtains the direction that the device is pointing.</p>
</blockquote>
<h4 class="help"><b>Toggle</b> to stop/start
compass watch. <br/><b>Get Current</b> for one-time compass reading.</h4>
<div>
      Compass Heading: <b id="heading"></b>
      </div>
<a class="btn deux" onclick="toggleCompass();">Toggle</a>
<a class="btn deux" onclick="getCurrentHeading();">Get Current</a>
    </div>

   <div class="api-div" id="api-connection">
<h2>Connection</h2>
<blockquote>
  <p>The <code>connection</code> object gives access to the device's cellular and wifi connection information.</p>
</blockquote>
    <a class="btn" onclick="check_network();">Check Connection</a>
    <div class="result-block">
    Connection: <b id="connectionstate"></b>   
    </div>
</div>

   <div class="api-div" id="api-contacts">
<h2>Contacts</h2>
<blockquote>
  <p>The <code>contacts</code> object provides access to the device contacts database.</p>
</blockquote>
    <a class="btn" onclick="get_contacts();">Check Contacts</a>
    <div class="result-block">
    <span id="contacts-output"></span>
    </div>
</div>

   <div class="api-div" id="api-device">
<h2>Device</h2>
<blockquote>
<p>The <code>device</code> object describes the device's hardware and software.</p>
</blockquote>
<h4><b>Important</b> Access <code>device</code> object only after <code>deviceready</code> event.</h4>
        <table id="deviceinfo">
  <tr>
    <th>Device</th>
    <th class="alt">Value</th>
  </tr>
  <tr>
    <td>Name</td>
    <td class="alt"><strong id="name">&nbsp;</strong></td>
  </tr>
  <tr>
    <td>Platform</td>
    <td class="alt"><strong id="platform">&nbsp;</strong></td>
  </tr>
  <tr>
    <td>PhoneGap Version</td>
    <td class="alt"><strong id="pgversion">&nbsp;</strong></td>
  </tr>
  <tr>
    <td>UUID</td>
    <td class="alt"><strong id="uuid">&nbsp;</strong></td>
  </tr>
  <tr>
    <td>OS Version</td>
    <td class="alt"><strong id="version">&nbsp;</strong></td>
  </tr>
  <tr>
    <th>Screen</th>
    <th class="alt">Value</th>
  </tr>
  <tr>
    <td>Width</td>
    <td class="alt"><strong id="width">&nbsp;</strong></td>
  </tr>
    <tr>
    <td>Height</td>
    <td class="alt"><strong id="height">&nbsp;</strong></td>
  </tr>
    <tr>
    <td>Available Width</td>
    <td class="alt"><strong id="availwidth">&nbsp;</strong></td>
  </tr>
    <tr>
    <td>Available Height</td>
    <td class="alt"><strong id="availheight">&nbsp;</strong></td>
  </tr>
    <tr>
    <td>Color Depth</td>
    <td class="alt"><strong id="colorDepth">&nbsp;</strong></td>
  </tr>
</table>
</div>

   <div class="api-div" id="api-events">
<h2>Events</h2>
<blockquote>
<p>PhoneGap lifecycle events.</p>
</blockquote>
<h4 class="help">Tap device (or virtual device) <code>menu</code> or <code>search</code> buttons to see example callback output.</h4>
<span id="eventOutput"></span>
<h4>Other event example callbacks use console.log</h4>
</div>

   <div class="api-div" id="api-file">
<h2>File</h2>
<blockquote>
<p>An API to read, write and navigate file system hierarchies.</p>
</blockquote>
<div id="file-system-text"></div>
  <a class="btn deux" onclick="createFile();">Create</a>
  <a class="btn deux" onclick="writeFile();">Write</a>
    <div class="result-block">
    Status: <span id="file-status"></span>
    <span id="file-contents"></span>
    </div>
    <a class="btn deux" onclick="readFile();">Read</a>
  <a class="btn deux" onclick="removeFile();">Remove</a>
    <div class="result-block">
    Read text: <span id="file-read-text"></span><br/>
    Data Url: <span id="file-read-dataurl"></span>
    </div>
</div>

   <div class="api-div" id="api-geolocation">
<h2>Geolocation</h2>
<blockquote>
  <p>The <code>geolocation</code> object provides access to the device's GPS sensor.</p>
</blockquote>
<h4 class="help"><b>Toggle</b> to stop/start
geolocation watch. <br/><b>Get Current</b> for one-time geolocation reading.</h4>
<a class="btn deux" onclick="toggleWatchPosition();">Toggle</a>
    <a class="btn deux" onclick="getCurrentPosition();">Get Current</a>
    <div class="result-block">
    <span id="cur_position"></span>
    </div>
    <img id="map" alt="Location Map"/>
</div>

   <div class="api-div" id="api-media">
<h2>Media</h2>
<blockquote>
  <p>The <code>Media</code> object provides the ability to record and play back audio files on a device. </p>
</blockquote>
    <div class="result-block">
<b>Play MP3 Song</b>
</div>
<a class="btn trois" onclick="playMyAudio();">Play</a>
<a class="btn trois" onclick="pauseAudio();">Pause</a>
<a class="btn trois" onclick="stopAudio();">Stop</a>
    <div class="result-block">
Current: <span id="audio_position">0 sec</span>
&nbsp;&nbsp;Total: <span id=media_dur>0</span> sec
</div><br/>
    <div class="result-block">
<b>Live Audio Recording (5 sec)</b>
</div>
  <a class="btn deux" onclick="startRecord();">Record Audio</a>
  <a class="btn deux" onclick="playbackRecord()">Playback</a>
    <div class="result-block">
    Status: <span id="record-status"></span>
    <span id="record-time"></span>
    </div>
</div>

   <div class="api-div" id="api-notification">
<h2>Notification</h2>
<blockquote>
  <p>Visual, audible, and tactile device notifications.</p>
</blockquote>
<div class="result-block">
<a class="btn deux" onclick="showAlert();">Alert</a>
<a class="btn deux" onclick="showConfirm();">Confirm</a></div>
<div class="result-block">  
<a class="btn deux" onclick="beep();" >Beep</a>
<a class="btn deux" onclick="vibrate();" >Vibrate</a></div>  
</div>

   <div class="api-div" id="api-storage">
<h2>Storage</h2>
<blockquote>
  <p>Provides access to the devices storage options.</p>
</blockquote>
<h4 class="help">Based on <b>W3C Web SQL Database Spec</b> and <b>W3C Web Storage API Spec</b></h4>
<a class="btn" onclick="createDB();">Create DB</a>
<a class="btn" onclick="getSqlResultSet();">SQL Result Set</a>
<div class="result-block">
SQL Result: <br/><span id="sql-result"></span><br/>
</div><br/>
<a class="btn" onclick="writeLocalStorage();">Write LocalStorage</a>
<a class="btn" onclick="readLocalStorage();">Read LocalStorage</a>
<a class="btn" onclick="removeItemLocalStorage();">Remove Item</a>
<div class="result-block">
Local Storage: <span id="local-storage-result"></span><br/>
</div>
</div>  
      </div>
    </div> <!-- /scrollable -->
<div id="footer" >
<h1>&copy; 2012 Mobile Developer Solutions</h1>
</div>
<!--   <script type="text/javascript" charset="utf-8" src="index.js"></script> -->
<script type="text/javascript" charset="utf-8" src="apis/accelerometer.js"></script>
  <script type="text/javascript" charset="utf-8" src="apis/camera.js"></script>
  <script type="text/javascript" charset="utf-8" src="apis/capture.js"></script>
<script type="text/javascript" charset="utf-8" src="apis/compass.js"></script>
<script type="text/javascript" charset="utf-8" src="apis/connection.js"></script>
<script type="text/javascript" charset="utf-8" src="apis/contacts.js"></script>
<script type="text/javascript" charset="utf-8" src="apis/device.js"></script>
<script type="text/javascript" charset="utf-8" src="apis/events.js"></script>
  <script type="text/javascript" charset="utf-8" src="apis/file.js"></script>
<script type="text/javascript" charset="utf-8" src="apis/geolocation.js"></script>
<script type="text/javascript" charset="utf-8" src="apis/media.js"></script>
<script type="text/javascript" charset="utf-8" src="apis/notification.js"></script>
<script type="text/javascript" charset="utf-8" src="apis/storage.js"></script>
  </body>
</html>
  • siapkan genymotion . kalo belum ada bisa didownload disini
  • buka genymotion . Add - pilih salah satu virtual device lalu didownload.
  • lalu klik Play . tunggu sampai booting virtual android selesai
  • kembali lagi ke eclipse . klik run - run configuration - android application - pilih project yg telah dibuat tadi - target - always prompt to pick device - apply - run.
  • lalu akan muncul jendela baru . lalu pilih virtual device yg telah kita download tadi di genymotion - OK.
  • lalu buka lagi genymotion nya . dstu bisa kita lihat hasil app android  nya .
  • sekian dan terimkasih

                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                Tidak ada komentar:

                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                Posting Komentar