Just My Life & My Work

Posts tagged ‘image’

[iOS] 影像旋轉 (Image Rotation)

原以為伺服器吐回來給我的會是「直向」的圖,那麼我就可以不去旋轉它,但事與願違,我還是得處理「橫向」的圖⋯⋯好在吐回來的圖像資料,除了有URL外,還有Orientation,那麼我就根據後者去判斷是否該旋轉90度

把以下的code貼到想要使用的.m檔內即可:)~

/**
 Theme: Image Rotation
 IDE: Xcode 6
 Language: Objective C
 Date: 103/10/02
 Author: HappyMan
 Blog: https://cg2010studio.wordpress.com/
 */
@interface UIImage (RotationMethods)
- (UIImage *)imageRotatedByDegrees:(CGFloat)degrees;
@end

@implementation UIImage (RotationMethods)

static CGFloat DegreesToRadians(CGFloat degrees) {return degrees * M_PI / 180;};

- (UIImage *)imageRotatedByDegrees:(CGFloat)degrees
{
    // calculate the size of the rotated view's containing box for our drawing space
    UIView *rotatedViewBox = [[UIView alloc] initWithFrame:CGRectMake(0,0,self.size.width, self.size.height)];
    CGAffineTransform t = CGAffineTransformMakeRotation(DegreesToRadians(degrees));
    rotatedViewBox.transform = t;
    CGSize rotatedSize = rotatedViewBox.frame.size;
    
    // Create the bitmap context
    UIGraphicsBeginImageContextWithOptions(rotatedSize, NO, 2.0);
    CGContextRef bitmap = UIGraphicsGetCurrentContext();
    
    // Move the origin to the middle of the image so we will rotate and scale around the center.
    CGContextTranslateCTM(bitmap, rotatedSize.width/2, rotatedSize.height/2);
    
    // Rotate the image context
    CGContextRotateCTM(bitmap, DegreesToRadians(degrees));
    
    // Now, draw the rotated/scaled image into the context
    CGContextScaleCTM(bitmap, 1.0, -1.0);
    CGContextDrawImage(bitmap, CGRectMake(-self.size.width / 2, -self.size.height / 2, self.size.width, self.size.height), [self CGImage]);
    
    UIImage *newImage = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();
    return newImage;
}
@end

使用方式相當簡單,只要以UIImage的實體來呼叫此方法,然後它處理完會吐回UIImage。

UIImage *rotatedImage = [happyImage imageRotatedByDegrees:90.0];

如此就可以旋轉90度囉~當然你想轉180度、246度等等也是可以!

要注意的是,這裡不是UIImageView的做法喔!因為我想要直接轉存成檔案,所以是用UIImage來做到。

參考:StackOverFlow – How to rotate an image 90 degrees on iOS?

[Mac OS X] 截取GIF檔中的影像

想要截取GIF檔中的影像可以怎麼做呢?在Mac OS X直接使用內建的「預覽程式」就可以做到!

dragon ball

剛好在找素材,就找到非常帥氣的超級賽亞人!

(繼續閱讀…)

[iOS] 儲存捲軸的影像 (Save Scroll View to Image)

身為一個視覺創作者,無疑會想要把自己的作品給保存下來,之前常用的螢幕截圖似乎不敷使用,因為我們螢幕的長寬有限,而在其中內容則無限!這時候我不想花時間慢慢一頁一頁地截圖,更不想用影像處理軟體來接合,這時候可以怎麼做呢?

如果同時是個程式設計師,這一切就可以交由程式碼來幫我解決囉!可以先回顧文章:儲存視圖為影像 (Save View to Image)

(繼續閱讀…)

[iOS] 非同步下載影像

從網路下載影像,接著顯示在螢幕上,乍聽之下很簡單,卻隱含著許多「眉角」。基於影像容量以及網路速度考量,為了不讓UI卡住,我們勢必得把下載的工作放到非主線程上,在這裡我們叫它為非同步下載影像,一旦下載完畢,回到主線程顯示到螢幕上。

非同步下載影像

(繼續閱讀…)

[iOS] 載入來源不同的影像

iOS已經寫好的方法,通常我們只要會使用就好,至於實作內容我們就姑且當作沒看到⋯⋯不過在一些情況下,我們很注重效能、效果、效率,原本微不足道的差異或錯誤,將造成「失之毫釐差以千里」的結果。我們就來試驗一下載入來源不同的影像吧~

ban5.png

拿它來作實驗!

(繼續閱讀…)

[iOS] ScrollView 實作影像縮放與移動

以為想要可互動影像來縮放與移動的功能,需要實做複雜的捲動手勢,原來只要用ScrollView,就能達到效果!

scrollview zoom2

影像縮小

(繼續閱讀…)

[iOS] 三層級顯示影像 (Three-Level Display Image)

很多時候在APP顯示的影像是來自網路,這時候我們會想到,若沒有網路時還想顯示影像該怎麼辦?解決方法當然就是在有網路的時候,把目標影像給儲存到手機端,下次顯示時直接取用。

然而此時出現另一個問題,就是從手機端顯示影像,居然會讓體驗變得頓頓的卡卡的,感覺十分不舒服⋯⋯解決辦法就是把影像快取起來,下次顯示時直接拿來用。

之所以頓頓卡卡是因為讀取自「硬碟」,網路下載會先儲存在「記憶體」,前者是在主程序讀取影像,因來源是硬碟,所以不僅耗時較久,連帶又會卡UI;後者在非主程序下載,當下載完才會切換到主程序顯示,來源又是在記憶體,讀取速度較快,因此就不會卡卡頓頓的。

於是我們就發展出三層級顯示影像 (Three-Level Display Image),也就是從網路(伺服器)下載影像到手機端(硬碟),再將影像快取(記憶體)起來顯示

上一篇影像快取 (Image Cache)我的用法是,從網路下載影像,接著快取起來顯示,跳過儲存到手機端這個步驟,在此我用簡單的if-else說明如何實作!

(繼續閱讀…)

[iOS] 影像快取 (Image Cache)

時常需要從網路上抓取影像載入APP裡頭,尤其是在TableView的cell頻繁消失又出現的狀況,會不停地重複同樣(下載顯示)的動作,這樣子做不是不行,然而使用者體驗會有點差,儘管已經用多執行緒去抓圖和載圖,操作上還算相當順暢,然而使用者還是會看到影像怎麼這時候消失變出現,接著又滾回去又從消失變出現,使用者體驗實在相當糟糕⋯⋯

於是想當然爾,我們會想要把已經載入的圖給暫存起來,下次要顯示時直接抓暫存在記憶體中的影像快取 (Image Cache)即可!
(繼續閱讀…)

[iOS] Asset取得不同解析度影像

相片的應用真的非常之廣,使用WSAssetPicker來多選相片,除了要注意記憶體不能爆掉之外,存取速度也是我們所在意的因素,Asset所提供的特性可以讓我們輕易取得四種不同的影像解析度,就看用途為何來決定。

(繼續閱讀…)

[iOS] 儲存與讀取影像檔

一直對儲存和讀取影像感到恐懼,不過有機會來嘗試一下,就藉此突破心魔吧!其實還滿容易做到,行動裝置就好比一般電腦一樣!

iOS 儲存讀取影像

(繼續閱讀…)

標籤雲