iOS開發--圖片處理

來源:互聯網
上載者:User

iOS開發--圖片處理
縱觀現實社會和移動app市場,這是一個看臉的時代,而好看且漂亮的APP介面就是移動APP的臉.漂亮的外觀後面少不了UI設計人員的辛苦,如果不懂的處理,就浪費了UI設計人員的心血.   比如下面這張圖片,是用來做按鈕圖片的       大小為:59 * 32   先在把它作為一張圖片顯示出來,圖片顯示位置設定為200 * 50  

 1  #import "ViewController.h" 2    3   @interface ViewController () 4    5   @end 6    7   @implementation ViewController 8    9   - (void)viewDidLoad {10      [super viewDidLoad];11      // 對圖片的展開12      [self stretchPhoto];     13  }14 15  - (void)stretchPhoto16  {17      UIImageView *imageView = [[UIImageView alloc]initWithFrame:CGRectMake(60, 180, 200, 50)];18      imageView.image = [UIImage imageNamed:@"btnbg_blue.png"];19      [self.view addSubview:imageView];20  }21  22  @end

 

     我們可以清晰的看到,圖片失去了原來的樣子,尤其是四個角,這是因為圖片本身大小為:59 * 32,而設定的圖片顯示位置的大小為200 * 50 ,圖片被拉壞了.   下面我們對這張圖片設定一個展開點:  
 1 #import "ViewController.h" 2  3 @interface ViewController () 4  5 @end 6  7 @implementation ViewController 8  9 - (void)viewDidLoad {10     [super viewDidLoad];11 12     // 對圖片的展開13     [self stretchPhoto];14 }15 16 // 對圖片的展開17 - (void)stretchPhoto18 {19     UIImageView *imageView = [[UIImageView alloc]initWithFrame:CGRectMake(60, 180, 200, 50)];20     [self.view addSubview:imageView];21     22     // 設定圖片的展開點23     UIImage *images = [UIImage imageNamed:@"btnbg_blue.png"];  // 59 * 3224     images = [images stretchableImageWithLeftCapWidth:30 topCapHeight:16];25     imageView.image = images;26 }27 28 @end

 

     可以清楚的看到圖片被完美的展開顯示了.   下面對設定圖片展開點的方法做一個詳解:  
1 - (UIImage *)stretchableImageWithLeftCapWidth:(NSInteger)leftCapWidth topCapHeight:(NSInteger)topCapHeight;2 @property(nonatomic,readonly) NSInteger leftCapWidth;   // default is 0. if non-zero, horiz. stretchable. right cap is calculated as width - leftCapWidth - 13 @property(nonatomic,readonly) NSInteger topCapHeight;   // default is 0. if non-zero, vert. stretchable. bottom cap is calculated as height - topCapWidth - 1

 

   上面的內容是Xcode文檔中對該方法的解釋   第1行是方法名,傳回值為UIImage對象,需要傳遞兩個NSInteger類型的參數;   第2行和第3行是第1行需要傳遞參數的兩個屬性,預設都是0;從其他地方看到這兩個屬性由一個名字叫:端蓋,即左端蓋寬和頂端蓋高.   這樣看來,展開圖片的話,左側和頂部都展開了,那麼右側和底部呢?   API文檔給出了計算公式:rightCapWidth = image.size.width - (image.leftCapWidth + 1);       即:右端蓋寬 = 圖片寬 - (左端蓋寬 + 1);                bottomCapHeight = image.size.height - (image.topCapHeight + 1);  即:底部端蓋 = 圖片高 - (頂部端蓋 + 1);         這樣可以看出,最後被展開的位置就是給定左端蓋和頂部端蓋交叉位置旁邊 1 * 1 的地區(中間黃色地區),即這種方式只展開給定地區的 1 * 1 個點.   一般來說,習慣給定圖片寬和高一半的位置,這樣可以避免不清楚邊緣變化引起的不必要的麻煩.   

相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.