Just My Life & My Work

[iOS] 視圖圓角

2013 年 01 月 17 日

四角的影像讓我覺得不友善，於是讓尖角變成圓角，感覺起來就舒服多了～如下這用UIImageView製作的HouseBook四個九十度角變成圓角囉！

housebook uiimageview round corner

在寫程式前的兩個步驟：

  1. add QuartzCore.framework
  2. import <QuartzCore/QuartzCore.h>

接下來就是設定自己喜歡的參數程度。

    self.albumImageView.userInteractionEnabled = YES;
    //設定邊框粗細
    [[self.albumImageView layer] setBorderWidth:3.0];
    //設定邊框顏色
    [[self.albumImageView layer] setBorderColor:[UIColor colorWithRed:1.0 green:0.75 blue:0.0 alpha:0.7].CGColor];
    //設定超出邊框的部份做遮罩
    [[self.albumImageView layer] setMasksToBounds:YES];
    //設定背景顏色
    [[self.albumImageView layer] setBackgroundColor:[UIColor colorWithRed:0.5 green:0.5 blue:0.5 alpha:0.6].CGColor];
    //設定圓角程度
    [[self.albumImageView layer] setCornerRadius:10.0];

所有繼承UIView的視覺元件都可使用圓角！圓角之外，還有陰影、邊框和漸層光澤可以設定～

如果view中有圖片，以上設置後還要設定，影像才會有預期的圓角喔！

[self.albumImageView.layer setMasksToBounds:YES];

參考：關於 UIView 圓角的二三事、UIView 視覺效果：圓角、陰影、邊框、漸層光澤、UIView必備基礎與常用方法、set cornerRadius and setbackgroundimage to UIButton。

分類：

iOS, 教學

1 Comment

Tagged with:

Comments on: "[iOS] 視圖圓角" (1)

  1. 未知 的大頭貼
    [iOS] TextField和TextView顯示圓角 | 逍遙文工作室 said:
    2013 年 12 月 29 日 於 19:11:16

    […] 在視圖圓角這篇文章中介紹過，只要是繼承UIView的子類別都可以實現圓角的效果～所以當然TextField和TextView也可以顯示圓角囉！除了可以變成不同程度的圓角，還可以改變框的厚度和顏色。 […]

    讚

隨意留個言吧：）～

這個網站採用 Akismet 服務減少垃圾留言。進一步了解 Akismet 如何處理網站訪客的留言資料。

標籤雲