Web View

ในบทความนี้เราจะกล่าวถึง  Web View นะครับ Web View คืออะไร  มันก็คือ View ที่เอาไว้เปิดแสดง Web หรือ Content ที่เป็น HTML นั่นเองครับ

ในส่วนการใช้งานนั้นก็ไม่ใช่เรื่องยากครับสร้าง WebView ขึ้นมาด้วยคำสั่ง
var aWebView = Ti.UI.createWebView({ html : '<h1>Hello Web View</h1>' });
จากนั้นเอาไปใส่ใน  window แล้วก็เปิดครับ ก็จะได้ดังภาพ

ด้านบนจะเป็นการแสดงข้อมูลใน Format  HTML  tag ต่าง ๆ ได้ตามที่เราต้องการ ตามมาตรฐานของ HTML  TAG นั่นเอง ส่วนในกรณีที่เราต้องการให้ Web View นั้น ๆ ไปเปิด Web Site ที่เราต้องการ ก็สามารถทำได้โดย คำสั่งนี้ครับ
var aWebView = Ti.UI.createWebView({ url : 'http://mobidevthai.wordpress.com' }); จากนั้นเอาไปใส่ใน  window แล้วก็เปิดครับ ก็จะได้ดังภาพ

สำหรับผู้พัฒนาบน Android นั้นเนื่องจาก Android รองรับการทำงาน ของ Flash ดังนั้นหากต้องการให้ Web View นี้สามารถเล่น Flash ได้ต้องใส่ Property บางอย่างเพิ่มเติมครับ นั่นก็คือ pluginState โดย  Property สามารถกำหนดค่าได้ดังนี้
  • Titanium.UI.Android.WEBVIEW_PLUGINS_OFF  (Default Value)
  • Titanium.UI.Android.WEBVIEW_PLUGINS_ON
  • Titanium.UI.Android.WEBVIEW_PLUGINS_ON_DEMAND

แบบนี้ครับ ก็จะสามารถเล่น Flash บน WebView ได้แล้วครับ
var aWebView = Ti.UI.createWebView({ url : 'http://mobidevthai.wordpress.com', pluginState : Ti.UI.Android.WEBVIEW_PLUGINS_ON }); กรณีต้องการใช้ hardware acceleration ต้องไปกำหนดค่าใน tiapp.xml ให้ใช้  hardware acceleration เพิ่มเติม
<android xmlns:android="http://schemas.android.com/apk/res/android">
  <tool-api-level>11</tool-api-level>
    <manifest>
      <application android:hardwareAccelerated="true"/>
    </manifest>
</android>
****  สำหรับการเปิด Flash ผมแนะนำให้ไปลองรันบน Device  นะครับ 
เป็นอย่างไรกันบ้างครับ กับ WebView จะเห็นได้ว่าการพัฒนา บน Titanium Studio นี้ทำได้ไม่ยากเลย และการเขียน  Code เพียง 1 ชุดก็สามารถรันได้ทั้ง บน  Android และ  iOS ได้ โดยอาจจะต้องมีการปรับเปลี่ยนแต่ก็เพียงเล็กน่้อยเท่านั้น เอาหล่ะครับ ขอจบบทความนี้ตรงนี้ก่อน เดี๋ยวบทความหน้า ผมจะแนะนำวิธีการนำเอา Code ที่เราเขียนกันนี้ไปรันบน เครื่องจริง ๆ กันนะครับ

2 ความคิดเห็น:

  1. ผมลองใช้แบบนี้ครับ var aWebView = Ti.UI.createWebView({ html : 'Hello Web View' });
    แต่มีปัญหากับภาษาไทยครับ ตัวข้อมูลผมเป็น encoding utf-8 ครับ
    เราสามารถกำหนด encoding ได้ไหมครัล

    ตอบลบ
  2. ในเรื่องของ Charset อันนี้หากตัวเครื่องหรือ Emulator รองรับภาษาไทยไม่น่าจะเกิด ปัญหาลักษณะนี้นะครับ เดี๋ยวผมตรวจสอบให้ก่อนนะครับ ว่า มีวิธีแก้ไขอย่างไรได้บ้าง เบื้องต้น แนะนำว่า อาจจะต้องเขียนเป็น Meta Tag บน HTML Code ลักษณะนี้ก่อนครับ meta charset="utf-8"

    ตอบลบ