iPhone: Display a loading icon while a network resource is being downloaded


Display a loading icon while a network resource is being downloaded

http://stackoverflow.com/questions/212215/display-a-loading-icon-while-a-network-resource-is-being-downloaded

สำหรับการโหลดข้อมูลเยอะๆ เราต้องมี user interface เพื่อบอกผู้ใช้ว่า “ขณะนี้คุณต้องรอก่อนนะ” และ UI ตัวนั้นชื่อว่า UIActivityIndicator เรามาลองทำดูนะครับว่ามันใช้ยังไง

กดที่ภาพเพื่อลิ้งไปยังรูปภาพ Capture ของเว็บนี้

http://stackoverflow.com/questions/212215/display-a-loading-icon-while-a-network-resource-is-being-downloaded

Tip

  1. หากกดที่ Hide Animating when stop ให้ซ่อนมันไว้ก่อนโดยกด Hidden
  2. การเช็คการ animation ใช้ฟังก์ชั่น isAnimating
  3. ในไฟล์ .xib ให้ลากเอาตัว indicator ไว้ด้านล่างสุด
  4. การใช้ UIActivityIndicator ก็มีทั้งแบบสร้างเอาเลยกับแบบลากใส่ .xib ชอบแบบไหนเลือกเอาเลย
  5. indicator ถึงจะโชว์ขึ้นมา แต่ผู้ใช้ยังกดปุ่มและช่องกรอกต่างๆ ได้อยู่ ดังนั้นเราต้องสร้าง View มาบังเอาไว้ ด้วย ค่า alpha โปร่งหน่อยและอยู่ก่อน indicator ของเราด้วย เท่านี้ผู้ใช้ก้อจะกดปุ่มอะไรไม่ได้แล้ว และอย่าลืมซ้อนมันด้วยหาก indicator หยุดทำงานแล้ว
  6. อาจจะต้องเขียนโค้ดให้ View ที่เป็นเงาและ indicator ขึ้นมาอยู่ด้านหน้าด้วยโค้ด

[self.view bringSubviewToFront:indicatorShadow];
[self.view bringSubviewToFront:indicator];

     

Other Reference

http://chris-software.com/index.php/2009/05/08/creating-programmatically-a-spinner-uiactivityindicator/

adaydesign :)

About adaydesign

นักพัฒนาแอพพลิเคชั่นบนโมบาย [iPhone Android] คนหนึ่งซึ่งอยากจะบันทึกเรื่องราวของเส้นทางนักพัฒนาโมบายแอพพลิเคชั่นเอาไว้ในบล็อคน้อยๆ แห่งนี้ เผื่อจะแบ่งบันและแลกเปลี่ยนความรู้ให้กับคนอื่นๆ ได้บ้าง :) Mobile Application Developer; Flash Mobile, iPhone/iPad, Android Mobile Phone/Tablet and Blackberry Playbook.

Posted on กุมภาพันธ์ 19, 2011, in [Dev] iOS, [Link] iOS and tagged , , , . Bookmark the permalink. 1 ความเห็น.

ใส่ความเห็น

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / เปลี่ยนแปลง )

Twitter picture

You are commenting using your Twitter account. Log Out / เปลี่ยนแปลง )

Facebook photo

You are commenting using your Facebook account. Log Out / เปลี่ยนแปลง )

Google+ photo

You are commenting using your Google+ account. Log Out / เปลี่ยนแปลง )

Connecting to %s

%d bloggers like this: