UIImageView

UIImageView

summary

UIImageView極其常用,功能比較專一:顯示圖片

pooperty

@property(nonatomic,retain) UIImage     *image; 
顯示的圖片
@property(nonatomic,copy) NSArray       *animationImages; 
顯示的動畫圖片
@property(nonatomic) NSTimeInterval     animationDuration; 
動畫圖片的持續時間
@property(nonatomic) NSInteger          animationRepeatCount; 
動畫的播放次數(默認是0,代表無限播放)
@property(nonatomic) UIViewContentMode  contentMode; 
內容模式: 一般用來控制圖片如何顯示

Method

- (void)startAnimating; // 開始動畫
- (void)stopAnimating; // 停止動畫
- (BOOL)isAnimating; // 是否正在執行動畫

UIImageView-設置imageView的frame

initWithImage 
默認尺寸就是圖片的尺寸,位置默認從(0,0)開始
imageView.frame = CGRectMake(100,100, image.size.width, image.size.height);
注意尺寸不能設置在圖片之前(演示)

錯誤代碼:imageView.frame.size.width = image.size.width
直接賦值size,但會出現OC語法錯
原因:不能直接修改OC對象結構體屬性的成員
結構體是值傳遞

如何賦值?
CGRect tempFrame = imageView.frame; // frame是一個新定義的變量
tempFrame =  image.size;
imageView.frame = tempFrame; // 如果少了這一句(不是對象,是結構體)

常見寫法
imageView.frame = (CGRect){CGPointMake(100,100), imageView.image.size};
imageView.frame = (CGRect){CGPointMakeZero, imageView.image.size};
修改frame的3種方式(同樣適用于bounds/center)
  • 1.直接使用CGRectMake函數
  • 2.利用臨時結構體變量
  • 3.直接運用結構體賦值

UIImage類

一個UIImage對象代表一張圖片對象
  • Method
 加載圖片的方式:
   1. imageNamed:
   2. imageWithContentsOfFile:
 
   1. 加載Assets.xcassets這里面的圖片:
    1> 打包后變成Assets.car
    2> 拿不到路徑
    3> 只能通過imageNamed:來加載圖片
    4> 不能通過imageWithContentsOfFile:來加載圖片
 
   2. 放到項目中的圖片:
    1> 可以拿到路徑
    2> 能通過imageNamed:來加載圖片
    3> 也能通過imageWithContentsOfFile:來加載圖片

返回一張受保護且被拉伸的圖片

iOS 5.0以前使用(棄用)這個方法會自動計算出偏向中間的一個1*1的方格也就是被拉伸的地方(默認使用拉伸)

[image stretchableImageWithLeftCapWidth:imageHeight *0.5 topCapHeight:imageHeight *0.5 ];

新方法

 [image resizableImageWithCapInsets:UIEdgeInsetsMake(<#CGFloat top#>, <#CGFloat left#>, <#CGFloat bottom#>, <#CGFloat right#>)];
 //拉伸模式 UIImageResizingModeTile平鋪 UIImageResizingModeStretch拉伸
 [image resizableImageWithCapInsets:UIEdgeInsetsMake(imageheight * 0.5, imagewidth * 0.5, imageheight * 0.5 -1, imagewidth * 0.5 - 1) resizingMode:UIImageResizingModeTile];

contentMode屬性

  • 帶有scale單詞的 <圖片有可能被拉深>
  • UIViewContentModeScaleToFill
  • 將圖片拉伸填充整個imageView
  • 圖片顯示的尺寸跟imageView的尺寸是一樣的
  • 帶有aspect單詞的:保持圖片原來的寬高比
  • UIViewContentModeScaleAspectFit
  • 保證剛好能看到圖片的全部
  • UIViewContentModeScaleAspectFill<畫圖分析>
  • 拉伸至圖片的寬度或者高度跟imageView一樣
  • 沒有帶有scale的單詞<圖片絕對不會被拉伸>

裁剪

//居中顯示
imageView.contentMode = UIViewContentModeCenter;
// 裁剪超出imageView邊框的部分
imageView.clipsToBounds = YES;

UIImageView-幀動畫的基本使用

demo

//創建UIImageView根據圖片初始化大小
    UIImage *image = [UIImage imageNamed:@"1"];
    UIImageView *images = [[UIImageView alloc]initWithFrame:CGRectMake(0, 0, image.size.width, image.size.height)];
    //讓圖片居中
    images.center = CGPointMake(self.view.bounds.size.width *0.5, self.view.bounds.size.height *0.5);
    //把image賦給imageView
    images.image =image;
    //加到控制器的View中
    [self.view addSubview:images];
    //創建圖片的數組
    NSMutableArray *imagesArr = [NSMutableArray array];
    //循環添加放入數組
    for (int i = 0; i < 20; i++) {
        NSString *imageName = [NSString stringWithFormat:@"%d",i+1];
        UIImage *ima = [UIImage imageNamed:imageName];
        [imagesArr addObject:ima];
    }
    //讓全局變量的imageView賦值
    self.imageView = images;
    //讓全局變量的arr賦值
    self.arr = imagesArr;
    //imageView透明度
    self.imageView.alpha = 0.5;
    // 設置播放時長
    // 1秒30幀, 一張圖片的時間 = 1/30 = 0.03333 20 * 0.0333
    self.imageView.animationDuration = 1.0;
    // 開始動畫
    [self.imageView startAnimating];

UIImageView-加載圖片的緩存問題

  • imageNamed:
  • 有緩存
    • UIImage *image =[UIImage imageNamed:@"圖片名"];
    • 使用場合:圖片比較小、使用頻率比較高
    • 建議:把需要緩存的圖片放到Image.xcassets
  • 沒有緩存
    • NSString *file = [[NSBundle mainBundle] pathForResource:@"圖片名" ofType:@"圖片擴展名"];
    • UIImage *image = [UIImage imageWithContentOfFile:file];
    • 只要方法名帶有file的,都是傳全路徑
    • 使用場合:圖片比較大,使用頻率比較低
    • 建議:不需要緩存的圖片不能放在Assets.xcassets中

總結

1.放在Assets.xcassets中的圖片,只能通過文件名訪問,沒有全路徑
2.大批量的圖片不要放在Assets.xcassets中,默認就帶有緩存
3.放到Assets.xcassets中的圖片只能通過圖片名去加載,蘋果會壓縮圖片,而且默認帶有緩存
4.很多資源都是加載項目中的,項目中的資源都是通過mainBundle來獲取的

延遲做一些事情

    //iOS中有很多方式(GCD,dispatch...)
    [abc performSelector:@selector(stand:) withObject:@"123" afterDelay:10];
    // 10秒后調用abc的stand:方法,并且傳遞@“123”參數
    // abc可以是任意對象
    // NSTimeInterval -->進.h文件分析--->double--->秒

音頻文件的簡單播放

 // 創建一個音頻文件的URL(URL就是文件的路徑對象)
     NSURL *url = [[NSBundle mainBundle] URLForResource:@"音頻文件名" withExtention:@“音頻文件擴展名”];
    //另一寫法
    NSURL *url = [[NSBundle mainBundle] URLForResource:@"音頻文件名.音頻文件擴展名" withExtention:nil];
    // 創建播放器
    self.palyer = [AVPlayer playerWithURL:url];
    [self.player play];

Demo

demo1 初始化frame

//方式一 在初始化以后賦值frame
UIImageView *imageView = [[UIImageView alloc]init];
imageView.image = [UIImage imageNamed:@"2"];
imageView.frame = CGRectMake(10, 10, 100, 200);
imageView.frame = (CGRect){{10,10},{200,200}};
imageView.contentMode = UIViewContentModeScaleAspectFill;

//方式二 初始化的時候賦值frame
UIImageView *imageView1 = [[UIImageView alloc]initWithFrame:CGRectMake(10, 10, 100, 200)];
UIImage *imgae = [UIImage imageNamed:@"2"];
imageView1.image = imgae;

//方式三 根據圖片的寬高初始化
UIImage *imgae = [UIImage imageNamed:@"2"];
UIImageView *imageView = [[UIImageView alloc]initWithImage:imgae];
//缺點  移動的時候只能通過center移動
imageView.center = CGPointMake(200, 300);

//方式四
UIImage *image = [UIImage imageNamed:@"2"];
UIImageView *imgaeView = [[UIImageView alloc]initWithFrame:CGRectMake(10, 10, image.size.width, image.size.height)];
imgaeView.image = image;
[self.view addSubview:imgaeView];



demo2 裁剪

// 1.1 創建UIImageView對象
    UIImageView *imageView = [[UIImageView alloc]init];
    // 1.2 設置frame
    imageView.frame = self.view.bounds;
    // 1.3 設置背景
    imageView.backgroundColor = [UIColor redColor];
    // 1.4 設置圖片 (png不需要后綴)
    imageView.image = [UIImage imageNamed:@"1"];
    /**
     
     UIViewContentModeRedraw, // 重新繪制 (核心繪圖) drawRact
     
     //帶有Scale,標明圖片有可能被拉伸或壓縮
     UIViewContentModeScaleToFill, // 完全的壓縮或拉伸
     
     // Aspect 比例,縮放是帶有比例的
     UIViewContentModeScaleAspectFit, // 寬高比不變 Fit 適應
     UIViewContentModeScaleAspectFill, // 寬高比不變 Fill 填充
     
     //不帶有Scale,標明圖片不可能被拉伸或壓縮
     UIViewContentModeCenter,
     UIViewContentModeTop,
     UIViewContentModeBottom,
     UIViewContentModeLeft,
     UIViewContentModeRight,
     UIViewContentModeTopLeft,
     UIViewContentModeTopRight,
     UIViewContentModeBottomLeft,
     UIViewContentModeBottomRight,
     */
    // 1.5 設置圖片的內容模式
    imageView.contentMode = UIViewContentModeScaleAspectFit;
    // 2.0 加到控制器的view中
    [self.view addSubview:imageView];
    // 裁剪多余的部分
    imageView.clipsToBounds = YES;
    ```
`demo3 毛玻璃`
```objc
// 1.創建UIImageView對象
    UIImageView *image = [[UIImageView alloc]init];
    // 2. 設置尺寸
    //image.frame = CGRectMake(0, 0,self.view.bounds.size.width , self.view.bounds.size.height);
    image.frame = self.view.bounds;
    NSLog(@"%@",NSStringFromCGRect(image.frame));
    // 3. 設置背景顏色
    image.backgroundColor = [UIColor yellowColor];
    // 4. 設置背景圖片
    image.image = [UIImage imageNamed:@"1"];
    // 5.設置圖片的內容模式
    image.contentMode = UIViewContentModeScaleAspectFill;
    
    // 6.加毛玻璃
    // 6.1 創建UIToolBar對象
    UIToolbar *tob = [[UIToolbar alloc]init];
    
    // 6.2 設置toolBar的frame
    tob.frame = image.frame;
    // 6.3 設置毛玻璃的樣式
    tob.barStyle = UIBarStyleBlack;
    tob.alpha = 0.85;
    // 6.4 加到imageView中
   
    [self.view addSubview:image];
    [self.view addSubview:tob];
最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容