android: my first app

ไม่นานมานี้ได้มีโครงการกับเพื่อนๆว่าเราอยากจะทำเกมส์กัน  แต่พอเรียนจบมาทุกคนก็แยกย้ายไปทำงานทำการ ไม่มีใครมานั่งโต้รุ่งบ้าเกมส์ด้วยกันอีกต่อไป คราวนี้กลับมาคุยกันอีกครั้งพร้อมโปรเจคใหม่ว่าอยากลองทำเกมส์บนแพลทฟอร์มอื่นดูบ้าง ที่เห็นหลักๆก็มี Java(J2ME), iPhone และ Android ก็ถกเถียงกับอยู่นานจึงได้ข้อสรุปว่า ลองทำบนแอนดรอยดีกว่า เพราะบน iPhone เขาน่าจะมี apps มากมายแล้ว ประกอบกับต้องใช้ mac เขียน ซึ่งไม่ใช่ทุกคนจะมีเครื่อง พอตกลงได้ว่าจะทำบนแอนดรอยก็ไปหาเอกสารอ่าน ซึ่งกูเกิ้ลก็ทำไว้ค่อนข้างดี แล้วก็ดาวน์โหลด SDK และ Eclipse plugin มา ก็ได้เวลาเริ่มทำแอพชิ้นแรก ซ้อมมือก่อนทำเกมส์จริงจัง โดยภาษาที่ใช้เขียนคือ Java ซึ่งพอเป็นบ้างอยู่แล้ว ทำให้ต่อยอดได้ง่ายหน่อย

Read more

Wave, preview

Google เตรียมเปิดตัว Wave Preview ในวันพุธที่ 1 ตุลาคมนี้ และจะแจกแอคเคาท์แก่ผู้ใช้งานจำนวน 100,000 แอคเคาท์ โดยตามบล๊อคของกูเกิ้ลเวฟ ทางกูเกิ้ลมีแผนที่จะเปิดตัวเวฟภายในสิ้นปีนี้

แก้ไข วันพฤหัสที่ 1 ตค 13:30:
ได้ Account Wave Preview มาแล้ว เขามีให้เชิญคนอื่นต่ออีก 8 คน ก็ดีเหมือนกันจะได้ชวนเพื่อนๆมาเล่นกัน ความแตกต่างจาก Sandbox คืออินเตอร์เฟสดูสมบรูณ์มากขึ้น บักน้อยลง ลื่นขึ้น แล้วที่สำคัญคือเมนูดีบักหายไปแล้ว!!

Read more

จาก php ถึง ruby on rails

จากคนเคยหากินกับ php มาเนิ่นนานจนจำไม่ได้แล้วว่าเริ่มเมื่อไหร่ แต่ด้วยความอยากรู้อยากเห็นเลยตั้งโจทย์กับตัวเองไว้ว่าโปรเจคส่วนตัวชิ้นต่อไปจะใช้ภาษาอื่นที่ไม่ใช่ php ซะบ้าง ก็เริ่มมองหาหลายๆตัวเลือก โดยพิจารณาจริงจังที่ python, ruby on rails และ java แล้วก็ลองศึกษาดูว่ามันยังไงกันบ้างนะ ลองอ่านลองเขียนอยู่นานสุดท้ายก็มาลงเอยที่ ruby on rails ด้วยเหตุผลหลายๆอย่างที่พอมาคิดๆดูก็ไม่ค่อยมีเหตุผลเท่าไหร่ แต่เอาหล่ะ rails ก็ rails

Read more

google wave: first contact

google wave logoหลายๆคนคงเคยเห็นวีดีโอสาธิตการใช้งาน google wave จากงาน google i/o มาแล้ว ดูแล้วก็เป็นรูปแบบของการสื่อสารที่เจ๋งไม่ใช่เล่น เพราะสามารถเห็นข้อความที่พิมพ์คุยกันได้แบบ real time ไม่ต้องนั่งมอง “He is typing…” “She is typing…” อีกต่อไป อีกทั้งยังสามารถเพิ่ม “ของเล่น” ลงไปในข้อความสนทนาได้อีกด้วย เช่น เกมส์ poll ฯลฯ และไม่นานมากนี้ก็ได้ลองเล่นจริงๆซักทีหลังจากได้รับ wavesandbox account มาจาก google

Read more

php oop #2: สร้างและห่อหมีแพนด้า

จากโพสที่แล้ว php oop #1: panda class ว่าด้วยเรื่องการเขียน php oop แบบง่ายๆ แต่ดูไม่มีประโยชน์เท่าไหร่นัก เพราะถ้าดูดีๆมันก็ไม่ต่างจากเขียนฟังก์ชั่นเท่าไหร่ เลยมาว่าต่อถึงคุณสมบัติจริงๆของ object oriented บ้าง

เริ่มต้นจากอย่างแรกก่อน คือคอนเซปต์การ encapsulation หรือขอเรียกง่ายๆว่า การห่อ ซึ่งก็เป็นเหมือนการซ่อนข้อมูลภายในคลาสไว้ไม่ให้สามารถเข้าถึงได้โดยตรงจากส่วนอื่นๆของโปรแกรม ลองดูโค้ทกันเลยน่าจะง่ายกว่านั่งอธิบายให้ยืดยาว

class Panda{
   private $name;
   function eat(){
       echo "eating bamboo leaf";
   }
}

ก็เล่นกันง่ายๆเลย คือเปลี่ยนตัวแปร name ให้เป็น private ซะ คราวนี้การเรียกถึงตัวแปรแบบตรงๆอย่างที่เห็นในตัวอย่างที่แล้วก็จะไม่สามารถทำได้อีกต่อไป แต่เมื่อต้องการเรียกใช้เราก็อาจจะเพิ่ม method เข้าไป เช่น

function setName($pname){
   $this->name=$pname;
}
function getName(){
   return $this->name;
}

โดย method setName จะรับค่า name มาใน parameter ด้วย ส่วน getName จะไม่ทำอะไรนอกจาก return ค่าในตัวแปร name แล้วเวลาเรียกใช้ก็จะใช้วิธีเรียกหา method เช่น

$p1 = new Panda();
$p1->setName("Lin Hui");
echo $p1->getName();

จะเห็นว่า ถ้าเราไม่เขียน method get,set ขึ้นมาซะอย่าง ใครๆก็ไม่สามารถเข้าถึงข้อมูลภายในคลาสของเราได้ ซึ่งในแง่ของความปลอดภัยแล้ว การทำ encapsulation ถือว่ามีประโยชน์มากเลยทีเดียว
Read more

จากตาราง เปลี่ยนเป็น Div

วิธีง่ายๆที่จะเปลี่ยนจากการเขียน html layout โดยใช้ตารางมาเป็น css/div layout สำหรับคนที่กำลังลังเลที่จะใช้ css แทนตารางแบบเดิมๆ

ก่อนอื่นดูตารางก่อน

Table Layout

โค้ทของตาราง

This is Header
Main Menu -Menu1 Content goes here! This is content!

ดูแล้วก็ง่ายๆ ตามสไตล์ที่คุ้นเคย แต่ดูแล้วยุ่งยากใจพิลึก ทีนี้เราจะจับเจ้า layout ที่คุ้นเคยนี้แหละมาเขียนเป็น css
Read more

php oop #1: panda class

ว่ากันเรื่องการเขียนโปรแกรม php แบบ oop หรือ object oriented programming นั่นเอง

ก่อนจะไปว่ากันเรื่อง php ก็ต้องอธิบาย oop กันก่อน สำหรับคนที่คุ้นๆกันอยู่แล้วก็ข้ามไปได้เลย

เอาง่ายๆแบบไม่ยืดยาว oop คือการเขียนโปรแกรมที่ให้ความสำคัญกับ “วัตถุ” คุณสมบัติ และความสัมพันธ์ของมัน โดยมีศัพท์ที่ต้องรู้จัก ดังนี้

  1. Class(ชนิดของวัตถุ) เป็นเหมือนเทมเพลท เพื่อบอกว่าวัตถุชนิดนี้จะมีคุณสมบัติใดบ้าง โดยคุณสมบัติประกอบด้วย 2 อย่าง คือ สถานะ(state) และ พฤติกรรม(behavior)

    คลาส หมีแพนด้า มีสถานะคือ ชื่อหมี และมีพฤติกรรมคือ กินไผ่

  2. Object(วัตถุ) สร้างขึ้นมาจากคลาส โดยเมื่อเป็นวัตถุแล้ว state จะกลายเป็น instance variable(ตัวแปรนั่นแหละ) และ behavior จะถูกเรียกว่า method

    วัตถุ หมีแพนด้า ที่มีชื่อ หลินฮุ่ย สามารถ กินไผ่ ได้

นั่นคือ ถ้าพูดว่า “หมีแพนด้า” ขึ้นมาลอยๆโดยไม่ระบุวัตถุว่าเป็นแพนด้าตัวไหน มันก็จะไม่มีชื่อ และกินไผ่ไม่ได้ งงไหม? ถ้างงก็ลงไปดูโค้ท php กันเลย มันง่ายกว่า จริงๆ
Read more

ie6.png !

ไฟล์ .png กับการทำเว็บสมัยนี้เป็นของคู่กัน ซึ่งคนที่รู้จักกับมันแล้วจะลืม .gif ไปเลย หลักๆคือความสามารถในการทำให้ส่วนใดๆของภาพโปร่งแสง(transparent) และพื้นหลังใสได้อย่างสนิทใจ

แต่ปัญหามันก็เกิดกับบราวเซอร์ที่รักเจ้าเก่าของเรา ไม่ใช่ใครที่ไหน ie6 นั่นเอง สำหรับคนทำเว็บแล้วก็อยากจะลืมๆเจ้าบราวเซอร์นี้มันไปซะ แต่พอเหลือบมาดูสถิติ browser ที่ใช้กันในบ้านเราแล้วก็ไม่สามารถจริงๆ (Truehits.net::2008-11 IE6 51.1%) ดังนั้นก็ต้องมาตามแก้กันไป

วิธีทำให้ไฟล์ png แสดงผลได้อย่างปกติสุขใน ie6 นั้นมีหลายวิธีแล้วแต่ความถนัด สำหรับวิธีที่จะพูดถึงนี้ส่วนตัวแล้วชอบเพราะว่าไม่ต้องดัดแปลงโค้ทมากนัก ก่อนอื่นก็มาดูการแสดงผลไฟล์ png ของ ie6 เทียบกับ ie7 กันก่อน

Original PNG File

IE7

IE6 !!!

จะเห็นว่าใน ie6 นั้นส่วนพื้นหลังมันไม่ใสจริง แต่มีพื้นที่สีเทาๆมาทับ background(รูปไม้บรรทัด) ด้านข้างหมด คราวนี้มาดูวิธีแก้กัน

Read more

เว็บไซต์…ไม่ใส่ตาราง

มันเริ่มจากการอ่านเว็บไปเรื่อยๆและเจอกระแส tableless html layout มานาน แต่ก็บอกตัวเองว่าไม่มีเวลาสักทีที่จะเปลี่ยนสไตล์การเขียนเว็บของตัวเองจาก “old school html” ที่เน้นใช้ตารางในการจัดหน้า html มาเป็น css based layout ที่ใช้ div และ css เป็นหลัก บอกว่าไม่มีเวลาจริงๆแล้วก็เป็นข้ออ้างนั่นแหละ เพราะการเปลี่ยนจากสิ่งที่คุ้นเคยมาใช้อะไรใหม่ๆมันต้องเรียนรู้อะไรมากมาย ทำให้ไม่อยากจะเปลี่ยนแปลงอะไรในบางจังหวะของชีวิตที่ยึดเอาความขี้เกียจเป็นที่ตั้ง จนกระทั่งได้จังหวะก็เริ่มมาศึกษาจริงๆจัง กว่าจะเขียนได้คล่องก็ไม่ง่ายแต่ก็ไม่ได้ยากมากมายอย่างที่คิดไว้

Read more