Just a Computer Graphics Studio & My Life

Posts tagged ‘image’

影像互轉Base64編碼

原本一直以為傳送影像檔案到伺服器,只能透過Binary方式傳送,後來得知還可以影像先轉成Base64,伺服器端再轉回影像。

現在有網頁可以影像互轉Base64編碼,讓我串接後台API也能更得心應手了!

(繼續閱讀…)

廣告

[iOS] 漸層色彩影像 (Gradient Color Image)

近年來App流行漸層色彩影像 (Gradient Color Image),我們不想要美術師出圖,因為有很多螢幕尺寸要考量,所以想由程式碼來個別生成。

漸層色彩影像 Gradient Color Image

結果圖上有三個Image View,上圖為單純藍色,左下為水平漸層黑色alpha值由1到0,右下為垂直漸層黑色alpha值由1到0。

我將所需要的程式碼檔案放在GitHub GistGradient Color Image

[iOS] 拉伸影像 (Stretch Image)

iPhone發展至今已有至少4種尺寸,如3.5、4、4.7、5.5吋,我們想要在螢幕上顯示等比例的影像,這張影像不是要準備四張圖,就是必須拉伸那一張圖。我們現在想要使用一張按鈕圖,在四種尺寸上顯示為靠左右邊,這麼小張(49×49)的圖勢必要做拉伸影像 (Stretch Image)

button_y

只提供一種尺寸的好處是節省設備的空間,也讓美術設計師省去產生圖檔的時間。

我們想要如下的效果⋯⋯

iOS 拉伸影像 Stretch Image3

(繼續閱讀…)

[軟體] ImageOptim 影像最佳化

工欲善其事,必先利其器」,一直以來是做事情的基本法則,若是長期要做的事情更能體會基礎的重要性!寫逍遙文工作室部落格已經超過三年半的時間,累積文章超過1000篇,影像數量接近8000張,WordPress平台給3GB免費空間,目前只用了1.2GB (41%),估計還能再戰3年!

ImageOptim icon

(繼續閱讀…)

[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)

(繼續閱讀…)

標籤雲

%d 位部落客按了讚: