"Kembali Ke Dasar Elektronika Digital ... "

  • IC Timer 555 yang Multifungsi

    IC timer 555 adalah sirkuit terpadu (chip) yang digunakan dalam berbagai pembangkit timer, pulsa dan aplikasi osilator. Komponen ini digunakan secara luas, berkat kemudahan dalam penggunaan, harga rendah dan stabilitas yang baik

  • Animasi LED Dengan IC 4017

    IC 4017 adalah IC 16-pin CMOS dekade counter dari seri IC CMOS 4000. Sangat berguna jika ingin membuat animasi lampu atau LED secara sederhana seperti led berjalan, tulisan berjalan , counter/timer dan masih banyak kegunaan lainnya

  • Bermain DOT Matrix - LOVEHURT

    Project Sederhana dengan Dot Matrix dan Attiny2313. Bisa menjadi hadiah buat teman atau pacarmu yang ulang tahun dengan tulisan dan animasi yang dapat dibuat sendiri.

  • JAM DIGITAL 6 DIGIT TANPA MICRO FULL CMOS

    Jika anda pencinta IC TTL datau CMOS maka project jam digital ini akan menunjukkan bahwa tidak ada salahnya balik kembali ke dasar elektronika digital , sebab semuanya BISA dibuat dengan teknologi jadul

  • BIKIN PCB SEDERHANA TAPI GA MURAHAN

    Bikin PCB itu ga susah kok..dengan software EAGLE CAD dan teknik sterika kamu dapat membuat PCB untuk berbagai project elektronika mu ...

Tampilkan postingan dengan label android. Tampilkan semua postingan
Tampilkan postingan dengan label android. Tampilkan semua postingan

Jumat, 01 Juli 2016

KIOS PULSA SMS VERSI ANDROID via WIFI











KREASI TERBARU DARI AISI555 

KIOS PULSA SMS VERSI ANDROID via WIFI



Dengan sangat bersedih..yahoo messenger akan berakhir. Maka dari itulah dibuatkan versi yang terbaru ini untuk menggantikan versi YM yang legendaris. Proses Pembelian Pulsa ke operator kembali menggunakan SMS akan tetapi kali ini sms dikirimkan melalui applikasi Message Send + Server yang dapat diunduh dan install melalui google play.

 


Dengan aplikasi ini maka sms dapat dikirimkan melalui WIFI yang terkonek ke HP tentunya dengan melalui web browser. Akhirnya dengan sedikit oprek-oprek maka software versi YM dapat ubah untuk mengirim SMS via browser.


Tanpa berlama-lama lagi ...silahkan unduh software terbaru kami disini  .


SELAMAT MENCOBA DAN JANGAN LUPA DONASINYA YA....
Share:

Selasa, 14 Juni 2016

Syuting Acara Kawinan Menggunakan Android dan Siaran Langsung ke TV Via Wi-fi




Masih ingatkah para pembaca setia blog ini dengan project pemancar TV dengan nintendo bekas ? Dahulu ide pembuatan pemancar ini muncul gara-gara permintaan seorang pembaca dari bandung yang ingin menyiarkan secara langsung acara pengajian di masjid kampungnya. Ini tidak berhenti sampai disini karena setelah itu muncul juga pesanan atau pertanyaan mengenai pemanfaatan pemancar TV mini ini untuk shooting acara kawinan kemudian ditampilkan di TV Layar Lebar di pintu masuk. Hasilnya ya tergantung unsur keberuntungan karena kadang kala siaran TV nya menjadi jelek akibat sering dipindahkannya perangkat dari kondangan ke kondangan lainnya.

Waktu berlalu dan teknologi menjadi semakin canggih dan terjangkau juga tentunya. Entah gayung bersambut atau tidak , penulis mendapatkan proyek yang berhubungan dengan wifi. Jadi setiap hari diisi dengan mengotak-atik router - access point - sinyal dan lain sebagainya. Lhoo bersambutnya dimana nih GAN ? Eaaaa ...disini yang saya anggap gayung bersambut adalah pesan whatsapp dari seorang pembaca yang bertanya kenapa jangkauan pemancar TV mini nya sangat terbatas dan juga semutnya bertebaran di layar. Lhuuukkk mana nyambungnya ? Tenang ..Lanjut baca dulu ya


Memakai video sender bagaimana ? Satu kata MAHAL ! nahh bersambutnya disini nih..kita manfaatkan saja Wi-Fi yang mulai umum ditelinga. Kameranya bagaimana? Apakah perlu beli yang ber wifi (sekelas go pro harga 4 jutaan) ? Tenang ...pakai Saja SMARTPHONE ANDROID ! Penjelasan singkatnya adalah mengubah kamera smartphone menjadi streaming kemudian melalui jaringan Wi-Fi streaming ini disampaikan ke SMART TV , atau jika memakai TV yang "stupid" bisa menggunakan perantara PC/Laptop.


Gambar diatas menunjukkan konfigurasi yang ingin dirancang untuk system shooting kawinan menggunakan android - wifi . Pertanyaan yang paling mendasar bagi pengusaha syuting kawinan adalah HARGA ...maka dari itu marilah kita bahas terlebih dahulu kira-kira budgetnya berapa ? Biasanya pengusaha kan begitu, udah capek-capek baca ealahh kemahalan ujungnya jadi "ILL FIL" dehh..

Kira-kira budgetnya kayak gini:

  • HP ANDROID (kelas menengah contoh merek asus): 2 jt   x 2 buah = 4 juta
  • Wifi Router (merek TP LINK ) : 300 rb  x 2 Buah = 600 ribu
  • Laptop (core i3) : 3.5 juta
  • Layar TV (merek polytron 40" ) : 3 Juta
  • Tongsis, kabel, power bank dll. :  400 ribu
  • TOTAL :   11,5 JUTA 

Dari segi harga masih terjangkau lahh , mengingat peralatan shooting kelas kampung juga segitu harganya. Harga bisa ditekan juga jika mengirit di HP dan Laptop.


Baik lanjutlah kita pada langkah-langkah yang perlu dikerjakan untuk merancang system nya.


1. ACCESS POINT (WI-FI ROUTER)

Pada rancangan ini kita memakai 2 buah access point - router merek TP link yang murah-murah saja (model TL-WR1043) . Salah satu difungsikan sebagai routernya atau server, sedangkan yang lainnya sebagai repeater model WDS tujuannya untuk meminimalkan perkabelan dan memudahkan perpindahan dari satu wifi ke wifi lainnya jika area cakupan terlalu luas. Jika anda berpengalaman di bidang mikrotik atau mungkin bisa menggandeng anak SMK yg jago jaringan maka hal ini menjadi lebih mudah lagi. Kadang saya menguasai ilmunya tapi menyampaikan di blog tidak semudah yang dikira looo. Duhh kann mumet juga mau nulis apa ...hehehe intinya cari cara yang termudah saja jika setting wifi - router merupakan hal yang baru bagi pembaca.



Sebaiknya jangan di broadcast nama wireless sehingga tidak gampang di obrak-abrik orang iseng akan tetapi jika menggunakan model bridging maka SSID nya perlu di broadcast. Untuk dapat menggunakan model WDS bridging / repeater maka pemilihan channel janganlah auto. Pilih ch yang diinginkan semisal ch 11. 


Sebagai bahan bacaan lanjut mengenai WDS bridging untuk wifi router TP link, silahkan baca di  http://www.tp-link.com/en/faq-440.html 


2. INSTALL APP ANDROID 

Sebenarnya terdapat banyak applikasi pada play store android yang menawarkan fasilitas merubah kamera hp android ke streaming. Saya pilihkan yang paling bagus dan ringan yaitu RTSP CAMERA SERVER.


*) Pengguna samsung dan xiaomi silahkan gunakan apps yg bernama "VXG RTSP SERVER"






Pilih menu options, dan akan muncul menu pilihan  RTSP SETUP seperti berikut :


Port default yang digunakan adalah 5554 dan dapat diubah sesuai keinginan. Jika ingin merekam ke dalam handphone hasil streamingannya, maka Enable Recording diubah menjadi ON. Pilihlah OFF jika perekaman dilakukan di Laptop atau jika hanya ingin live streaming tanpa merekam. Jangan heran jika storage HP akan berkurang jika recording ON.



Anda dapat merubah jenis video yang akan di streaming, baik dari segi resolusi, Frames per second ataupun ascpect ratio. Semakin besar resolusi maka bandwith wi-fi yg digunakan semakin besar juga, sehingga penulis menyarankan memakai setting aspect ratio 16:9 dan resolution 426x240 .


Jangan lupa focus mode dibuat auto saja atau continuous mode video (pilihan paling bawah). Pengaturan lainnya dapat dicoba-coba sehingga didapatkan kualitas yang diinginkan.


3. LAPTOP dan TV LCD

Jika menggunakan Smart TV maka pekerjaan menjadi lebih mudah karena bisa memutar langsung hasil streamingan. Tapi jangan kawatir jika hanya memiliki "stupid TV" bisa dibantu dengan komputer / laptop. Keuntungan menggunakan laptop adalah bisa memutar 2-3 streaming secara bersamaan dan kemudian ditampilkan ke layar LCD (melalui kabel HDMI / VGA) bergantian sesuai keinginan.



Software player yang digunakan penulis adalah VLC dengan pertimbangan ringan dan simple.




CARA SHOOTING VIDEO

Setelah pengaturan dirasa cukup maka shooting bisa dilakukan. Pastikan HP dan LAPTOP terhubung dengan jaringan wifi yang sama ! Catat juga IP yang didapat bila perlu menggunakan static IP/permanen IP. Perlu dicatat yang akan kita play adalah stream RTSP dari software android, sedangkan dilayar HP setelah kita tekan tombol start muncul seperti berikut :



Tulisan yang muncul adalah http://192.168.1.67:8080/playlist.m3u .Masukkan alamat tadi ke VLC player dengan memilih play network streaming, dan akan muncul playlistnya seperti ini.



Playlist terbaru ini muncul sejak update dari app RTSP Stream terbaru dan bisa dilihat dari gambar dalam playlist dapat memilih langsung kamera depan atau belakang bahkan hasil rekaman (tidak disarankan agar HP tidak berat kerjanya). Oooo iya jangan lupa mengaktifkan docked playlist agar terlihat playlistnya dan gak bingung mencari seperti gambar diatas.






Hasilnya di laptop saya seperti ini nih ...




Tinggal colokin Laptop ke TV LCD via Kabel HDMI ...beres dehh. Selanjutnya untuk zoom atau flash dapat juga diatur saat live streaming dengan memilih tombol effects.



Mudah bukan ? Bukan hanya acara kawinan lhoo yg bisa di streaming, jika memiliki jaringan internet mungkin bisa tream juga ke luar sehingga semisal acara pengajian, odalan (hindu) , kebaktian (nasrani) dan lain sebagainya bisa juga cara ini digunakan .


Mau yang seperti ini ?


Lanjut di pembahasan berikutnya yaa...


SELAMAT MENCOBA ...ehh selamat shooting kawinan GAN !


Share:

Selasa, 19 April 2016

Internet Of Things - Liat Dulu Yuk Dasar Pemikirannya



Einstein pernah berkata ..." suatu saat hidup manusia akan diatur oleh mesin.." , ya memang akhirnya benar apa yg dikatakan einstein, seperti juga postulat dan hitungan matematika nya yg akhirnya terbukti jauh beberapa tahun di masa depan. Inilah sebenarnya yang dibayangkan oleh einstein dengan mesin, yang ketika sudah sampai masanya mesin itu bernama INTERNET !

Ketika penulis mulai mengenal internet ketika itu hanya sebagai bayangan saja karena melihatnya melalui acara di TV satelit, ketika itu CNN mulai menayangkan acara tech-show yg menampilkan bagaimana AOL kala itu menjadi tujuan "browsing" orang amerika. Di indonesia pengenalan internet di pelosok dilakukan oleh kantor pos melalui jaringan WASANTARA net nya dan ini cukup dibilang menyedihkan. Kampuslah yang kemudian menggerakkan nadi internet lebih deras, dengan munculnya warnet hampir desetiap kantin jurusan.

tipikal warnet tahun 2000an

Itu yang dibicarakan adalah era milenium, tahun 2000an ..tapi itu baru saja loo ga sampai 20 tahun. Dan lihatlah apa yg dapat dilakukan orang ditahun 2016 ? semua akan dihubungkan ke internet. Mungkin sampai toilet mu pun akan dihubungkan ke jaringan Wi-Fi di rumahmu. Dan terasa semakin jadul dan tak bergunalah blog dasar digital ini ....wait ...jangan takabur dulu, mari kita bahas dulu apa yg dibutuhkan oleh I O T itu ?


1. SENSOR

sensor suhu & kelembaban SHT11 yg sering digunakan penulis


Ini bagian yang paling penting saya kira, menjadi indera utama dari system IOT sama halnya dengan mata dan hidung manusia. Sebenarnya yg dimaksud oleh IOT adalah bagaimana mendapatkan kondisi suatu system dan kemudian dapat dilakukan tindakan terhadapnya melalui jaringan internet. Tanpa sensor yang tepat maka mustahil melakukan monitoring seperti halnya bertanya warna bunga kepada orang yg buta warna.


2. CONTROLER + IP DATA CONVERTER

Arduino dengan WiFiShield nya 

Akhirnya penulis yg benci terhadap platform hardware langsung jadi,  mengakui bahwa IOT sampai seperti sekarang ini berkembang akibat munculnya kreatifitas para "oprekers" dari arduino, raspbery dll. Tapi janganlah kawatir bagi pecinta digital "from scratch" seperti saya , masih ada cara untuk melakukan koneksi dari sensor menuju kontroller dan internet, ada beberapa platform konverter TTL to IP/wifi yg bisa dimanfaatkan. 

Controller yg dimaksud bisa berupa platform microcontroller 8bit atau 32 bit (seperti arduino) , embeded PC seperti raspberry  ataupun platform gabungan seperti yg pernah dibuat penulis, yaitu dari AVR <==> RS 232 <==>PC <==> IP/CLOUD . Jangan lupa semua data ini akan dirubah menjadi berbasis IP sehingga dibutuhkan konverter seperti wifishield nya arduino atau PC seperti yg dipakai penulis dulu.


3. JARINGAN INTERNET 


Penulis pernah membagikan cara berkomunikasi dengan alat/sensor/aktuator melalui SMS , itu belum lama sekitar 3-5 tahun yg lalu. Dan yg terjadi kini SMS menjadi sepertinya hidup segan mati tak mau, mungkin hanya di daerah yg pelosok saja masih memanfaatkan SMS.  Semuanya sekarang kearah Internet Based ! Nokia yang tidak mau berubah dan merasa masih kuat dengan layanan VOICE-SMS harus mati pelan-pelan karena tidak beradaptasi dengan jaman. Ketika perubahan terjadi mau tidak mau harus berubah atau akan ditinggalkan. Akan tetapi teknologi SMS masih bisa dipakai backup dan jangan dilupakan juga ya...

4. APPS !


Ini nih yg wajib di buat untuk melengkapi IOT . Akan terasa jadul dan menentang IOT jikalau koneksi sensor ke internet kemudian masih menggunakan konsol semacam telnet. Jadi sangat penting untuk membuat aplikasi minimal dapat dijalankan di browser komputer / HP . Android dan Iphone membuat semuanya harus menjadi APPS jika ingin membuat jualan system IOT menjadi laku. Jadi sekarang tukang solder harus berselingkuh dengan programmer dan untunglah penulis sempat menyentuh programming android melalui platform adobe air - flash, tapi sayang adobe mulai dimusuhi android...Yang sabar Ya Brooo...


Pada akhir tulisan ini ingin disampaikan jika semua teknologi baru harus di terima dengan tangan terbuka , toh kalau dasar-dasar nya sudah kuat maka akan menjadi mudah memahaminya. Jadi tidak ada salahnya belajar dasar-dasar digital karena pada intinya IOT merupakan penggabungan dari teknologi yg sudah ada menjadi "kekinian" dengan terhubung ke jaringan Internet. 

Share:

Jumat, 22 Maret 2013

Tutorial XML Untuk Aplikasi Dinamis Android - Adobe Air




Setelah kita berhasil membuat swf loader, kali ini akan kita manfaatkan keunggulan dari flash-adobe air lainnya yakni dapat melakukan load database berbasis XML yang sangat simpel dan berguna. Dengan menggunakan database "Tree" yang dimiliki nya maka akan sangat mudah untuk melakukan update isi dari suatu aplikasi dinamis hanya dengan merubah satu file text saja. Untuk belajar dasar-dasar mengenai flash (actionscript3) dan xml dapat membaca tutorial yang sangat menarik disini.

Format file xml dimulai dengan tag  <?xml version="1.0" encoding="UTF-8"?> , selanjutnya disusun berdasarkan tag < nama > </nama> yang dinamakan tiap node dan boleh memiliki children node didalamnya. Perhatikan kode berikut :


<GALLERY>

<IMAGE TITLE="gambar 1">
<FILE>gambar1.jpg</FILE>
<TEKS>ini teks untuk gambar1</TEKS>
</IMAGE>

<IMAGE TITLE="gambar 2">
<FILE>gambar2.jpg</FILE>
<TEKS>ini teks untuk gambar2</TEKS>
</IMAGE>

<IMAGE TITLE="gambar 3">
<FILE>gambar3.jpg</FILE>
<TEKS>ini teks untuk gambar3</TEKS>
</IMAGE>


</GALLERY>


kode diatas merupakan kode XML dari GALLERY yang memiliki node <IMAGE> yang beranak<FILE> dan <TEKS>. Panjang dari node dan anak dari GALLERY dapat disesuaikan sesuai keinginan asal dengan format yang seragam. Node IMAGE disini memiliki 3 anggota, sehingga akan menjadi array yang sangat simple jika dipindahkan ke FLASH dengan contoh test script berikut: 



simpan file xml tadi dengan nama "test.xml"

var myXML:XML;
var myLoader:URLLoader = new URLLoader();

myLoader.load(new URLRequest("test.xml"));
myLoader.addEventListener(Event.COMPLETE, processXML);

function processXML(e:Event):void {
myXML = new XML(e.target.data);
trace(myXML.IMAGE.length());
trace(myXML.IMAGE.*);
trace(myXML.IMAGE[0].TEKS);
trace(myXML.IMAGE.(@TITLE=="gambar 3").FILE);

}



output dari tracing scipt diatas adalah :



3
<FILE>gambar1.jpg</FILE>
<TEKS>ini teks untuk gambar1</TEKS>
<FILE>gambar2.jpg</FILE>
<TEKS>ini teks untuk gambar2</TEKS>
<FILE>gambar3.jpg</FILE>
<TEKS>ini teks untuk gambar3</TEKS>
ini teks untuk gambar1
gambar3.jpg






Dan dari hasil tracing diatas dapat dilihat betapa simplenya database dapat diubah-ubah sesuai keinginan, semisal kita ingin merubah nama gambar ke 3 tinggal merubah saja nama filenya sesuai alamat yang dituju. contoh script berikut jika kita menginginkan menampilkan gambar pada file lokal melalui XML

file gambar1.jpg , gambar2.jpg dan gambar3.jpg harus ada di lokasi yang satu folder dengan aplikasi.

var myXML:XML;
var myLoader:URLLoader = new URLLoader();

myLoader.load(new URLRequest("test.xml"));
myLoader.addEventListener(Event.COMPLETE, processXML);

function processXML(e:Event):void {
myXML = new XML(e.target.data);

var pictURL:String = myXML.IMAGE[1].FILE;
var pictURLReq:URLRequest = new URLRequest(pictURL);
pictLdr.load(pictURLReq);
addChild(pictLdr);

}



output yang keluar adalah gambar2.jpg pada layar 


jika kita memiliki text field dengan nama textnya, maka bisa juga di tambahkan seperti berikut:

var myXML:XML;
var myLoader:URLLoader = new URLLoader();

myLoader.load(new URLRequest("test.xml"));
myLoader.addEventListener(Event.COMPLETE, processXML);

function processXML(e:Event):void {
myXML = new XML(e.target.data);

var pictURL:String = myXML.IMAGE.(@TITLE =="gambar 3").FILE;
var pictURLReq:URLRequest = new URLRequest(pictURL);
pictLdr.load(pictURLReq);
addChild(pictLdr);
textnya.text=myXML.IMAGE.(@TITLE == "gambar 3").TEKS;

}



Maka output yang didapat adalah flash meload gambar3.jpg serta menampilkan isi TEKS yaitu: "ini teks untuk gambar 3". Mudah bukan? Ayo kita lanjut saja ke praktek beneran pada adobe flash cs5.5 . kali ini kita akan membuat loader file xml, dengan gambar yang bersumber di internet dan teks dari file XML yang diupload ke server.





Sesuai pembahasan loader swf sebelumnya, kita akan membuat animasi pre-loader dengan menggunakan tween, sehingga kelihatan halus saat menunggu file xml serta gambar di load ke layar android. Kita membuat animasi loader serta textbox dengan UI component berupa scroll slider.

Langsung saja perhatikan code berikut dan kita akan bahas setelahnya.



var myXML:XML;
var myLoader:URLLoader = new URLLoader();
var urutan:Number=0; //urutan gambar
tulisan.visible=false; //tulisan
uiScroller.visible=false; //text scroller

//xml loader,  contoh filenya ada di server berikut
//ubah sesuai keinginan (lokal juga bisa)

myLoader.load(new URLRequest("http://www.flexievdo.net/test.xml"));

//listener
myLoader.addEventListener(Event.COMPLETE, processXML);

//pengatur gambar
var pictLdr:Loader = new Loader();
pictLdr.contentLoaderInfo.addEventListener(Event.COMPLETE, kecilkan);

//geser-geser secara swap
Multitouch.inputMode = MultitouchInputMode.GESTURE;
stage.addEventListener(TransformGestureEvent.GESTURE_SWIPE, onSwipe);


//function untuk menyeuaikan gambar

function kecilkan(e:Event):void {
pictLdr.x=10;
pictLdr.y=10;
pictLdr.width=300;
pictLdr.height=310;
trace("selesai");
tulisan.visible=true;
uiScroller.visible=true;

//tampilkan setelah gambar selesai di load

nama.text=myXML.IMAGE[urutan].@TITLE;
tulisan.text=myXML.IMAGE[urutan].TEKS;
ke.text="Gambar ke "+ String(urutan + 1) + " dari " + String(myXML.IMAGE.length());
uiScroller.update();

loaded.visible=false;

}


//pemroses xml

function processXML(e:Event):void {
myXML = new XML(e.target.data);


loaded.visible=true;

var pictURL:String = myXML.IMAGE[urutan].FILE;
var pictURLReq:URLRequest = new URLRequest(pictURL);
pictLdr.load(pictURLReq);
addChild(pictLdr);



}


//swipe babe !!

function onSwipe(evt:TransformGestureEvent):void {
 
//swipe akan menentukan urutan gambar
 
 if( evt.offsetX == -1){
 
 urutan++ ;
 if(urutan >= myXML.IMAGE.length()) {
  urutan=0;
 }
 
 }

 else if( evt.offsetX == 1){
 
 urutan-- ;
 if(urutan < 0 )  {
  urutan= (myXML.IMAGE.length() -1);
 }
 
 }

//hayo kita hancurkan kemudian tampilkan lagi

if(evt.offsetX == 1 || evt.offsetX == -1 )
{

tulisan.visible=false;
uiScroller.visible=false;
loaded.visible=true;
nama.text="";
tulisan.text="";
ke.text="";
uiScroller.update();


removeChild(pictLdr);
var pictURL:String = myXML.IMAGE[urutan].FILE;
var pictURLReq:URLRequest = new URLRequest(pictURL);
pictLdr.load(pictURLReq);
addChild(pictLdr);
}

}








Terlihat mudah saja, bahwa tiap file XML memiliki format sesuai contoh awal pada test.xml dan informasi yang akan digunakan berupa @TITLE, FILE, dan TEKS . Kita akan memainkan proses swipe untuk merubah posisi dari IMAGE[urutan] dan kemudian dengan image loader akan diresize sesuai panjang dan lebar dari layar HP Android. Sebagai keunggulan dari xml dimana kita dapat mengambil source gambar dari mana saja seperti contoh berikut, dan file tutorial lengkap dapat diunduh disini.


<GALLERY>
<IMAGE TITLE="BALI ISLAND OF GOD">
<FILE>http://us.123rf.com/400wm/400/400/saiko3p/saiko3p1107/saiko3p110700147/

10085679-beauty-rice-terrace-with-palms-on-bali-island.jpg</FILE>
<TEKS>Bali, the famed Island of the Gods, with its varied landscape of hills 

and mountains, rugged coastlines and sandy beaches, lush rice terraces and 

barren volcanic hillsides all providing a picturesque backdrop to its 

colourful, deeply spiritual and unique culture, stakes a serious claim to be 

paradise on earth. With world-class surfing and diving, a large number of 

cultural, historical and archaeological attractions, and an enormous range of 

accommodations, this is one of the world's most popular island destinations 

and one which consistently wins travel awards. Bali has something to offer a 

very broad market of visitors from young back-packers right through to the 

super-rich.
</TEKS>
</IMAGE>
</GALLERY>



Jangan lupa untuk mempublish aplikasi adobe air - android dengan permission "Internet"


-=UPDATE=-


Contoh aplikasi yang telah dibikin dengan methode xml dan ditambah dengan image caching




SELAMAT MENCOBA
Share:

Kamis, 21 Maret 2013

TUTORIAL Swf loader Untuk membuat Aplikasi Android yang Dinamis



Ketika aplikasi android yang ingin dibuat ditujukan dapat memberikan informasi yang dinamis atau berubah-ubah, maka diperlukan proses pengunduhan konten dari isi aplikasi dari server yang telah ditentukan. Inilah menjadi keunggulan dari paltform adobe air, dimana seperti aplikasi induknya yaitu adobe flash memiliki fasilitas untuk mengunduh (load) file media seperti jpg, gif, video dan yang paling umum adalah melakukan load terhadap file format swf. Pada tutorial kali ini diperhatikan bahwa diperlukan web server via internet atau server http lokal yang dapat diakses melalui HP Android kamu.

(klik pada gambar untuk memperjelas)


Seperti pada tutorial terdahulu maka kita akan memerlukan adobe flash CS5.5 ke atas untuk mendesain applikasi berbasis adobe air ini. Jadi jika masih bingung harap menuju ke tutorial dasar pada topik GPS. Karena kali ini kita akan berhubungan dengan proses loading, maka kita butuhkan suatu animasi loading yang bebas dapat dirancang dan tentunya dengan flash tidak menjadi masalah. Pada contoh ini dibuat gambar gear yang berputar ketika proses loading. Jika menginginkan proses loading membutuhkan penunjukan persentase  loading maka ditambahkan textfield untuk menulisnya seperti contoh dibawah.

Gambar animasi gear berputar dengan proses tween yang sangat sederhana



 Gambar Textfiled persen loading



Gambar dibawah ini menunjukkan proses pembuatan isi dari file swf yang akan di unduh atau di load oleh aplikasi, kali ini akan dibuat dengan nama " isi.swf ". Format file dapat berupa file media apa saja yang mungkin dapat dikenali oleh flash seperti jpg, gif, mov dan sebagainya. Setelah di compile atau disimpan dalam format dan ukuran yang pas, maka file tersebut harus di upload pada webserver internet atau jika dirumah terdapat komputer yang menggunakan wifi, maka dengan jaringan add-hoc via wifi serta server apache , xampp dan lain sebagainya , file ini dapat diupload secara lokal. Pada contoh ini file yang akan di load berupa file swf dengan alamat : http://www.flexievdo.net/isi.swf




Lanjutkan dengan merancang script pada frame dan layer khusus (tanpa ada bentuk geometri lainnya ) dan buatlah script untuk melakukan load file swf tadi seperti contoh berikut:




var request:URLRequest = new URLRequest("http://www.flexievdo.net/isi.swf"); //ubah sesuai file yg akan di load
var loader:Loader = new Loader() 


loader.contentLoaderInfo.addEventListener(Event.COMPLETE, onLoaderComplete);
loader.load(request); 
addChild(loader);




function onLoaderComplete(event:Event):void
{

loadan.visible=false;
trace("complete");

}





Pada contoh diatas terdapat script yang menunggu Event.COMPLETE sehingga animasi loading gear dapat dihilangkan dari tampilan layar saat file telah selesai diunduh. Jika diperlukan penulisan persentase file yang sudah di load, maka tambahkan event seperti contoh berikut yang akan ditulis pada textfield "persen".



loader.contentLoaderInfo.addEventListener(ProgressEvent.PROGRESS, onload);


function onload(evt:ProgressEvent):void 
{ 
var perc:Number = evt.bytesLoaded / evt.bytesTotal; 
loadan.persen.text = Math.ceil(perc * 100).toString(); 
trace(perc);
} 





Kemudian kalau mengingat bahwa kadang-kadang file swf  atau gambar yang diload terlalu besar atau kekecilan, berdasarkan tutorial gesture sebelumnya maka tambahkan saja script gesture sehingga menjadi lebih menarik. Kali ini kita tambahkan GESTURE_PAN yang merupakan gesture dengan dua jari untuk menggeser layar yang terlihat kegedean ke posisi yang diinginkan. 


Multitouch.inputMode = MultitouchInputMode.GESTURE;
stage.addEventListener(TransformGestureEvent.GESTURE_ZOOM, onZoom);
stage.addEventListener(TransformGestureEvent.GESTURE_PAN, onPan);

function onZoom(evt:TransformGestureEvent):void {
 
 
loader.scaleX *= evt.scaleX;
loader.scaleY *= evt.scaleY;
 
}

function onPan(evt:TransformGestureEvent):void
{
loader.x += evt.offsetX;
loader.y += evt.offsetY;
}





Jangan lupa untuk proses publish menggunakan permission INTERNET karena server akan diakses melalui internet.





TAMBAHAN

Error handling jika file tidak bisa diload karena network error , dapat dilihat seperti contoh berikut




jadi kita membuat tombol yang berisi tulisan bahwa loading error, kemudian akan muncul pilihan retry. Untuk itu ketika awal tombol kita tombol.visible=false; , lalu ketika error terjadi akan dihandle oleh error handling seperti contoh script berikut ini



tomret.visible=false; //tomret nama instance tombol retry

//error handler listener
loader.contentLoaderInfo.addEventListener(IOErrorEvent.IO_ERROR, loaderIOErrorHandler);
//listener dari tombol
tomret.addEventListener(MouseEvent.CLICK, clicked1);

function clicked1(event:MouseEvent):void
{
tomret.visible=false;

loader.load(request); 
addChild(loader);
}

//jika IO error maka ini yang dipanggil
function loaderIOErrorHandler(evt:IOErrorEvent):void
{
 
 trace("error broo!");
 tomret.visible=true;

 
}






File tutorial selengkapnya dapat di download disini



SELAMAT MENCOBA
Share:

Senin, 11 Maret 2013

Tutorial Gesture (kontrol layar dengan jari) pada Adobe Air



Gesture merupakan fasilitas yang disediakan oleh smartphone untuk mempermudah operasi pada layar dengan menggunakan kombinasi sentuhan 2 buah jari. Gesture yang paling terkenal adalah zoom dengan menggunakan 2 jari pada layar yang kemudian jari ini di jauhkan posisinya sesuai besar zoom yang diinginkan. Kali ini juga akan dibahas mengenai gesture rotate/putar serta swipe/geser.

(klik pada gambar dibawah untuk memperjelas)



Tutorial kali ini dimulai dengan mengcopy paste gambar pada library , sebaiknya jika menggunakan gambar dari luar menggunakan format PNG yang memudahkan penampakan transparansi dari gambar. Contoh yang diberikan berupa gambar robot android, yang kemudian movieclipnya diberikan nama instance "robo".

Letakkan gambar robot ditengah layar /stage utama dan kemudian buatlah "layer" untuk menyisipkan actionscript. Untuk gesture zoom dan rotate sangatlah mudah seperti pada contoh script berikut:






Multitouch.inputMode = MultitouchInputMode.GESTURE;
stage.addEventListener(TransformGestureEvent.GESTURE_ZOOM, onZoom);
stage.addEventListener(TransformGestureEvent.GESTURE_ROTATE, onRotate);

function onZoom(evt:TransformGestureEvent):void {
 
 
robo.scaleX *= evt.scaleX;
robo.scaleY *= evt.scaleY;
 
}

function onRotate(evt:TransformGestureEvent):void {
robo.rotation += evt.rotation;

}



Terlihat betapa simplenya script yang digunakan untuk membuat efek zoom dan rotate dan langsung bisa diaplikasikan untuk merubah scale atau pembesaran serta rotation dari posisi x dan y pada instance "robo".

Baiklah kita lanjutkan dengan pembahasan yg lebih lanjut yaitu gesture swipe. Gesture swipe biasanya ditemui ketika membaca majalah digital contohnya saat membalik halaman pada tablet/handheld. Nilai yang dihasilkan dari proses swipe ini adalah angka yang tetap, yaitu -1 untuk swipe dari kanan ke kiri atau atas ke bawah, sedangkan sebaliknya akan menghasilkan angka 1.

Untuk itu kita butuh membuat robot android satu lagi dan kita namakan robo2, dan robot android cewek ini akan kita berikan classname sendiri, bukan dengan instance name seperti contoh sebelumnya



Class name yang kita buat adalah robo1 dan robo2 dimana nantinya akan dipanggil ke dalam stage menggunakan script seperti berikut


import flash.display.MovieClip; //class otomatis ditambahkan pada CS5.5

Multitouch.inputMode = MultitouchInputMode.GESTURE;
stage.addEventListener(TransformGestureEvent.GESTURE_ZOOM, onZoom);
stage.addEventListener(TransformGestureEvent.GESTURE_ROTATE, onRotate);
stage.addEventListener(TransformGestureEvent.GESTURE_SWIPE, onSwipe);

var t:Timer = new Timer(1); //timer untuk animasi gerak
t.addEventListener(TimerEvent.TIMER, onTimer); 


var robot:MovieClip; //variable untuk movieclip robo
var pilihan:Number = 1;
var step:Number = 1;
//awal tampilan
robot= new robo1;
addChild(robot);
robot.x=160;
robot.y=240;




function onZoom(evt:TransformGestureEvent):void {
 
 
robot.scaleX *= evt.scaleX;
robot.scaleY *= evt.scaleY;
 
}

function onRotate(evt:TransformGestureEvent):void {
robot.rotation += evt.rotation;

}


//perlakuan terhadap hasil swipe ke animasi
 
function onTimer(event:TimerEvent):void{
robot.x -=5;
if(robot.x < (-robot.width/2)     )  {
 removeChild(robot);
    robot=null;
 if(pilihan == 1){
 robot=new robo2;
 pilihan=2;
 step=2;
 }
 else{
 robot=new robo1;
 pilihan=1;
 step=2;
 }
 
 addChild(robot);
 robot.x=350;
 robot.y=240;
}
if(step == 2 && robot.x <= 161){
 t.stop();
 step=1;
}

event.updateAfterEvent();
}
 
 


function onSwipe(evt:TransformGestureEvent):void {

 if(evt.offsetX == -1){
 
 t.start();

 
 }




}


Simple dan sangat powerful !! hanya itu kata yang dapat saya berikan kepada adobe air, dan hasilnya dapat dilihat pada video berikut :






Jangan lupa untuk membaca tutorial sebelumnya jika ingin melihat cara publish ke handheld android kamu. Source code untuk tutorial ini dapat di download disini

SELAMAT MENCOBA
Share:

Minggu, 10 Maret 2013

Tutorial Aplikasi Memanfaatkan Accelerometer Pada Android berbasis Adobe Air



Accelerometer merupakan sensor kemiringan yang umum terdapat pada Hanheld berbasis Android. Sensor ini memiliki fungsi untuk menentukan posisi tilting dari Handheld terhadap koordinat X, Y atau kadangkala memiliki juga koordinat Z utamanya pada HandHeld kelas tinggi.

Adobe Air memiliki kemampuan untuk mendeteksi sensor accelerometer dimana class atau script yang digunakan adalah "Accelerometer", contoh inisialisasi nya seperti berikut:


var theAcc:Accelerometer = new Accelerometer();


Seperti biasa kita akan menggunakan software development adobe flash CS 5.5 dan buatlah project "AIR FOR ANDROID" dan buatlah tampilan dengan gambar geometry yang kali ini sebagai contohnya menggunakan sebuah kotak.

(klik pada gambar untuk memperjelas)



Jangan lupa untuk merubah kotak tadi menjadi movieclip sehingga dapat diberikan nama dan akan diolah selanjutnya. Lanjutkan dengan membuat 1 layer pada timeline dan pada layer ini akan ditempatkan action script.




Lanjutkan dengan menambahkan script seperti ini :


var theAcc:Accelerometer = new Accelerometer();

theAcc.setRequestedUpdateInterval( 50 );
if (Accelerometer.isSupported == true) {
theAcc.addEventListener(AccelerometerEvent.UPDATE, onAccUpdate);
}else {
// do something different for the entire app
}
function onAccUpdate( e:AccelerometerEvent ):void {
 
posisi.text =kotak.x.toString() + " , " + kotak.y.toString() ;
acel.text =e.accelerationX.toString() + " , " + e.accelerationY.toString() ;

kotak.x -= ( e.accelerationX * 50);
kotak.y += ( e.accelerationY * 50);
if ( kotak.x < 0 ) {
kotak.x = 0;
} else if (kotak.x > (stage.stageWidth - 30)  ) {
kotak.x = stage.stageWidth - 30 ;
}
if ( kotak.y < 0 ) {
kotak.y = 0;
} else if (kotak.y > (stage.stageHeight -30) ) {
kotak.y = stage.stageHeight -30 ;
}

}



Pada script diatas terlihat bahwa posisi dari movieclip bernama kotak akan dirubah-rubah sesuai dengan nilai dari kemiringan accelerometer X dan Y. Pada bawah dari aplikasi terdapat tracing yang berguna untuk melihat posisi kotak dan pembacaan dari accelerometer. Source Code (adobe flash CS5.5) dapat didownload disini.


SELAMAT MENCOBA 
Share:

Sabtu, 09 Maret 2013

Tutorial Aplikasi Touch Sensor Pada Android berbasis Adobe Air




Salah satu fasilitas yang sangat umum dijumpai pada smartphone berbasis android adalah touch sensor pada layar. Selain Touch ada juga fasilitas yang dinamakan gesture yaitu kombinasi penekanan beberapa jari untuk mendapatkan efek tertentu.  Kali ini kita akan bermain-main dengan fasilitash touch dan drag. Seperti pada pembahasan sebelumnya, adobe air besutan pengembang Adobe memiliki keunggulan pada kemudahan desain yang bisa dibilang 10x lebih mudah jika dibanding dengan SDK asli yang berbasis eclipse-java.


klik pada gambar untuk melihat lebih jelas


Sebelum memulai ada baiknya melihat pembahasan sebelumnya karena beberapa pembahasan yang serupa akan di lewati. Langkah awal yang kita buat adalah sebuah lingkaran atau bentuk geometri lain. Bentuk geometri ini nantinya akan digerak-gerakkan oleh jari-jemari. Pada contoh yang dibuat penulis, bentuk geometry berupa lingkaran dan memiliki animasi lingkaran luar yang mengembang-kempis. Jangan lupa untuk merubah bentuk geometri ini menjadi movieclip agar bisa dipanggil sebagai library class , seperti contoh pada gambar dibawah.




Cara penamaan class adalah dengan melakukan click kanan pada nama library lingkaran tadi kemudian pilih properties, atau bisa juga pada saat merubah kedalam movieclip. Beri nama class sesuai keinginan.




Pada gambar diatas adalah contoh membuat animasi lingkaran kembang-kempis dengan menggunakan tweening. Proses twieen akan secara otomatis membuat animasi sesuai perubahan antara key frame start dan key frame selanjutnya, tanpa harus merubah gambar pada semua frame.



Selanjutnya kita akan menuju ke scripting. Class yang paling penting dalam pemrograman touch sensor adalah :


Multitouch.inputMode=MultitouchInputMode.TOUCH_POINT; 



Selanjutnya experimen pertama adalah dengan menampilkan gambar lingkaran setiap kali layar ditekan. Script nya seperti dibawah ini:


Multitouch.inputMode=MultitouchInputMode.TOUCH_POINT; 

var bola:lingkaran;

stage.addEventListener(TouchEvent.TOUCH_BEGIN, mulai); 



function mulai(evt:TouchEvent):void{


bola=new lingkaran;
addChild(bola);

bola.x=evt.stageX;
bola.y=evt.stageY;

}








Jika ingin mempublish ke HandHeld Android kamu, sebaiknya baca dulu pembahasan sebelumnya disini

Hasil dari script pertama adalah munculnya gambar lingkaran setiap kali layar ditekan. Bagaimana jika kita ingin menghilangkan lingkaran saat jari diangkat dari layar ? ubah scriptnya seperti ini :



Multitouch.inputMode=MultitouchInputMode.TOUCH_POINT; 

var bola:lingkaran;

stage.addEventListener(TouchEvent.TOUCH_BEGIN, mulai); 
stage.addEventListener(TouchEvent.TOUCH_END, selesai);


function mulai(evt:TouchEvent):void{

if(bola == null){

bola=new lingkaran;
addChild(bola);

bola.x=evt.stageX;
bola.y=evt.stageY;
}


}


function selesai(evt:TouchEvent) {
 
 removeChild(bola);
 bola=null;
 
}




Well...kenapa tidak kita gerak-gerakkan saja lingkaran ini ? Hajar saja bos !!


Multitouch.inputMode=MultitouchInputMode.TOUCH_POINT; 

var bola:lingkaran;

stage.addEventListener(TouchEvent.TOUCH_BEGIN, mulai); 
stage.addEventListener(TouchEvent.TOUCH_END, selesai);
stage.addEventListener(TouchEvent.TOUCH_MOVE, gerak); 



function mulai(evt:TouchEvent):void{

if(bola == null){

bola=new lingkaran;
addChild(bola);

bola.x=evt.stageX;
bola.y=evt.stageY;
}


}

function gerak(evt:TouchEvent) {
 
bola.x=evt.stageX;
bola.y=evt.stageY;
 
}

function selesai(evt:TouchEvent) {
 
 removeChild(bola);
 bola=null;
 
}




MUDAH BUKAN ?   untuk file tutorial selengkapnya (adobe flash cs5.5) dapat didownload disini
Share:

Kontak Penulis



12179018.png (60×60)
+628155737755

HP: 081331339072
Mail : ahocool@gmail.com

Site View

Categories

555 (6) 7 segmen (3) adc (4) amplifier (2) analog (10) android (11) antares (3) arduino (14) attiny (1) attiny2313 (17) blog (1) bluetooth (1) cmos (2) crypto (2) dasar (35) display (3) esp8266 (3) gcc (1) iklan (1) infrared (2) Input Output (3) iot (16) jam (6) jualan (12) kereta api (1) keyboard (1) keypad (3) kios pulsa (2) kit (6) komponen (12) komputer (3) komunikasi (1) kontrol (4) lain-lain (8) lcd (2) led (9) led matrix (6) line tracer (1) lm35 (1) memory (1) metal detector (4) microcontroller (55) mikrokontroller (7) mikrotik (5) ninmedia (2) ntp (1) paket belajar (19) palang pintu otomatis (1) parabola (38) pcb (2) praktek (2) project (33) proyek (1) python (1) radio (3) raspberry pi (4) remote (1) revisi (1) rfid (1) robot (1) rpm (2) rs232 (1) script break down (3) sdcard (3) sensor (1) sharing (3) signage (1) sinyal (1) sms (6) software (18) tachometer (2) telepon (7) televisi (72) television (5) transistor (1) troubleshoot (3) tulisan (59) tutorial (78) tvri (2) vu meter (2) vumeter (2) wav player (3) wayang (1) wifi (3)

Arsip Blog

Diskusi


kaskus
Forum Hobby Elektronika