iOS
UIView

Синтаксис

1. // Объектив-C

2. [UIView new] // Получить объект представления, выделенный и инициализированный

3. [[UIView alloc] initWithFrame: (Pass CGRect)] // Получить представление, выделенное и инициализированное фреймом

4. [[UIView alloc] init] // Получить объект представления, выделенный и инициализированный

5. // Swift

6. UIView () // Создает экземпляр UIView с флагом CGRect.zero

7. UIView (frame: CGRect) // Создает экземпляр UIView, определяющий кадр

8. UIView.addSubview (UIView) // добавление другого экземпляра UIView в качестве подзадачи

9. UIView.hidden // Получить или установить видимость вида

10. UIView.alpha // Получить или установить непрозрачность представления

11. UIView.setNeedsLayout () // Заставляет просмотр обновлять макет

замечания

Создать UIView

Objective-C

CGRect myFrame = CGRectMake(0, 0, 320, 35)
UIView *view = [[UIView alloc] initWithFrame:myFrame];

//Alternative way of defining the frame
UIView *view = [[UIView alloc] init];
CGRect myFrame = view.frame;
myFrame.size.width = 320;
myFrame.size.height = 35;
myFrame.origin.x = 0;
myFrame.origin.y = 0;
view.frame = myFrame;

стриж

let myFrame = CGRect(x: 0, y: 0, width: 320, height: 35)
let view = UIView(frame: myFrame)

Сделать округленный вид

Чтобы сделать округленный UIView , укажите cornerRadius для layer .

Это также применимо к любому классу, который наследуется от UIView , например UIImageView .

Программный

Быстрый код

someImageView.layoutIfNeeded()
someImageView.clipsToBounds = true
someImageView.layer.cornerRadius = 10

Код цели-C

[someImageView layoutIfNeeded];
someImageView.clipsToBounds = YES;
someImageView.layer.cornerRadius = 10;

пример

//Swift code
topImageView.layoutIfNeeded()
bottomImageView.layoutIfNeeded()
topImageView.clipsToBounds = true
topImageView.layer.cornerRadius = 10
bottomImageView.clipsToBounds = true
bottomImageView.layer.cornerRadius = bottomImageView.frame.width / 2

//Objective-C code
[topImageView layoutIfNeeded]
[bottomImageView layoutIfNeeded];
topImageView.clipsToBounds = YES;
topImageView.layer.cornerRadius = 10;
bottomImageView.clipsToBounds = YES;
bottomImageView.cornerRadius = CGRectGetWidth(bottomImageView.frame) / 2;

Вот результат, показывающий эффект округленного вида с использованием указанного углового радиуса:

Заметка

Для этого вам необходимо включить структуру QuartzCore.

 #import <QuartzCore/QuartzCore.h>

Конфигурация раскадровки

Эффект закругленного обзора также может быть достигнут non-programmatically , установив соответствующие свойства в Storyboard .

Поскольку свойства layer не отображаются в Storyboard, вам необходимо изменить атрибут cornerRadius помощью атрибута User Defined Runtime Attributes.

Быстрое расширение

Вы можете использовать это удобное расширение для применения округленного представления, если оно имеет такую ​​же ширину и высоту.

extension UIView {
    @discardableResult
    public func setAsCircle() -> Self {
        self.clipsToBounds = true
        let frameSize = self.frame.size
        self.layer.cornerRadius = min(frameSize.width, frameSize.height) / 2.0
        return self
    }
}

Чтобы использовать его:

yourView.setAsCircle()

Как сделать снимок

Вы можете сделать снимок из UIView следующим образом:

стриж

let snapshot = view.snapshotView(afterScreenUpdates: true)

Objective-C

UIView *snapshot = [view snapshotViewAfterScreenUpdates: YES];

Использование IBInspectable и IBDesignable

Один (или два) из самых новых возможностей в последних версиях Xcode являются IBInspectable свойства и IBDesignable UIView s. Они не имеют ничего общего с функциональностью вашего приложения, но вместо этого влияют на опыт разработчика в Xcode. Цель состоит в том, чтобы визуально проверять пользовательские представления в приложении iOS без его запуска. Предположим, что у вас есть пользовательское представление с именем CustomView которое наследуется от UIView . В этом пользовательском представлении отобразится строка текста с обозначенным цветом. Вы также можете не отображать текст. Нам понадобятся три свойства:

var textColor: UIColor = UIColor.blackColor()
var text: String?
var showText: Bool = true

Затем мы можем переопределить функцию drawRect в классе:

if showText {
    if let text = text {
        let s = NSString(string: text)
        s.drawInRect(rect,
            withAttributes: [
                NSForegroundColorAttributeName: textColor,
                NSFontAttributeName: UIFont(name: "Helvetica Neue", size: 18)!
            ])
    }
}

Предполагая, что свойство text установлено, это приведет к рисованию строки в верхнем левом углу представления при запуске приложения. Проблема в том, что мы не будем знать, как это выглядит, без запуска приложения. Здесь IBInspectable и IBDesignable входят. IBInspectable позволяет визуально устанавливать значения свойств представления в Xcode, как и со встроенными элементами управления. IBDesignable покажет нам визуальный предварительный просмотр в раскадровке. Вот как должен выглядеть класс:

@IBDesignable
class CustomView: UIView {
    @IBInspectable var textColor: UIColor = UIColor.blackColor()
    @IBInspectable var text: String?
    @IBInspectable var showText: Bool = true

    override func drawRect(rect: CGRect) {
        // ...
    }
}

Или в Objective C:

IB_DESIGNABLE
@interface CustomView: UIView

@property (nonatomic, strong) IBInspectable UIColor* textColor;
@property (nonatomic, strong) IBInspectable NSString* text;
@property (nonatomic, assign) IBInspectable BOOL showText;

@end

@implementation CustomView

- (instancetype)init {
    if(self = [super init]) {
        self.textColor = [UIColor blackColor];
        self.showText = YES;
    }
    return self;
}

- (void)drawRect:(CGRect)rect {
    //...
}

@end

На следующих снимках экрана показано, что происходит в Xcode. Первое - это то, что происходит после добавления пересмотренного класса. Обратите внимание, что для трех свойств есть три новых элемента интерфейса. Цвет текста отобразит подборку цветов, текст - это только поле ввода, а « Показать текст» предоставит нам опции « Off И « On Которые являются false и true соответственно.

Далее следует изменить цвет текста на красный с помощью панели выбора цвета. Кроме того, был предоставлен некоторый текст, чтобы показать функцию drawRect . Обратите внимание, что представление в Interface Builder также обновлено.

Наконец, установка « Показать текст в положение« Off В инспекторе свойств приводит к исчезновению текстового отображения в« Интерфейс-Builder ».

Тем не менее, мы все придумали ситуацию, когда нам нужно создать округленный UIView на нескольких представлениях в вашей Storyboard Вместо объявления IBDesignable для всех просмотров Storyboard лучше создать Extension UIView и получить пользовательский интерфейс, построенный только для вашего UIView через проект, чтобы создать закругленный вид, установив угловой радиус. Конфигурируемый радиус границы на любом UIView, который вы создаете в раскадровке.

extension UIView {
    
    @IBInspectable var cornerRadius:CGFloat {
        set {
            layer.cornerRadius = newValue
            clipsToBounds = newValue > 0
        }
        get {
            return layer.cornerRadius
        }
    }
    
}

Анимация UIView

let view = UIView(frame: CGRect(x: 0, y: 0, width: 100, height: 100))
view.backgroundColor = UIColor.orange
self.view.addSubview(view)
UIView.animate(withDuration: 0.75, delay: 0.5, options: .curveEaseIn, animations: {
    //This will cause view to go from (0,0) to
    // (self.view.frame.origin.x,self.view.frame.origin.y)
    view.frame.origin.x = self.view.frame.origin.x
    view.frame.origin.y = self.view.frame.origin.y
}) { (finished) in
    view.backgroundColor = UIColor.blueColor()
}

Расширение UIView для атрибутов размера и кадра

Если мы хотим получить х-кординат происхождения представления, тогда нам нужно написать так:

view.frame.origin.x

Для ширины нам нужно написать:

view.frame.size.width

Но если мы добавим простое расширение к UIView , мы можем получить все атрибуты очень просто, например:

view.x
view.y
view.width
view.height

Это также поможет установить такие атрибуты, как:

view.x = 10
view.y = 10
view.width = 100
view.height = 200

И простое расширение было бы:

extension UIView {
    
    var x: CGFloat {
        get {
            return self.frame.origin.x
        }
        set {
            self.frame = CGRect(x: newValue, y: self.frame.origin.y, width: self.frame.size.width, height: self.frame.size.height)
        }
    }
    
    var y: CGFloat {
        get {
            return self.frame.origin.y
        }
        set {
            self.frame = CGRect(x: self.frame.origin.x, y: newValue, width: self.frame.size.width, height: self.frame.size.height)
        }
    }
    
    var width: CGFloat {
        get {
            return self.frame.size.width
        }
        set {
            self.frame = CGRect(x: self.frame.origin.x, y: self.frame.origin.y, width: newValue, height: self.frame.size.height)
        }
    }
    
    var height: CGFloat {
        get {
            return self.frame.height
        }
        set {
            self.frame = CGRect(x: self.frame.origin.x, y: self.frame.origin.y, width: self.frame.size.width, height: newValue)
        }
    }
}

Нам нужно добавить этот файл класса в проект, и он будет доступен для использования во всем проекте!

Программно управлять вводом и удалением UIView в другой UIView и из него

Предположим, у вас есть parentView в который вы хотите вставить новый subView программно (например, когда вы хотите вставить UIImageView в представление UIViewController ), чем вы можете сделать это, как UIViewController ниже.

Objective-C

[parentView addSubview:subView];

стриж

parentView.addSubview(subView)

Вы также можете добавить subView под другим subView2 , который уже является подвидным представлением parentView, используя следующий код:

Objective-C

[parentView insertSubview:subView belowSubview:subView2];

стриж

parentView.insertSubview(subView, belowSubview: subView2)

Если вы хотите вставить его над subView2 вы можете сделать это следующим образом:

Objective-C

[parentView insertSubview:subView aboveSubview:subView2];

стриж

parentView.insertSubview(subView, aboveSubview: subView2)

Если где-то в вашем коде вам нужно принести некоторый subView на передний subView , так что, прежде всего, в других parentView , вы можете сделать это следующим образом:

Objective-C

[parentView bringSubviewToFront:subView];

стриж

parentView.bringSubviewToFront(subView)

Наконец, если вы хотите удалить subView из parentView , вы можете сделать следующее:

Objective-C

[subView removeFromSuperview];

стриж

subView.removeFromSuperview()

Создание UIView с использованием Autolayout

UIView *view = [[UIView alloc] init];

[self.view addSubview:view];

//Use the function if you want to use height as constraint
[self addView:view onParentView:self.view withHeight:200.f];


//Use this function if you want to add view with respect to parent and should resize with it
[self addFullResizeConstraintForSubview:view addedOnParentView:self.view];

функции

Функция добавления вида с фиксированной высотой с использованием ограничений автоопределения

-(void)addView:(UIView*)subView onParentView:(UIView*)parentView withHeight:(CGFloat)height{

subView.translatesAutoresizingMaskIntoConstraints = NO;
    
NSLayoutConstraint *trailing =[NSLayoutConstraint
                                   constraintWithItem:subView
                                   attribute:NSLayoutAttributeTrailing
                                   relatedBy:NSLayoutRelationEqual
                                   toItem:parent
                                   attribute:NSLayoutAttributeTrailing
                                   multiplier:1.0
                                   constant:10.f];


NSLayoutConstraint *top = [NSLayoutConstraint
                               constraintWithItem:subView
                               attribute:NSLayoutAttributeTop
                               relatedBy:NSLayoutRelationEqual
                               toItem:parent
                               attribute:NSLayoutAttributeTop
                               multiplier:1.0
                               constant:10.f];
    
NSLayoutConstraint *leading = [NSLayoutConstraint
                                   constraintWithItem:subView
                                   attribute:NSLayoutAttributeLeading
                                   relatedBy:NSLayoutRelationEqual
                                   toItem:parent
                                   attribute:NSLayoutAttributeLeading
                                   multiplier:1.0
                                   constant:10.f];
[parent addConstraint:trailing];
[parent addConstraint:top];
[parent addConstraint:leading];

NSLayoutConstraint *heightConstraint =[NSLayoutConstraint
                                           constraintWithItem:subView
                                           attribute:NSLayoutAttributeHeight
                                           relatedBy:NSLayoutRelationEqual
                                           toItem:nil
                                           attribute:0
                                           multiplier:0.0
                                           constant:height];
    
[subView addConstraint:heightConstraint];

}

Функция добавляет ограничение полного размера для созданного UIView.

-(void)addFullResizeConstraintForSubview:(UIView*)subView addedOnParentView:(UIView*)parentView{

subView.translatesAutoresizingMaskIntoConstraints = NO;
    
NSLayoutConstraint *trailing =[NSLayoutConstraint
                                   constraintWithItem:subView
                                   attribute:NSLayoutAttributeTrailing
                                   relatedBy:NSLayoutRelationEqual
                                   toItem:parent
                                   attribute:NSLayoutAttributeTrailing
                                   multiplier:1.0
                                   constant:10.f];


NSLayoutConstraint *top = [NSLayoutConstraint
                               constraintWithItem:subView
                               attribute:NSLayoutAttributeTop
                               relatedBy:NSLayoutRelationEqual
                               toItem:parent
                               attribute:NSLayoutAttributeTop
                               multiplier:1.0
                               constant:10.f];
    
NSLayoutConstraint *leading = [NSLayoutConstraint
                                   constraintWithItem:subView
                                   attribute:NSLayoutAttributeLeading
                                   relatedBy:NSLayoutRelationEqual
                                   toItem:parent
                                   attribute:NSLayoutAttributeLeading
                                   multiplier:1.0
                                   constant:10.f];

NSLayoutConstraint *bottom =[NSLayoutConstraint
                                 constraintWithItem:subView
                                 attribute:NSLayoutAttributeBottom
                                 relatedBy:NSLayoutRelationEqual
                                 toItem:parent
                                 attribute:NSLayoutAttributeBottom
                                 multiplier:1.0
                                 constant:0.f];
[parent addConstraint:trailing];
[parent addConstraint:top];
[parent addConstraint:leading];
[parent addConstraint:bottom];
}

Использование внутреннего содержимого

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

основной взгляд на то, как класс может использовать этот

class ImageView: UIView {
    var image: UIImage {
        didSet {
            invalidateIntrinsicContentSize()
        }
    }
    // omitting initializers
    // convenience init(image: UIImage)

    override func intrinsicContentSize() -> CGSize {
        return CGSize(width: image.size.width, height: image.size.height)
    }
}

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

 override func intrinsicContentSize() -> CGSize {
     return CGSize(width: UIViewNoIntrinsicMetric, height: image.size.width)   
 }

Преимущества при использовании с AutoLayout и Interface Builder

Можно было взять этот ImageView (или UIImageView) и установить горизонтальное выравнивание в центр наблюдения X и вертикальное выравнивание к центру наблюдения Y.

Разработчик интерфейса будет жаловаться на вас в этот момент, указав следующее предупреждение:

Именно здесь входит Placeholder Intrinsic Size .

Перейдя в панель инспектора размера и до раскрывающегося списка Intrinsic Size, вы можете переключить это значение с Default на Placeholder.

и теперь построитель интерфейсов удалит предыдущие предупреждения, и вы можете использовать этот размер, чтобы иметь динамически размерные представления, выложенные в построителе интерфейса.

Встряхните взгляд

extension UIView {
    func shake() {
        let animation = CAKeyframeAnimation(keyPath: "transform.translation.x")
        animation.timingFunction = CAMediaTimingFunction(name: kCAMediaTimingFunctionLinear)
        animation.duration = 0.6
        animation.values = [-10.0, 10.0, -7.0, 7.0, -5.0, 5.0, 0.0 ]
        layer.add(animation, forKey: "shake")
    }
}

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