Что означает свойство «contentsCenter» в классе CALayer? - PullRequest
0 голосов
/ 17 июня 2020

это исходное изображение. исходное изображение

Я установил его следующим образом:

self.layerView.contentsCenter = CGRectMake(0.25, 0.25, 0.5, 0.5);

, затем отобразил следующее: изменить изображение

но в соответствии с к объяснению Apple, его следует масштабировать, а не исчезать, вы можете увидеть, что центральная часть измененного изображения исчезла.

что произошло?

вы можете мне помочь, спасибо.


полный код:

#import "ViewController.h"

@interface ViewController ()
@property (nonatomic,strong) UIView *erView;
@property (nonatomic,strong) CALayer *layerView;
@end

@implementation ViewController

#pragma mark - life cycle

- (void)viewDidLoad {
    [super viewDidLoad];
    [self setUpView];
}

#pragma mark - set up

- (void)setUpView{
    self.view.backgroundColor = [UIColor redColor];
    self.erView = [[UIView alloc] initWithFrame:CGRectMake(50, 100, 200, 200)];
    [self.view addSubview:self.erView];
    self.layerView = [CALayer layer];
    self.layerView.frame = CGRectMake(0, 0, 200, 200);
    self.layerView.backgroundColor = [UIColor blueColor].CGColor;
    [self.erView.layer addSublayer:self.layerView];
    UIImage *image = [UIImage imageNamed:@"picture"];
    [self addSpriteImage:image withContentRect:CGRectMake(0, 0, 1, 1) toLayer:self.layerView];
    self.layerView.contentsCenter = CGRectMake(0.25, 0.25, 0.5, 0.5);
}

- (void)addSpriteImage:(UIImage *)image withContentRect:(CGRect)rect toLayer:(CALayer *)layer{
    layer.contents = (__bridge id)image.CGImage;
    layer.contentsGravity = kCAGravityResizeAspect;
    layer.contentsRect = rect;
}


@ zrzka, спасибо за ответ, мне это очень пригодилось! Я многое понимаю. когда я читаю книгу «iOS Расширенные методы CoreAnimation», меня что-то сбивает с толку:

  • image1 показывают, что авторская интерпретация этого кода такая же, как и ваша.
self.layerView.contentsCenter = CGRectMake(0.25, 0.25, 0.5, 0.5);

image3

  • если contentCenter изменился следующим образом:
self.layerView.contentsCenter = CGRectMake(0.25, 0.25, 0.8, 0.8);

он будет отображаться так, что меня смущает в основном ...

image4

  • «Немного, например, 1 пиксель (ширина)» по горизонтали. почему Horizontal (1 пиксель) отличается от Vertical (0 пикселей)?

  • как я могу реализовать два типа эффектов, таких как image5?

изображение 5

1 Ответ

0 голосов
/ 17 июня 2020

Код:

let image = UIImage(named: "origin")
contentsView.contentMode = .scaleAspectFit
contentsView.layer.contents = image?.cgImage
contentsView.layer.contentsCenter = CGRect(x: 0.25, y: 0.25, width: 0.5, height: 0.5);

enter image description here

Ожидается и зависит от двух вещей:

  • насколько велик само изображение,
  • размер вида / слоя.

Цветные наложения:

  • Зеленый - эта часть изображения не растягивается
  • Красный - эта часть изображения растягивается по вертикали, но не по горизонтали
  • Синий - эта часть изображения растягивается по горизонтали, а не по вертикали
  • Желтый - эта часть изображение растянуто по горизонтали и вертикали

Что значит растянуть? Его можно растянуть до большего или меньшего изображения. Изображение меньшего размера означает, что оно может иметь нулевую ширину / высоту.

Сравните эти два снимка экрана:

enter image description here

  • Вкл. слева - исходное изображение
  • Справа - исходное изображение с добавленными цветными наложениями

Что произошло?

  • Вы просили не делать этого растянуть зеленые части
  • Вертикально
    • Есть ли место для красных и желтых частей?
    • Нет, не нарисовано, в основном растянуто до высоты 0
  • По горизонтали
    • Есть ли место для синих и желтых частей?
    • Немного, например, 1 пиксель (ширина)
    • Растянуть до 1 пикселя и нарисуйте его

Обновление:

Если contentCenter изменится следующим образом:

self.layerView.contentsCenter = CGRectMake(0.25, 0.25, 0.8, 0.8);

, он будет отображать как ...

contentsCenter документация:

Значение в этом свойстве по умолчанию установлено равным единичному прямоугольнику (0.0,0.0) (1.0,1.0) , что вызывает en изображение шины для масштабирования в обоих измерениях. Если вы укажете прямоугольник, который простирается на за пределы единичного прямоугольника, результатом будет undefined .

С 0.25, 0.25, 0.8, 0.8 вы говорите следующее:

  • верхняя / левая часть - 25% ширины изображения, 25% высоты изображения
  • верхняя / центральная часть - 80% ширины изображения, 25% высоты изображения
  • верхняя / правая часть - 25% ширины изображения, 25% высоты изображения
  • ...

Вы уже находитесь за пределами прямоугольника блока - 25% ширины (t / l) + 80% ширины (t / c) + 25% ширины (t / r) = 130% ширины (1,3> 1,0). Результат не определен.


«Немного, как 1 пиксель (ширина)» по горизонтали. почему Horizontal (1 пиксель) отличается от Vertical (0 пикселей)?

Это простая математика. Как только вы рисуете не растянутую верхнюю / левую и верхнюю / правую части, остается ли место для верхней / центральной части? Нет, рисовать не будет. Да, будут нарисованы и растянуты по размеру помещения. То же самое относится и к вертикальному направлению.

как я могу реализовать два вида эффектов, например image5?

  • CGRectMake принимает четыре аргумента - x , y, width, height.
  • Допустим, вы хотите избежать растяжения всех угловых частей (их размеры равны) и что размер угловой части составляет 20% x 10% размер изображения.
  • x = 0.2
  • y = 0.1
  • width = 1.0 - 2 * x = 1.0 - 2 * 0.2 = 0.6
  • height = 1.0 - 2 * y = 1.0 - 2 * 0.1 = 0.8
  • CGRectMake(0.2, 0.1, 0.6, 0.8)

Вы также можете достичь этого с помощью UIImage (ищите Определение растягиваемого изображения ) & resizableImage(withCapInsets:resizingMode:), где вы может определять вставки в пикселях.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...