iPhone: Make Overlay Round UILabel


Make Overlay Round UILabel

มาทำภาพพื้นหลังด้วย Round UILabel กันเถอะ มันไม่ได้ยากอย่างที่คิด ไม่ต้องใช้รูปด้วย

ขั้นตอน

1. สร้าง UILabel เปล่าขึ้นมาก

UILabel *overlayLabel = [[UILabel alloc] init];

2. เซ็ตตำแหน่งและขนาดของมันซะ (ผมเซ็ตตามขนาดของ View อีกวิวหนึ่งชื่อว่า parentView ให้ Label ของเราอยู่ตำแหน่งด้านในของ parentView)

overlayLabel.frame = CGRectInset(parentView.frame, (CGFloat)2, (CGFloat)2);

3. เซ็ตสีแบคกราว ให้มี  alpha

[overlayLabel setBackgroundColor:[UIColor colorWithRed:(CGFloat)0.4 green:(CGFloat)0.4 blue:(CGFloat)0.8 alpha:(CGFloat)0.5]];

4. เซ็ตขอบมนๆๆ ด้วย property ที่ชื่อว่า layer.cornerRadius แต่ property นี้จะอยู่ใน iPhone SDK 3.0 ขึ้นไปนะครับ เพิ่ม framework เข้ามาชื่อว่า QuartzCore.framework แล้วก้อ #import <QuartzCore/QuartzCore.h>

overlayLabel.layer.cornerRadius = 10;
[self.view addSubview:overlayLabel];

เพิ่มเติม

UIView ทุกคลาสนั้นสามารถใช้ property layer ได้หมดนะครับ แต่ต้องเป็น SDK 3.0 ขึ้นไป และต้องเพิ่มเฟรมเวิร์ค QuartzCore ด้วยนะ

Reference

adaydesign :)

About adaydesign

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

Posted on มีนาคม 20, 2011, in [Dev] iOS, [Link] iOS and tagged , , , , , , , , . Bookmark the permalink. 1 ความเห็น.

  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: