loading...
Register Register Member Login Member Login Member Login Forgot Password ??
PHP , ASP , ASP.NET, VB.NET, C#, Java , jQuery , Android , iOS , Windows Phone
   
 

Registered : 102,428




HOME > Mobile > Android Tutorials - สอนเขียน Android App ฟรี เขียนโปรแกรมแอนดรอยด์บน SmartPhone / Tablets > ตอนที่ 8 : Xamarin กับ Android การใช้ SetContentView() ควบคุมการแสดง XML Layout (C#)

ตอนที่ 8 : Xamarin กับ Android การใช้ SetContentView() ควบคุมการแสดง XML Layout (C#)

 
 


Bookmark.   
Share
       
ตอนที่ 8 : Xamarin กับ Android การใช้ SetContentView() ควบคุมการแสดง XML Layout (C#) ในการสร้าง Activity ทั่ว ๆ ไปบน Android App เราจะใช้ไฟล์ Activity ที่เป็น C# กับ XML ที่เป็น Layout ทำงานคู่กัน ซึ่งจะใช้ SetContentView(Resource.Layout.Main); เป็นตัวชี้ว่าจะใช้ Layout ตัวไหน แต่ก็มีเทคนิคการเปลี่ยน Layout ในขณะที่โปรแกรมทำงาน Runtime ได้ การใช้ SetContentView() ทำงานเป็นแบบ Dynamic ดึง XML layout มาแสดงผล ภายใต้ Activity เดิม ซึ่งผลลัพธ์ที่ได้ก็จะเป็นการเปลี่ยนไปยังหน้าต่าง ๆ ได้เหมือนกับการสร้างหลาย ๆ Activity

Xamarin Android C# setContentView

Xamarin Android (C#) and SetContentView()


จากรูปจะเห็นว่า C# Class ที่เป็น Activity มีอยู่แต่ตัวเดียว แต่จะสามารถเรียก XML layout ได้จาก layout ต่าง ๆ โดยจะสามารถเลือก SetContentView() ได้ครั้งล่ะ Layout

เทคนิคนี้เป็นทางเลือกในอันดับต้น ๆ ที่ใช้ในการเขียนโปรแกรมบน Android เหตุผลเพราะสามารถเขียนไฟล์ที่เป็น C# ที่อยู่ใน Class เดียวกับ แต่จะสามารถเรียกใช้ XML Layout ได้หลายตัว โดยไม่ต้องสร้าง Activity เพิ่มขึ้นมา แต่การใช้งาน SetContentView() คือข้อจำกัดในการแสดงผล Layout นั้น จะสามารถแสดงผลได้ครั้งล่ะ Layout เท่านั้น โดยถ้ามีการเรียก SetContentView() แบบซ้ำซ้อน ใน C# Activity จะเลือกแสดงผล Layout ที่ถูกเรียกใช้ล่าสุด

ลองมาดูตัวอย่างเพื่อความเข้าใจมากขึ้น

Xamarin Android C# setContentView

ตอนนี้เรามี C# Activity อยู่ 1 ตัวชื่อว่า MainActivity.cs เป็น Activity ที่จะทำงานแรกสุดและเรียก Layout ของ SetContentView(Resource.Layout.Main); มาแสดงผล

Xamarin Android C# setContentView

ปัจจุบันค่า Default ของ Activity คือ SetContentView(Resource.Layout.Main); ซึ่งจะทำงานแบบนี้ทุกครั้งเมื่อรันโปรแกรม

Xamarin Android C# setContentView

เราจะสร้าง Layout ขึ้นมาใหม่ ให้คลิกวาที่ layout -> Add -> New Item...

Xamarin Android C# setContentView

เลือก Android Layut และตั้งชื่อเป็น Main2.axml

Xamarin Android C# setContentView

ได้ไฟล์ XML Layout ขึ้นมาใหม่ชื่อว่า Main2.axml

Xamarin Android C# setContentView

ให้สร้างแบบเดียวกันตั้งชื่อว่า Main3.axml

และหลังจากที่ได้ไฟล์ Layout ขึ้นมา 3 ตัวแล้ว เราจะใช้ Activity ของ MainActivity.cs ควบคุมการแสดงผลของ Layout ทั้ง 3 ตัว

Xamarin Android C# setContentView

ใน Layout แรกให้ออกแบบหน้าจอดังนี้

Main.axml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">
    <TextView
        android:text="Layout 1"
        android:textAppearance="?android:attr/textAppearanceLarge"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/textView1"
        android:gravity="center" />
    <Button
        android:text="Go to Layout 2"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/btn1" />
</LinearLayout>


Xamarin Android C# setContentView

ใน Layout สองให้ออกแบบหน้าจอดังนี้

Main2.axml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:minWidth="25px"
    android:minHeight="25px">
    <TextView
        android:text="Layout 2"
        android:textAppearance="?android:attr/textAppearanceLarge"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/textView2"
        android:gravity="center" />
    <Button
        android:text="Go to Layout 3"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/btn2" />
</LinearLayout>


Xamarin Android C# setContentView

ใน Layout สามให้ออกแบบหน้าจอดังนี้

Main3.axml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:minWidth="25px"
    android:minHeight="25px">
    <TextView
        android:text="Layout 3"
        android:textAppearance="?android:attr/textAppearanceLarge"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/textView3"
        android:gravity="center" />
    <Button
        android:text="Go to Layout 1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/btn3" />
</LinearLayout>


จากนั้นในไฟล์ MainActivity.cs ให้เขียนคำสั่งเพื่อควบคุมการแสดงผลของ layout ดังนี้

MainActivity.cs
using System;
using Android.App;
using Android.Content;
using Android.Runtime;
using Android.Views;
using Android.Widget;
using Android.OS;

namespace myFirstApps
{
    [Activity(Label = "myFirstApps", MainLauncher = true, Icon = "@drawable/icon")]
    public class MainActivity : Activity
    {

        protected override void OnCreate(Bundle bundle)
        {
            base.OnCreate(bundle);

            // Set our view from the "main" layout resource
            ShowLayout1();

        }

        // Layout 1 (Main.axml)
        private void ShowLayout1()
        {
            SetContentView(Resource.Layout.Main);
            Button btn1 = FindViewById<Button>(Resource.Id.btn1);
            btn1.Click += delegate
            {
                ShowLayout2();
            };
        }

        // Layout 2 (Main2.axml)
        private void ShowLayout2()
        {
            SetContentView(Resource.Layout.Main2);
            Button btn2 = FindViewById<Button>(Resource.Id.btn2);
            btn2.Click += delegate
            {
                ShowLayout3();
            };
        }

        // Layout 3 (Main3.axml)
        private void ShowLayout3()
        {
            SetContentView(Resource.Layout.Main3);
            Button btn3 = FindViewById<Button>(Resource.Id.btn3);
            btn3.Click += delegate
            {
                ShowLayout1();
            };
        }

    }
}

ทดสอบการทำงาน

Xamarin Android C# setContentView

แสดง Layout แรก ให้คลิก Button เพื่อเรียก Layout ที่สองมาแสดง

Xamarin Android C# setContentView

แสดง Layout สอง ให้คลิก Button เพื่อเรียก Layout ที่สามมาแสดง

Xamarin Android C# setContentView

แสดง Layout สาม สามารถคลิกเพื่อกลับไป layout แรก

   
Share




ช่วยกันสนับสนุนรักษาเว็บไซต์ความรู้แห่งนี้ไว้ด้วยการสนับสนุน Source Code 2.0 ของทีมงานไทยครีเอท

ลองใช้ค้นหาข้อมูล


   
  By : ThaiCreate.Com Team (บทความเป็นลิขสิทธิ์ของเว็บไทยครีเอทห้ามนำเผยแพร่ ณ เว็บไซต์อื่น ๆ)
  Score Rating :  
  Create/Update Date : 2014-09-15 12:38:00 / 2014-09-17 11:51:17
  Download : No files
Sponsored Links
 
 Sponsored Links / Related
 
ตอนที่ 1 : รู้จัก Xamarin ติดตั้ง Xamarin เขียน Android Apps ด้วย C# (.Net Framework)
Rating :
 
ตอนที่ 2 : รู้จัก Xamarin Studio IDE การเขียน Android บน Xamarin ด้วยภาษา C#
Rating :
 
ตอนที่ 3 : พื้นฐาน Xamarin บน Visual Studio และการสร้าง Project ของ Android ด้วย C#
Rating :
 
ตอนที่ 4 : ติดตั้ง Xamarin บน Mac (OS X) และการเขียน Android บนเครื่อง Mac ด้วย C#
Rating :
 
ตอนที่ 5 : Xamarin กับ Android โครงสร้างไฟล์ Project และ Controls / Widgets (C#)
Rating :
 
ตอนที่ 6 : Xamarin กับ Android สร้าง Event Handler โต้ตอบแบบง่าย ๆ (C#)
Rating :
 
ตอนที่ 7 : Xamarin กับ Android สร้าง Activity เชื่อมโยง Intent ส่งค่า Pass ตัวแปรระหว่าง Activity(C#)
Rating :
 
ตอนที่ 9 : Xamarin กับ Android การสร้าง Dialog Popup และ Alert Dialog / Toast Make Text (C#)
Rating :
 
ตอนที่ 10 : Xamarin กับ Android การ Generate/Deploy เป็น APK Package นำไปใช้งานจริง (C#)
Rating :



Comunity Forum Free Web Script
Jobs Freelance Free Uploads
Free Web Hosting Free Tools

สอน PHP ผ่าน Youtube ฟรี
สอน Android การเขียนโปรแกรม Android
สอน Windows Phone การเขียนโปรแกรม Windows Phone 7 และ 8
สอน iOS การเขียนโปรแกรม iPhone, iPad
สอน Java การเขียนโปรแกรม ภาษา Java
สอน Java GUI การเขียนโปรแกรม ภาษา Java GUI
สอน JSP การเขียนโปรแกรม ภาษา Java
สอน Struts การเขียนโปรแกรม Java Struts Framework
สอน jQuery การเขียนโปรแกรม ภาษา jQuery
สอน Yii  Framework การเขียนโปรแกรม ภาษา PHP กับ Yii
สอน .Net การเขียนโปรแกรม ภาษา .Net

Free Tutorial
สอน Entity Framework
สอน Android
สอน Java เขียน Java
Java GUI Swing
สอน JSP (Web App)
iOS (iPhone,iPad)
Windows Phone
Windows Azure
Windows Store
Laravel Framework
Yii PHP Framework
สอน jQuery
สอน jQuery กับ Ajax
สอน PHP OOP (Vdo)
Ajax Tutorials
SQL Tutorials
สอน SQL (Part 2)
JavaScript Tutorial
Javascript Tips
Microsoft Access
MySQL Tutorials
-- Stored Procedure
MariaDB Database
SQL Server Tutorial
SQL Server 2005
SQL Server 2008
SQL Server 2012
-- Stored Procedure
Oracle Database
-- Stored Procedure
SVN (Subversion)
แนวทางการทำ SEO
ปรับแต่งเว็บให้โหลดเร็ว

สุดยอด Source Code V2.0
 

แจ้งชำระเงิน/โอนเงิน
 

Hit Link
   




Acc : thaicreate@hotmail.com






Load balance : Server 02
ThaiCreate.Com Logo
© www.ThaiCreate.Com. 2003-2015 All Rights Reserved.
for Contact Us : [Conditions Privacy Statement] ติดต่อโฆษณา 081-987-6107 , 084-715-5121 อัตราราคา คลิกที่นี่

Back to Top