8 (495) 215-53-16

info@notissimus.com

ул. Заозерная, 8

196084, Санкт-Петербург

09:00 - 20:00

сб.,вс. - выходные

Масштабирование изображений в приложениях для iOS

 Блог    

При разработке мобильных приложений мы всегда используем изображения и порой много времени уходит на то, чтобы методом перебора найти нужный масштаб для отрисовки изображения.

Поэтому в данной статье я оставлю наглядную шпаргалку по видам масштабирования изображений для себя и для других разработчиков, которые разрабатывают мобильные приложения для iOS 

Для отображения изображения в iOS нам необходимо создать объект изображения и область, в которой это изображение будет отображаться. 

На C# с использованием Xamarin это будет выглядеть следующим образом: 

UIImage image = UIImage.FromFile ("1.jpg"); 
UIImageView imageView = new UIImageView (new RectangleF(0f, 0f,View.Frame.Width, View.Frame.Height)); 
imageView.Image = image; 
View.AddSubview (imageView); 

На Objective-C: 

UIImage *image = [UIImage imageNamed:@"1.jpg"]; 

UIImageView *imageView = [[UIImageView alloc] initWithImage:image ]; 
[self.view addSubview:self.imageView ]; 

У UIImageView есть свойство ContentMode, которое определяет каким образом будет осуществляться масштабирование изображения.  

Например,  

C#: 

imageView.ContentMode = UIViewContentMode.Bottom; 

Objective-C: 

self.imageView.image = UIViewContentModeBottom;

 

UIViewContentMode – это enum, который имеет следующие варианты: 

C#:

Objective-C: 

enum UIViewContentMode
{ 
   ScaleToFill, 
   ScaleAspectFit, 
   ScaleAspectFill, 
   Redraw, 
   Center, 
   Top, 
   Bottom, 
   Left, 
   Right, 
   TopLeft, 
   TopRight, 
   BottomLeft, 
   BottomRight 
} 
typedef enum {
    UIViewContentModeScaleToFill,
    UIViewContentModeScaleAspectFit,
    UIViewContentModeScaleAspectFill,
    UIViewContentModeRedraw,
    UIViewContentModeCenter,
    UIViewContentModeTop,
    UIViewContentModeBottom,
    UIViewContentModeLeft,
    UIViewContentModeRight,
    UIViewContentModeTopLeft,
    UIViewContentModeTopRight,
    UIViewContentModeBottomLeft,
    UIViewContentModeBottomRight,
} UIViewContentMode;





Теперь давайте наглядно посмотрим, как будет выглядеть изображение при заданном том или ином типе UIViewContentMode. 

 

Исходное изображение – котики =)  

1218050576_image00001 (1) 

 

1. Если свойство ContentMode не задано. 

default 

 

2. C#: imageView.ContentMode = UIViewContentMode.Bottom;

    Objective-C: self.imageView.image = UIViewContentModeBottom; 

bottom 

 

3. C#: imageView.ContentMode = UIViewContentMode.BottomLeft; 

    Objective-C: self.imageView.image = UIViewContentModeBottomLeft; 

bottomLeft 

 

4. C#: imageView.ContentMode = UIViewContentMode.BottomRight; 

    Objective-C: self.imageView.image = UIViewContentModeBottomRight;  

bottom Right 

 

5. C#: imageView.ContentMode = UIViewContentMode.Center; 

    Objective-C: self.imageView.image = UIViewContentModeCenter; 

center 

 

6. C#: imageView.ContentMode = UIViewContentMode.Left; 

    Objective-C: self.imageView.image = UIViewContentModeLeft; 

Left 

 

7. C#: imageView.ContentMode = UIViewContentMode.Redraw; 

    Objective-C: self.imageView.image = UIViewContentModeRedraw; 

redraw 

 

8. C#: imageView.ContentMode = UIViewContentMode.Right; 

    Objective-C: self.imageView.image = UIViewContentModeRight; 

right 

 

9. C#: imageView.ContentMode = UIViewContentMode.ScaleAspectFill ; 

    Objective-C: self.imageView.image = UIViewContentModeScaleAspectFill ; 

ScaleAspectFill 

 

10. C#: imageView.ContentMode = UIViewContentMode.ScaleAspectFit ; 

     Objective-C: self.imageView.image = UIViewContentModeScaleAspectFit; 

ScaleAspectFit 

 

11. C#: imageView.ContentMode = UIViewContentMode.ScaleToFill ; 

     Objective-C: self.imageView.image = UIViewContentModeScaleToFill ; 

ScaleToFill 

 

12. C#: imageView.ContentMode = UIViewContentMode.Top ; 

     Objective-C: self.imageView.image = UIViewContentModeTop; 

Top 

 

13. C#: imageView.ContentMode = UIViewContentMode.TopLeft; 

     Objective-C: self.imageView.image = UIViewContentModeTopLeft; 

TopLeft 

 

14. C#: imageView.ContentMode = UIViewContentMode.TopRight; 

     Objective-C: self.imageView.image = UIViewContentModeTopRight; 

TopRight 

]]>