I have a UITabBar of which I want to change the background color of the middle item, but I can't figure out how! (I want to keep the rest of the bar the dark grey color it is).
let barTintColor = UIColor(red: 54/255, green: 54/255, blue: 54/255, alpha: 1.0)
UITabBar.appearance().barTintColor = barTintColor
You can do this by inserting a new subview to your TabBar.
Please check out this answer:
// Add background color to middle tabBarItem
let itemIndex = 2
let bgColor = UIColor(red: 0.08, green: 0.726, blue: 0.702, alpha: 1.0)
let itemWidth = tabBar.frame.width / CGFloat(tabBar.items!.count)
let bgView = UIView(frame: CGRectMake(itemWidth * itemIndex, 0, itemWidth, tabBar.frame.height))
bgView.backgroundColor = bgColor
tabBar.insertSubview(bgView, atIndex: 0)
Hope it helps.
Edit:
If you want to change the background image rather than background color, all you have to do is change the line :
bgView.backgroundColor = bgColor
to imageView with image as background, then add it as a subview. It may look like this:
backgroundView = UIImageView(image: UIImage(named: "tabBarImage"))
bgView.addSubview(backgroundView)
Related
I have a floating button in my app that display 5 different buttons. Each of them has a color but initially are gray. When the user selects one of the buttons, all of them hide, and when the user taps again on the floating button, the button that was previously tapped is not gray but with its proper color.
Also the logic would be that the user can tap another one of the buttons to select it, and the previous one would be unselected, as if the user taps on a selected button, it gets unselected.
I'm using cocoa pods for the Floating Button, JJFloatingActionButton, but on the documentation there is no info about this.
func configureActionButton() {
actionButton.overlayView.backgroundColor = UIColor(white: 0, alpha: 0.5)
actionButton.buttonImage = UIImage(systemName: "line.horizontal.3.decrease")
actionButton.buttonColor = UIColor(named: "signoColor")!
actionButton.buttonImageColor = .white
actionButton.buttonImageSize = CGSize(width: 30, height: 30)
actionButton.itemAnimationConfiguration = .slideIn(withInterItemSpacing: 14)
actionButton.itemSizeRatio = CGFloat(0.75)
let item = actionButton.addItem()
item.titleLabel.text = "Button 1"
item.buttonColor = UIColor(red: 254/255.0, green: 224/255.0, blue: 255/255.0, alpha: 1.0)
item.buttonImageColor = UIColor(red: 200/255.0, green: 73/255.0, blue: 203/255.0, alpha: 1.0)
item.imageSize = CGSize(width: 30, height: 30)
item.action = { item in
//This is for the functionality of the button
}
let item2 = actionButton.addItem()
item2.titleLabel.text = "Button 2"
item2.buttonColor = UIColor(red: 254/255.0, green: 224/255.0, blue: 255/255.0, alpha: 1.0)
item2.buttonImageColor = UIColor(red: 200/255.0, green: 73/255.0, blue: 203/255.0, alpha: 1.0)
item2.imageSize = CGSize(width: 30, height: 30)
item2.action = { item in
//This is for the functionality of the button
}
//And I have 3 more buttons
}
This is how the floating button looks like:
I would appreciate some help. I've searched for similar questions but none of them solved this problem. Thank you!
I'm trying to show a subview that has been added to a view, but it does not show up when the button is pressed.
I have tried setting isOpaque to 1, alpha to 1, isHidden to false (without needing to press the button) and have checked that I have run view.addSubview(). I have also found out that the subview is not hidden at all but the background is white (it is supposed to be blue or red).
code to add subviews
//setup
viewBGKRect = CGRect(x: 20, y: 20, width: 984, height: 660)
viewBGK = UIView(frame: viewBGKRect)
viewBGK.backgroundColor = UIColor(red: 139.0, green: 206.0, blue: 231.0, alpha: 1.0)
viewBGK.alpha = 1
viewBGK.isOpaque = true
viewRGKRect = CGRect(x: 20, y: 20, width: 984, height: 660)
viewRGK = UIView(frame: viewRGKRect)
viewRGK.backgroundColor = UIColor(red: 240.0, green: 177.0, blue: 187.0, alpha: 1.0)
viewRGK.alpha = 1
viewRGK.isOpaque = true
//isHidden is set to false when the buttons are pressed
viewBGK.isHidden = true
viewRGK.isHidden = true
view.addSubview(viewBGK)
view.addSubview(viewRGK)
code to show subviews
#IBAction func goalkeeper(_ sender: UIButton) {
switch sender.tag {
case 0:
// blue
viewBGK.isHidden = false
viewRGK.isHidden = true
return
default:
viewBGK.isHidden = true
viewRGK.isHidden = false
return
}
}
I expect a blue/red rectangle to appear at the top of the screen but it does not show.
Nevermind I found the answer:
UIColor RGB is from 0-1 not 0-255 the colors should be
(blue)
UIColor(red:0.55, green:0.81, blue:0.91, alpha:1.0)
and
(red)
UIColor(red:0.94, green:0.69, blue:0.73, alpha:1.0)
not
(blue)
UIColor(red: 139.0, green: 206.0, blue: 231.0, alpha: 1.0)
and
(red)
UIColor(red: 240.0, green: 177.0, blue: 187.0, alpha: 1.0)
i feel really dumb now.
If you're going to utilize custom colors, it might be easier to declare them somewhere other than in a view controller. One approach would be to declare them in an extension. To do this, you would do the following:
Create a new Swift file and name it UIColor+Extension.swift
Inside the new file, add the following code:
extension UIColor {
static var customBlue: UIColor {
return #colorLiteral(red: 0.5450980392, green: 0.8078431373, blue: 0.9058823529, alpha: 1)
}
static var customRed: UIColor {
return #colorLiteral(red: 0.9411764706, green: 0.6941176471, blue: 0.7333333333, alpha: 1)
}
}
I didn't type those colors out. I simply typed return Color Literal and it showed a white rounded rectangle. When I clicked on the rectangle, I saw this:
Then, I clicked the "Other" button and I typed in the RGB values:
Lastly, you want to avoid writing repetitive code (DRY = don't repeat yourself). Here's the updated code:
//setup
viewBGKRect = CGRect(x: 20, y: 20, width: 984, height: 660)
viewBGK = UIView(frame: viewBGKRect)
viewBGK.backgroundColor = .customBlue
viewRGKRect = CGRect(x: 20, y: 20, width: 984, height: 660)
viewRGK = UIView(frame: viewRGKRect)
viewRGK.backgroundColor = .customRed
[viewBGK, viewRGK].forEach { view in
view.alpha = 1
view.isOpaque = true
//isHidden is set to false when the buttons are pressed
view.isHidden = true
}
Here is my image:
And this is my code:
cell.itemImage.layer.borderWidth = 1.0
cell.itemImage.contentMode = .scaleAspectFill
cell.itemImage.layer.cornerRadius = 10
cell.itemImage.layer.masksToBounds = true
cell.itemImage.layer.borderColor = UIColor.white.cgColor
cell.itemImage.backgroundColor = #colorLiteral(red: 0.8831475377, green: 0, blue: 0.1722375751, alpha: 1)
I just want to fill the photo to the assigned height and width of the image and just have a simple corner radius. But apparently for me it's not working.
I have a view with a UICollectionView (with scroll enabled).
I would like that, when I click on a button, there is a black overlay shown behind a menu.It would be better with a picture:
The problem is that this overlay is not covering all the background when I scroll down.
When the scroll is up, it's perfect, but when scroll down we can see the limit of the subview.
This is my code:
let width = UIScreen.main.bounds.height
let height = UIScreen.main.bounds.height
overlay = UIView(frame: CGRect(x: 0, y: 0, width: width, height: height))
overlay.backgroundColor = UIColor(red: 0/255, green: 0/255, blue: 0/255, alpha: 0.3)
overlay.layer.zPosition = 1
// AND WHEN THE BUTTON IS PRESSED
// self.collectionView.addSubview(overlay)``
How could I correct this problem ?
I want to set the status bar color the same color as the navigation bar. when I try to set the navigation and status bar to the same color the navigation bar always appear in a lighter color than the status bar.
This is what I want:
My result:
Code in AppDelegate:
Status bar:
UIApplication.sharedApplication().statusBarStyle = .Default
let statusBar: UIView = UIApplication.sharedApplication().valueForKey("statusBar") as! UIView
if statusBar.respondsToSelector(Selector("setBackgroundColor:"))
{
statusBar.backgroundColor = UIColor(red: 43/255.0, green: 79/255.0, blue: 133/255.0, alpha: 1.0)
statusBar.tintColor = UIColor(red: 43/255.0, green: 79/255.0, blue: 133/255.0, alpha: 1.0)
}
Navigation bar:
UINavigationBar.appearance().titleTextAttributes = [NSForegroundColorAttributeName: UIColor.whiteColor()]
UINavigationBar.appearance().backgroundColor = UIColor(red: 43/255.0, green: 79/255.0, blue: 133/255.0, alpha: 1.0)
UINavigationBar.appearance().tintColor = UIColor.whiteColor()
UIApplication.sharedApplication().statusBarHidden = false
UIApplication.sharedApplication().statusBarStyle = .Default
Could anyone give me any suggestion on how to solve this problem.
Thanks in advance!
Warning! Do not do any of this in iOS 13 or later, and definitely not in iOS 15 or later. This is outdated code from long ago!
I was able to get the desired result:
Here's the code I used (Swift 3):
let app = UINavigationBar.appearance()
// nav bar color => your color
app.barTintColor = UIColor(red: 43/255.0, green: 79/255.0, blue: 133/255.0, alpha: 1.0)
app.isTranslucent = false
// status bar text => white
app.barStyle = .black
// nav bar elements color => white
app.tintColor = .white
app.titleTextAttributes = [NSForegroundColorAttributeName:UIColor.white]
This line in your code is illegal and will likely get your app banned from the App Store:
let statusBar: UIView = UIApplication.sharedApplication().valueForKey("statusBar") as! UIView
For the status bar, its color in iOS these days is clear. There is no need to set its color, and you are not supposed to do so. The navigation bar is extended up behind the status bar, and thus they will always have the same color because what you are seeing is always the same interface object, the navigation bar.
As for setting the navigation bar's color, don't forget that it is translucent by default. You cannot set its color accurately without making it opaque. Also, you should not be setting its backgroundColor. You should either set its barTintColor or else give it a background image (that is the way to get the best control over its color).
For me the key was to change the isTranslucent attribute:
navigationBar.isTranslucent = false
navigationBar.barTintColor = PlateColors.mainRed
navigationBar.backgroundColor = PlateColors.mainRed
To achieve the desired result, set the status bar style to default and set the UINavigationBar.appearance().barTintColor to the required color.
UINavigationBar.appearance().titleTextAttributes = [NSForegroundColorAttributeName: UIColor.whiteColor()]
UINavigationBar.appearance().barTintColor = UIColor(red: 43/255.0, green: 79/255.0, blue: 133/255.0, alpha: 1.0)
UIApplication.sharedApplication().statusBarStyle = .Default
based on #matt suggestion to extend navigationbar below status bar, navigation bar must be opaque:
let navigationBar = navigationController?.navigationBar
navigationBar?.isOpaque = true
navigationBar?.setBackgroundImage(UIImage(color: UIColor(white: 0, alpha: 0.5)), for: .default)
navigationBar?.shadowImage = UIImage()
extension UIImage {
convenience init?(color: UIColor) {
let rect = CGRect(x: 0.0, y: 0.0, width: 1.0, height: 1.0)
UIGraphicsBeginImageContext(rect.size)
let context = UIGraphicsGetCurrentContext()
context?.setFillColor(color.cgColor)
context?.fill(rect)
let image: UIImage? = UIGraphicsGetImageFromCurrentImageContext()
UIGraphicsEndImageContext()
guard let cgImage = image?.cgImage else { return nil }
self.init(cgImage: cgImage)
}
}
For anyone who ended up here a little later, like myself (Xcode 13.1, iOS 15.1), this may help:
In iOS13 the status bar background colour is different from the navigation bar in large text mode
It's all about defining the appearances for both standardAppearance and scrollEdgeAppearance and setting their respective background colors.
Personally, did not even need to solve this programmatically:
Navigation Bar Attributes
I have encountered the same problem and I have found that it is not the problem of the status bar but the navigation bar. If you set the background color of navigation bar and a simple UIView to the same, the real color shown will be different. To make the color of navigation bar same as another view:
Wrong Code
navigationBar.backgroundColor = .blue
view.backgroundColor = .blue
Right Code
navigationBar.isTranslucent = false
navigationBar.barTintColor = .blue
view.backgroundColor = .blue
In this case, their color will be the same.