[B4A] การสร้างหน้าจอบนมือถือได้มากกว่า 1 หน้าจอ โดยสามารถส่งค่าบางอย่างไปได้
http://www.g2gnet.com/webboard/images/b4a/TwoActivities.pngแอดมินขออธิบายให้เข้าใจง่ายๆสำหรับ Activity ที่อยู่บน B4A หรือ Basic for Android เปรียบได้เหมือนกับเป็นฟอร์ม 1 ฟอร์ม โดยสามารถวาง Control ต่างๆ ได้ 2 แบบ คือการใช้ Designer และการสร้างแบบ Run Time หรือการเขียนด้วยโค้ดเพื่อสร้าง Control ขึ้นมา โดยฟอร์มหลักเราจะเรียกชื่อว่า Main ส่วนฟอร์มอื่นๆก็จะเป็น Activity ซึ่งก็ขึ้นอยู่กับที่เราจะตั้งชื่อเอาเอง ก็เหมือนๆกับฟอร์มใน Visual Basic นั่นเอง ... สำหรับบทความชุดนี้แอดมินจะใช้ Designer เพื่อให้ทุกๆท่านๆได้เข้าใจไม่ยากล่ะกัน ...
เริ่มต้นในการสร้าง Designer ... จาก IDE ให้เลือก Designer
http://www.g2gnet.com/webboard/images/b4a/ActivityNew.png
การบันทึก Designer ...
http://www.g2gnet.com/webboard/images/b4a/ActivitySave.png
การ AddView โดยเลือก ListView ให้ขึ้นมาแสดงผลใน Designer ในแบบเต็มหน้าจอ มีลูกศรซ้ายขวา บนล่าง เหมือนกับ Anchor เพื่อขยายระยะไปตามความกว้าง ยาวของจอมือถือ ...
http://www.g2gnet.com/webboard/images/b4a/ActivityAddListView.png
การประกาศตัวแปร Control โดยที่จากส่วนของการเขียนโค้ด หรือ IDE เราจะต้องเลือก Activity ที่ต้องการเอาไว้ก่อน แล้วคลิ๊กเมาส์ขวาตัว Control ทำการ Generate ตัวแปรขึ้นมาตามภาพ ชื่อตัวแปรก็จะไปปรากฏยัง Activity ตามที่เรากำหนด ...
กรณีที่ Control แบบคงที่ ไม่มีการเปลี่ยนแปลงค่าใดๆ หรือไม่จำเป็นต้องเรียกใช้งาน เช่น ป้ายบอก หรือ Label ก็ไม่ต้องทำการประกาศตัวแปรก็ได้ ...
http://www.g2gnet.com/webboard/images/b4a/ActivityDeclare.png
ส่วนที่ต้องทำการเรียกใช้งาน Designer ...
Sub Activity_Create(FirstTime As Boolean)
'Do not forget to load the layout file created with the visual designer. For example:
Activity.LoadLayout("main")
Activity.Title="Main Layout"
End Sub
Designer ในส่วนของอีก Activity ... (layout1)
http://www.g2gnet.com/webboard/images/b4a/ActivityLayout.png
Layout1 จะเป็นการกำหนดไฟล์รูปภาพไปยัง ImageView เพื่อจะทำเป็นปุ่มให้ถอยหลังกลับไป Main Activity ...
http://www.g2gnet.com/webboard/images/b4a/ActivityImageView.png
โดยจะใช้โค้ดใน Activity1 ดังนี้ ... กลับไปยัง Activity Main และจบการทำงานของตัวมันเอง
Sub ImageView1_Click
StartActivity(Main)
Activity.Finish
End Sub
การสร้าง Activity ขึ้นมาใหม่ ...
http://www.g2gnet.com/webboard/images/b4a/ActivityNewModule.png
กลับมาที่ Activity หลัก ก็คือ Main ...
http://www.g2gnet.com/webboard/images/b4a/ActivityMain.png
เมื่อสร้างรายการข้อมูลตัวอย่างให้กับ ListView1 (Main) ...
Sub Activity_Create(FirstTime As Boolean)
For i = 1 To 100
ListView1.AddSingleLine("Item #" & i)
Next
End Sub
เหตุการณ์ในการคลิ๊กแต่ละแถวรายการใน ListView1 (Main) ... ก็จะเรียกไปยัง CallSubDelay2("ชื่อ Activity", "โปรแกรมย่อยในการรับค่า", "ค่าที่ส่งไป") ...
Sub ListView1_ItemClick (Position As Int, Value As Object)
'// This call will bring Main to front and call GetResult.
CallSubDelayed2(Activity1, "GetResult", Value)
End Sub
โปรแกรมย่อยในการรับค่าใน Activity ...
Sub GetResult(Result As String)
Label1.Text = "You choose: " & Result
End Sub
ทำการรันโปรแกรม ...
ก่อนจะทำการสั่งรันโปรแกรม ต้องทำการ Restart ADB Server เพื่อทำการติดต่อกับ Emulator ... ในที่นี้แอดมินใช้ BlueStacks ...
http://www.g2gnet.com/webboard/images/b4a/ActivityRestartADB.png
ทดสอบการ Connect กับ Emulator ...
http://www.g2gnet.com/webboard/images/b4a/ActivityConnect.png
หากเรามีการเปลี่ยนแปลงแก้ไขโค้ด ก่อนที่จะทำการรันโปรแกรม ต้อง Clean Project ก่อน เพื่อทำการ Compile ใหม่อีกครั้ง ...
http://www.g2gnet.com/webboard/images/b4a/ActivityClean.png
การสั่ง Run ใน Debug Mode ...
http://www.g2gnet.com/webboard/images/b4a/ActivityRun.png
เมื่อ Main Activity ทำงาน ...
http://www.g2gnet.com/webboard/images/b4a/ActivityMainRun.png
เมื่อลองทดสอบคลิ๊กแถวรายการที่ 6 มันก็จะเข้าไปทำงานยัง Activity1 ...
http://www.g2gnet.com/webboard/images/b4a/Activity1Run.png
มาดูโค้ดในส่วนของ Main ...
#RegionProject Attributes
#ApplicationLabel: Two Activities
#VersionCode: 1
#VersionName:
'SupportedOrientations possible values: unspecified, landscape or portrait.
#SupportedOrientations: unspecified
#CanInstallToExternalStorage: False
#End Region
#RegionActivity Attributes
#FullScreen: False
#IncludeTitle: True
#End Region
Sub Process_Globals
'These global variables will be declared once when the application starts.
'These variables can be accessed from all modules.
End Sub
Sub Globals
'These global variables will be redeclared each time the activity is created.
'These variables can only be accessed from this module.
Private Kanit As CustomFonts
Private ListView1 As ListView
End Sub
'// https://www.b4x.com/android/help/views.html
Sub Activity_Create(FirstTime As Boolean)
'Do not forget to load the layout file created with the visual designer. For example:
Activity.LoadLayout("main")
Activity.Title="Main Layout"
'// Set Own Font.
Kanit.Initialize("Kanit-Regular.ttf")
Kanit.SetCustomFontsToAllViews(Activity)
For i = 1 To 100
ListView1.AddSingleLine("Item #" & i)
Next
End Sub
Sub ListView1_ItemClick (Position As Int, Value As Object)
'// This call will bring Main to front and call GetResult.
CallSubDelayed2(Activity1, "GetResult", Value)
End Sub
Sub Activity_Resume
End Sub
Sub Activity_Pause (UserClosed As Boolean)
End Sub
มาดูโค้ดในส่วนของ Activity1 ...
#RegionActivity Attributes
#FullScreen: False
#IncludeTitle: True
#End Region
Sub Process_Globals
'These global variables will be declared once when the application starts.
'These variables can be accessed from all modules.
End Sub
Sub Globals
'These global variables will be redeclared each time the activity is created.
'These variables can only be accessed from this module.
Private Panel1 As Panel
Private Label1 As Label
Private Label2 As Label
Private ImageView1 As ImageView
End Sub
Sub Activity_Create(FirstTime As Boolean)
'Do not forget to load the layout file created with the visual designer. For example:
Activity.LoadLayout("layout1")
Dim MyFont As Typeface
MyFont = Typeface.LoadFromAssets("Kanit-Regular.ttf")
Label1.Typeface=MyFont
Label2.Typeface=MyFont
Label1.Text="You Choose : " & GetResult("")
End Sub
Sub GetResult(Result As String)
Label1.Text = "You choose: " & Result
End Sub
Sub ImageView1_Click
StartActivity(Main)
Activity.Finish
End Sub
Sub Activity_Resume
End Sub
Sub Activity_Pause (UserClosed As Boolean)
End Sub
ดาวน์โหลดโค้ดต้นฉบับ B4A ได้จากที่นี่ ....
หน้า:
[1]