Я пытаюсь сделать изображение UIView для моего фона в swift с использованием изображения шаблона. Код, который у меня есть, хорошо работает, за исключением того, что я хочу, чтобы изображение занимало весь экран. Мой код выглядит так: self.view.backgroundColor = UIColor(patternImage: UIImage(named: "backgroundImage")!)
Кто-нибудь знает, как сделать фоновое изображение, которое будет занимать весь экран, и будет масштабироваться при появлении на разных размерах экрана iPhone?
Я опубликовал этот ответ со своего старого аккаунта (который больше не поддерживается для меня, и я больше не могу к нему обращаться), это мой улучшенный ответ.
Вы можете сделать это программно вместо создания IBOutlet в каждом представлении. просто создайте расширение UIView (Файл → Создать → Файл → Файл Swift → назовите его как хотите) и добавьте:
extension UIView {
func addBackground() {
// screen width and height:
let width = UIScreen.mainScreen().bounds.size.width
let height = UIScreen.mainScreen().bounds.size.height
let imageViewBackground = UIImageView(frame: CGRectMake(0, 0, width, height))
imageViewBackground.image = UIImage(named: "YOUR IMAGE NAME GOES HERE")
// you can change the content mode:
imageViewBackground.contentMode = UIViewContentMode.ScaleAspectFill
self.addSubview(imageViewBackground)
self.sendSubviewToBack(imageViewBackground)
}}
Теперь вы можете использовать этот метод со своими представлениями, например:
override func viewDidLoad() {
super.viewDidLoad()
self.view.addBackground()
}
Просто добавьте свой UIImageView, расположенный центрированный и со всеми краями, привязанными к краям. Оставьте это там и нажмите на правый нижний угол, как показано ниже, и теперь добавьте 4 ограничения в верхний, нижний, левый и правый края.
Теперь просто выберите вид изображения и с помощью инспектора IB выберите, как вам понравится ваше изображение: заполнить или поместиться, как вы можете видеть ниже:
Это обновленный ответ моего предыдущего.
Как и в предыдущем подходе, вы можете создать расширение UIView и добавить к addBackground() метод addBackground() следующим образом:
Помните: если вы добавляете его в новый файл .swift, не забудьте добавить import UIKit
extension UIView {
func addBackground(imageName: String = "YOUR DEFAULT IMAGE NAME", contentMode: UIView.ContentMode = .scaleToFill) {
// setup the UIImageView
let backgroundImageView = UIImageView(frame: UIScreen.main.bounds)
backgroundImageView.image = UIImage(named: imageName)
backgroundImageView.contentMode = contentMode
backgroundImageView.translatesAutoresizingMaskIntoConstraints = false
addSubview(backgroundImageView)
sendSubviewToBack(backgroundImageView)
// adding NSLayoutConstraints
let leadingConstraint = NSLayoutConstraint(item: backgroundImageView, attribute: .leading, relatedBy: .equal, toItem: self, attribute: .leading, multiplier: 1.0, constant: 0.0)
let trailingConstraint = NSLayoutConstraint(item: backgroundImageView, attribute: .trailing, relatedBy: .equal, toItem: self, attribute: .trailing, multiplier: 1.0, constant: 0.0)
let topConstraint = NSLayoutConstraint(item: backgroundImageView, attribute: .top, relatedBy: .equal, toItem: self, attribute: .top, multiplier: 1.0, constant: 0.0)
let bottomConstraint = NSLayoutConstraint(item: backgroundImageView, attribute: .bottom, relatedBy: .equal, toItem: self, attribute: .bottom, multiplier: 1.0, constant: 0.0)
NSLayoutConstraint.activate([leadingConstraint, trailingConstraint, topConstraint, bottomConstraint])
}
}
Обратите внимание, что обновления для этого ответа:
Использование:
Предполагая, что вы хотите вызвать его в viewDidLoad():
override func viewDidLoad() {
//...
// you can call 4 versions of addBackground() method
// 1- this will add it with the default imageName and default contextMode
view.addBackground()
// 2- this will add it with the edited imageName and default contextMode
view.addBackground(imageName: "NEW IMAGE NAME")
// 3- this will add it with the default imageName and edited contextMode
view.addBackground(contentMode: .scaleAspectFit)
// 4- this will add it with the default imageName and edited contextMode
view.addBackground(imageName: "NEW IMAGE NAME", contextMode: .scaleAspectFit)
}
Используется PureLayout. Вы можете просто использовать AutoLayout с несколькими строками.
UIImageView* imgView = UIImageView(image: myUIImage)
imgView.setTranslatesAutoresizingMaskIntoConstraints(false)
self.view.addSubview(imgView)
self.view.addConstraints(imgView.autoPinEdgesToSuperviewEdgesWithInsets(UIEdgeInsetsMake(0,0,0,0))
Вот ваши варианты масштабирования!
Для свойства .contentMode:
ScaleToFill Это позволит масштабировать изображение внутри изображения, чтобы заполнить все границы изображения.
ScaleAspectFit Это позволит убедиться, что изображение внутри изображения будет иметь правильное соотношение сторон и соответствовать границам изображений.
ScaleAspectFill Это позволит убедиться, что изображение внутри изображения будет иметь правильное соотношение сторон и заполнить все границы изображения. Чтобы это значение работало правильно, убедитесь, что вы установили для свойства clipsToBounds изображения в true.
class SecondViewController : UIViewController {
let backgroundImage = UIImage(named: "centralPark")
var imageView: UIImageView!
override func viewDidLoad() {
super.viewDidLoad()
self.thirdChoiceField.delegate = self
self.datePicker.minimumDate = NSDate()
imageView = UIImageView(frame: view.bounds)
imageView.contentMode = .ScaleAspectFill
imageView.clipsToBounds = true
imageView.image = backgroundImage
imageView.center = view.center
view.addSubview(imageView)
self.view.sendSubviewToBack(imageView)
Я использовал ограничения, чтобы сделать изображение "autoLayout". Я сделал вид, чтобы показать индикатор активности (с полным фоновым изображением), в то время как просмотр по segue загружается. Код выглядит следующим образом.
var containerView: UIView = UIView()
var actionIndicator: UIActivityIndicatorView = UIActivityIndicatorView()
private func showActivityIndicator() {
///first I set the containerView and the background image
containerView.translatesAutoresizingMaskIntoConstraints = false
self.view.addSubview(containerView)
adjustConstFullSize(containerView, parentView: self.view)
let backImage = UIImageView(image: UIImage(named: "AppBackImage"))
backImage.contentMode = UIViewContentMode.ScaleAspectFill
backImage.translatesAutoresizingMaskIntoConstraints = false
containerView.addSubview(backImage)
adjustConstFullSize(backImage, parentView: containerView)
////setting the spinner (activity indicator)
actionIndicator.frame = CGRectMake(0.0, 0.0, 40.0, 40.0)
actionIndicator.center = CGPointMake(containerView.bounds.size.width / 2, containerView.bounds.size.height / 2)
actionIndicator.hidesWhenStopped = true
actionIndicator.activityIndicatorViewStyle = UIActivityIndicatorViewStyle.WhiteLarge
containerView.insertSubview(actionIndicator, aboveSubview: backImage)
///throw the container to the main view
view.addSubview(containerView)
actionIndicator.startAnimating()
}
Это код для функции "adjustConstFullSize".
func adjustConstFullSize(adjustedView: UIView!, parentView: UIView!) {
let topConstraint = NSLayoutConstraint(item: adjustedView,
attribute: .Top,
relatedBy: .Equal,
toItem: parentView,
attribute: .Top,
multiplier: 1.0,
constant: 0.0)
let leftConstraint = NSLayoutConstraint(item: adjustedView,
attribute: .Leading,
relatedBy: .Equal,
toItem: parentView,
attribute: .Leading,
multiplier: 1.0,
constant: 0.0)
let rightConstraint = NSLayoutConstraint(item: adjustedView,
attribute: .Trailing,
relatedBy: .Equal,
toItem: parentView,
attribute: .Trailing,
multiplier: 1.0,
constant: 0.0)
let bottomConstraint = NSLayoutConstraint(item: adjustedView,
attribute: .Bottom,
relatedBy: .Equal,
toItem: parentView,
attribute: .Bottom,
multiplier: 1.0,
constant: 0.0)
parentView.addConstraints([topConstraint, leftConstraint, rightConstraint, bottomConstraint])
}
В приведенной выше функции я "привязал" ограничения контейнера к ограничениям основного вида, сделав представление "полным размером". Я сделал то же самое для UIImageView, а также установил contentMode в AspectFill - это важно, потому что мы хотим, чтобы изображение заполняло контент без растягивания.
Чтобы удалить представление, после ленивой загрузки просто используйте код ниже.
private func hideActivityIndicator() {
actionIndicator.stopAnimating()
containerView.removeFromSuperview()
}
Решение Ahmad Fayyas в Swift 3.0:
func addBackground() {
let width = UIScreen.main.bounds.size.width
let height = UIScreen.main.bounds.size.height
let imageViewBackground = UIImageView(frame: CGRect(x:0, y:0, width: width, height: height))
imageViewBackground.image = UIImage(named: "YOUR IMAGE NAME GOES HERE")
// you can change the content mode:
imageViewBackground.contentMode = UIViewContentMode.scaleAspectFill
self.view.addSubview(imageViewBackground)
self.view.sendSubview(toBack: imageViewBackground)
}
Для этого, я думаю, вам нужно создать UIImageView, прикрепленный к родительским представлениям top/bottom/left/right. Это приведет к тому, что UIImageView всегда будет соответствовать размеру дисплея. Просто убедитесь, что вы установили режим содержимого в представлении изображения как AspectFit
var newImgThumb : UIImageView
newImgThumb = UIImageView(view.bounds)
newImgThumb.contentMode = .ScaleAspectFit
view.addSubview(newImgThumb)
//Don't forget this line
newImgThumb.setTranslatesAutoresizingMaskIntoConstraints(false)
NSDictionary *views =NSDictionaryOfVariableBindings(newImgThumb);
// imageview fills the width of its superview
[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"|[newImgThumb]|" options:0 metrics:metrics views:views]];
// imageview fills the height of its superview
[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|[newImgThumb]|" options:0 metrics:metrics views:views]];
`
CGRect screenRect = [[UIScreen mainScreen] bounds];
CGFloat screenWidth = screenRect.size.width;
CGFloat screenHeight = screenRect.size.height;
_imgBackGround.frame = CGRectMake(0, 0, screenWidth, screenHeight);`