UITabBar background image not showing properly - ios

I made custom UITabBar class and tried to set background image.
tabBar.backgroundImage = UIImage(named: "my_image")?.imageWithRenderingMode(.AlwaysOriginal)
I set the image file name to my_image#2x and image file is 640*98
I run on iPhone6 simulator and it seems the image is not wide enough like
Google's "C" is repeated on sample below
Im I using wrong image size or is something else is wrong?

Just redraw the image:
var image = UIImage(named: "my_image")
if let image = image {
var centerImage: Bool = false
var resizeImage: UIImage?
let size = CGSize(width: UIScreen.mainScreen().bounds.size.width, height: 98)
UIGraphicsBeginImageContextWithOptions(size, false, 0)
if centerImage {
//if you want to center image, use this code
image.drawInRect(CGRect(origin: CGPoint(x: (size.width-image.size.width)/2, y: 0), size: image.size))
}
else {
//stretch image
image.drawInRect(CGRect(origin: CGPoint.zero, size: size))
}
resizeImage = UIGraphicsGetImageFromCurrentImageContext()
UIGraphicsEndImageContext()
tabBar.backgroundImage = resizeImage.imageWithRenderingMode(.AlwaysOriginal)
}

Related

Change the size of UIButton’s imageView

I am working on a subclass of UIButton, let’s call it MyButton. In most cases, buttons of this subclass will have both image and title.
I am having troubles configuring MyButton’s imageView size. The goal is to limit the size of the image, so that larger images are resized and fit into a 32-by-32 square.
For testing purposes, I added a 128-by-128-pixel image, and set imageView’s backgroundColor to green.
Below is what the button looked like when I added the image. Both the imageView and its image had the size of 128 by 128 pixels.
After I overrode MyButton’s intrinsicContentSize with CGSize(width: 160, height: 50) and set the button’s imageView’s contentMode to .scaleAspectFit, the imageView resized, but only in height—it’s still 128 pixels wide, which causes the button’s title to truncate.
I’ve seen a lot of articles on how to resize the image inside the imageView using imageEdgeInsets. This is not what I am looking for since in all those articles the imageView preserves its size and only adds padding around the image.
Changing the imageView’s frame or bounds produces no result.
Any thoughts on how I can resize the button’s imageView?
let customButtonImage = MyButton.currentImage
now you have your button image resize it using #jay's extension for resizing image
let newimage = customButtonImage. resizedImage(size:requiredSize)
Reset image to button
self.setImage(newimage, for: .normal) //normal or what state your want
#jays extension
extension UIImage
{
func resizedImage(Size sizeImage: CGSize) -> UIImage?
{
let frame = CGRect(origin: CGPoint.zero, size: CGSize(width: sizeImage.width, height: sizeImage.height))
UIGraphicsBeginImageContextWithOptions(frame.size, false, 0)
self.draw(in: frame)
let resizedImage: UIImage? = UIGraphicsGetImageFromCurrentImageContext()
UIGraphicsEndImageContext()
self.withRenderingMode(.alwaysOriginal)
return resizedImage
}
}
You can resize the image and then ad to button's image. Below you can find resize image code.
extension UIImage
{
func resizedImage(Size sizeImage: CGSize) -> UIImage?
{
let frame = CGRect(origin: CGPoint.zero, size: CGSize(width: sizeImage.width, height: sizeImage.height))
UIGraphicsBeginImageContextWithOptions(frame.size, false, 0)
self.draw(in: frame)
let resizedImage: UIImage? = UIGraphicsGetImageFromCurrentImageContext()
UIGraphicsEndImageContext()
self.withRenderingMode(.alwaysOriginal)
return resizedImage
}
}
Button ui extension.
#IBInspectable var sizeImage: CGSize {
get {
return self.imageView?.image?.size ?? CGSize.zero
}
set {
if let image = self.imageView?.image {
let imgUpdate = image.resizedImage(Size: newValue)
self.setImage(imgUpdate, for: .normal)
}
}
}

Adding UIImage ignores and resizes UIImageView frame

I'm currently trying to add an image into the navigation item for one view. In the view's viewDidLoad(), a function is called with the following code, similar to this post:
let logo = UIImage(named: "Menu_Logo")
let imageView = UIImageView(frame: CGRect(x: 0, y: 0, width: 122, height: 26))
imageView.contentMode = .scaleAspectFit
imageView.clipsToBounds = true
imageView.image = logo
self.navigationItem.titleView = imageView
Instead of giving me the expected size however, the view ends up looking like this:
Removing the UIImage from the UIImageView makes the view sized correctly like this:
This seems like strange behaviour to me, especially since I did set the content mode to .scaleAspectFit. Is there something I am forgetting regarding adding an UIImageView as the navigationItem.titleView?
On UINavigationBar, title view takes its full size, if content is large.
Resize the image rather than UIImageView as following with passing size (122, 26). This will solve your problem.
func imageResize(sizeChange: CGSize) -> UIImage {
let hasAlpha = true
let scale: CGFloat = 0.0 // Use scale factor of main screen
UIGraphicsBeginImageContextWithOptions(sizeChange, !hasAlpha, scale)
self.draw(in: CGRect(origin: CGPoint.zero, size: sizeChange))
let scaledImage = UIGraphicsGetImageFromCurrentImageContext()
return scaledImage!
}

How to set different size for selectionIndicatorImage

In file AppDelegate I tried to manage my tabBar.
//Customize tabBar
UITabBar.appearance().barTintColor = theme.tabBarBackground
UITabBar.appearance().isTranslucent = false
UITabBar.appearance().selectionIndicatorImage = //need to generate image
On stackoverflow I found extension for UIImage:
public extension UIImage {
public convenience init?(color: UIColor, size: CGSize = CGSize(width: 1, height: 1)) {
let rect = CGRect(origin: .zero, size: size)
UIGraphicsBeginImageContextWithOptions(rect.size, false, 0.0)
color.setFill()
UIRectFill(rect)
let image = UIGraphicsGetImageFromCurrentImageContext()
UIGraphicsEndImageContext()
guard let cgImage = image?.cgImage else { return nil }
self.init(cgImage: cgImage)
}
}
With this extension I can use method: UIImage(color: <#T##UIColor#>, size: <#T##CGSize#>)
So I need to manage CGSize. For that I need to get tabBar in app delegate.
How I can get in and will it be correct to manage tab bar in appdelegate file in viewWillAppear?
P.S. i'm just learning :p

swift ios reduce image size before upload [duplicate]

This question already has answers here:
How do I resize the UIImage to reduce upload image size
(21 answers)
Closed 5 years ago.
I am trying to reduce the file size of my images as much as possible before I upload them. Right now I am doing this:
if let firstImageData = UIImageJPEGRepresentation(pickedImage, 0.1) {
self.imgArray.append(firstImageData)
}
This will take any image coming from the camera or photo album, make it jpg and reduce its size.
I have set the setting to 0.1 but when I upload my images the size still end up around 300-350kb, is there any way I could resize them even more, I am aiming towards 50-70kb
you can resize your image first to smaller size using these extension by resizing it by percent or width
extension UIImage {
func resizeWithPercent(percentage: CGFloat) -> UIImage? {
let imageView = UIImageView(frame: CGRect(origin: .zero, size: CGSize(width: size.width * percentage, height: size.height * percentage)))
imageView.contentMode = .ScaleAspectFit
imageView.image = self
UIGraphicsBeginImageContextWithOptions(imageView.bounds.size, false, scale)
guard let context = UIGraphicsGetCurrentContext() else { return nil }
imageView.layer.renderInContext(context)
guard let result = UIGraphicsGetImageFromCurrentImageContext() else { return nil }
UIGraphicsEndImageContext()
return result
}
func resizeWithWidth(width: CGFloat) -> UIImage? {
let imageView = UIImageView(frame: CGRect(origin: .zero, size: CGSize(width: width, height: CGFloat(ceil(width/size.width * size.height)))))
imageView.contentMode = .ScaleAspectFit
imageView.image = self
UIGraphicsBeginImageContextWithOptions(imageView.bounds.size, false, scale)
guard let context = UIGraphicsGetCurrentContext() else { return nil }
imageView.layer.renderInContext(context)
guard let result = UIGraphicsGetImageFromCurrentImageContext() else { return nil }
UIGraphicsEndImageContext()
return result
}
}
to use it just call it like this
myImage = myImage.resizeWithWidth(700)!
Now next you can still compress it using compression ratio of your choice
let compressData = UIImageJPEGRepresentation(myImage, 0.5) //max value is 1.0 and minimum is 0.0
let compressedImage = UIImage(data: compressData!)
You only can change size of image (less size = less data) and compress it by using image compression algorithms like JPEG, there is no other way (better algorythm = less size in same quality).
I heard google improved JPEG algorithm using neural networks lately (Google’s TensorFlow)

How to position image view on top of a photo correctly using Swift

Currently I am able to save the photo with an image on top, however the top image is not located at the coordinate it is when appearing on the screen in a preview view.
fileprivate func mergeUIViews( ) -> UIImage?
{
let bottomImage = photo
let topImage = uiViewInstance.image
let bottomImageHeight = bottomImage.size.height
let bottomImageWidth = bottomImage.size.width
let topImageHeight = uiViewInstance.frame.height
let topImageWidth = uiViewInstance.frame.width
let topImageOrigin = uiViewInstance.frame.origin
let bottomImageSize = CGSize(width: bottomImageWidth, height: bottomImageHeight)
let topImageSize = CGSize(width: topImageWidth, height: topImageHeight)
// Merge images
UIGraphicsBeginImageContextWithOptions(bottomImageSize, false, 0.0)
bottomImage.draw(in: CGRect(origin: CGPoint.zero, size: bottomImageSize))
topImage .draw(in: CGRect(origin: topImageOrigin, size: topImageSize)) // Where I believe the problem exists
let newImage = UIGraphicsGetImageFromCurrentImageContext()
UIGraphicsEndImageContext()
return newImage
}
What works instead of using the actual captured photo's size, is setting the photo size to the view of the view controllers size. This resulted in the desired output of the entire screen showing the merged photos and the proper point for the origin of the overlaid image.
fileprivate func mergeUIViews( ) -> UIImage?
{
let bottomImage = photo
let topImage = uiViewInstance.image
let bottomImageSize = self.view.frame.size
let topImageHeight = uiViewInstance.frame.height
let topImageWidth = uiViewInstance.frame.width
let topImageOrigin = uiViewInstance.frame.origin
let topImageSize = uiViewInstance.frame.size
// Merge images
UIGraphicsBeginImageContextWithOptions(bottomImageSize, false, 0.0)
bottomImage.draw(in: CGRect(origin: CGPoint.zero, size: bottomImageSize))
topImage .draw(in: CGRect(origin: topImageOrigin, size: topImageSize)) // Where I believe the problem exists
let newImage = UIGraphicsGetImageFromCurrentImageContext()
UIGraphicsEndImageContext()
return newImage
}

Resources