How To Fix Image Not Showing Error For Swift Button

When you use UIKit.UIButton class’s setImage method to set swift button’s icon image, if the image is not icon format, it will display a pure blue color rectangle instead of the image. You can fix this error by convert the image to an icon format image. But you can also fix this error by set the UIImage object’s rendering mode to draw the original image always. This article will tell you how to do it.

set none icon format image by swift button setimage method

1. UIImage Rendering Mode.

Swift UIImage class has a method withRenderingMode, when you call this method, you need to pass a parameter to specify the image rendering mode. Then it will return a new UIImage object with the specified rendering mode.

UIImage.RenderingMode class provide all the image rendering mode value, they are.

  1. alwaysOriginal : This rendering mode will always draw the original image.
  2. alwaysTemplate : Treat the image as a template, and the image color information will be ignored.
  3. automatic : Use the image context default rendering mode.

To fix this error is very easy, you just need to set the UIImage object’s rendering mode to RenderingMode.alwaysOriginal.

// First create a UIImage object with added image file.
var iconImage:UIImage = UIImage(named: "color apple.png")!
......
// Change UIImage rendering mode to alwaysOriginal, then it will always draw the original image on the button. 
iconImage = iconImage.withRenderingMode(UIImage.RenderingMode.alwaysOriginal)


2. Draw Original Button Image Example.

First let us look at the example picture as below, you will find it show the original image in the button.

after set button image rendering mode to always original

Below is the ViewController.swift file source code. This example only need to edit this file.

//
//  ViewController.swift
//  SwiftReserveImageColorExample
//
//  Created by song zhao on 7/12/19.
//  Copyright © 2019 dev2qa.com. All rights reserved.
//

import UIKit

class ViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()
        
        // Get screen width and height.
        let screenWidth = UIScreen.main.bounds.width
        //let screenHeight = UIScreen.main.bounds.height
        
        // Create a UIImage object use added image file.
        var iconImage:UIImage = UIImage(named: "color apple.png")!
        
        // Get image height value.
        let iconImageHeight = iconImage.size.height
        
        // Change the image rendering mode to always draw original image. Then it will draw the original image for the button to replace the pure blue rectangle.
        iconImage = iconImage.withRenderingMode(UIImage.RenderingMode.alwaysOriginal)
        
        // Create a system default type button object.
        let btn:UIButton = UIButton(type: UIButton.ButtonType.system)
        
        // Set above UIImage object as the button normal state image.
        btn.setImage(iconImage, for: UIControl.State.normal)
        
        // Set button frame size, the button's width is screen_width - 10, the button's height is image_height - 10.
        btn.frame = CGRect(x: 10,y: 10,width: screenWidth - 10, height: iconImageHeight + 10)
        
        // Set button background color to green.
        btn.backgroundColor = UIColor.green
        
        // Set button normal state title text.
        btn.setTitle("This is a button", for: UIControl.State.normal)
        
        // Set button border color.
        btn.layer.borderColor = UIColor.blue.cgColor
        
        // Set button border width.
        btn.layer.borderWidth = 3
        
        // Set button border rounded corner radius.
        btn.layer.cornerRadius = 15
        
        // Set button center point position. The button's center point is screen center point.
        btn.center = CGPoint(x: UIScreen.main.bounds.width/2, y: UIScreen.main.bounds.height/2)
        
        // Add the button to main screen.
        self.view.addSubview(btn)
        
    }


}

Reference

  1. How To Set An Image As Swift Button Icon, Background Color And Background Image Example
READ :   How To Fix Xcode Not Automatically Creating Bridging Header File Issue

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.