I want to give the option to change the background of my app.
Everything is working fine when I want to change the background colour only. But I have to use a background image.
I am using the code below for that
import UIKit
class ContainerController: UIViewController {
var isRaindrops = false
var Background:String = "UIImage(named: \"Background\")"
override func viewDidLoad() {
super.viewDidLoad()
BackgroundSwitch()
self.view.backgroundColor = .white
}
func BackgroundSwitch() {
let items = ["Gradient", "Raindrops"]
let segmentedControl = UISegmentedControl(items: items)
segmentedControl.translatesAutoresizingMaskIntoConstraints = false
segmentedControl.frame = CGRect(x: 20, y: self.view.frame.height * 0.2 + 50, width: self.view.frame.width - 40, height: 40)
segmentedControl.selectedSegmentIndex = 0
segmentedControl.tintColor = UIColor.black
segmentedControl.addTarget(self, action: #selector(segmentedControlInAction(sender:)), for: UIControl.Event.valueChanged)
self.view.addSubview(segmentedControl)
}
#objc func segmentedControlInAction(sender:UISegmentedControl) {
let index = sender.selectedSegmentIndex
switch index {
case 0:
print("Gradient")
Background = "Background"
print(Background)
// self.view.backgroundColor = .red
BackgroundSetup()
case 1:
(print("Raindrops"))
Background = "Raindrops"
print(Background)
// self.view.backgroundColor = .blue
BackgroundSetup()
default:
print("default")
break
}
}
func BackgroundSetup() {
let backgroundImage = UIImageView(frame: UIScreen.main.bounds)
backgroundImage.image = UIImage(named: Background)
self.view.insertSubview(backgroundImage, at: 0)
// self.view.backgroundColor = Background
}
}
With the code that I have at the moment, the background is only changing when I hit the "Raindrops" field for the first time.
I have a segmented tableview which I use both case switch and if like below.
if sender.selectedSegmentIndex == 0
{
print("Gradient")
Background = "Background"
print(Background)
BackgroundSetup()
}
if sender.selectedSegmentIndex == 1
{
(print("Raindrops"))
Background = "Raindrops"
print(Background)
BackgroundSetup()
}
Related
I'm looking to create a view with these buttons. There is a background animation when one of the button touched.
Not sure how to do this.
Is custom segmented buttons the way to go?
I went with custom control
import UIKit
protocol MSegmentedControlDelegate:AnyObject {
func segSelectedIndexChange(to index:Int)
}
class MSegmentedControl: UIControl {
private var buttonTitles:[String]!
private var buttons: [UIButton]!
private var selectorView: UIView!
var textColor:UIColor = .black
var selectorViewColor: UIColor = .white
var selectorTextColor: UIColor = .red
weak var delegate:MSegmentedControlDelegate?
public private(set) var selectedIndex : Int = 0
convenience init(frame:CGRect,buttonTitle:[String]) {
self.init(frame: frame)
self.buttonTitles = buttonTitle
}
override func draw(_ rect: CGRect) {
super.draw(rect)
self.backgroundColor = UIColor.white
updateView()
}
func setButtonTitles(buttonTitles:[String]) {
self.buttonTitles = buttonTitles
self.updateView()
}
func setIndex(index:Int) {
buttons.forEach({ $0.setTitleColor(textColor, for: .normal) })
let button = buttons[index]
selectedIndex = index
button.setTitleColor(selectorTextColor, for: .normal)
let selectorPosition = frame.width/CGFloat(buttonTitles.count) * CGFloat(index)
UIView.animate(withDuration: 0.2) {
self.selectorView.frame.origin.x = selectorPosition
}
}
#objc func buttonAction(sender:UIButton) {
for (buttonIndex, btn) in buttons.enumerated() {
btn.setTitleColor(textColor, for: .normal)
if btn == sender {
let selectorPosition = frame.width/CGFloat(buttonTitles.count) * CGFloat(buttonIndex)
selectedIndex = buttonIndex
delegate?.segSelectedIndexChange(to: selectedIndex)
UIView.animate(withDuration: 0.3) {
self.selectorView.frame.origin.x = selectorPosition
}
btn.setTitleColor(selectorTextColor, for: .normal)
}
}
}
}
//Configuration View
extension MSegmentedControl {
private func updateView() {
createButton()
configSelectorView()
configStackView()
}
private func configStackView() {
let stack = UIStackView(arrangedSubviews: buttons)
stack.axis = .horizontal
stack.alignment = .fill
stack.distribution = .fillEqually
addSubview(stack)
stack.translatesAutoresizingMaskIntoConstraints = false
stack.topAnchor.constraint(equalTo: self.topAnchor).isActive = true
stack.bottomAnchor.constraint(equalTo: self.bottomAnchor).isActive = true
stack.leftAnchor.constraint(equalTo: self.leftAnchor).isActive = true
stack.rightAnchor.constraint(equalTo: self.rightAnchor).isActive = true
}
private func configSelectorView() {
let selectorWidth = frame.width / CGFloat(self.buttonTitles.count)
selectorView = UIView(frame: CGRect(x: 0, y: 8, width: selectorWidth, height: 32))
selectorView.backgroundColor = selectorViewColor
selectorView.layer.cornerRadius = 16
selectorView.layer.opacity = 0.5
addSubview(selectorView)
}
private func createButton() {
buttons = [UIButton]()
buttons.removeAll()
subviews.forEach({$0.removeFromSuperview()})
for buttonTitle in buttonTitles {
let button = UIButton(type: .system)
button.setTitle(buttonTitle, for: .normal)
button.addTarget(self, action:#selector(MSegmentedControl.buttonAction(sender:)), for: .touchUpInside)
button.setTitleColor(textColor, for: .normal)
button.titleLabel?.font = UIFont.systemFont(ofSize: 16, weight: .semibold)
buttons.append(button)
}
buttons[0].setTitleColor(selectorTextColor, for: .normal)
}
}
Usage:
private let segControl: MSegmentedControl = {
let segControl = MSegmentedControl(
frame: CGRect(x: 0, y: 240, width: 280, height: 50),
buttonTitle: ["Average","Total","Pending"])
segControl.textColor = M.Colors.greyWhite
segControl.selectorTextColor = .white
return segControl
}()
To access index change event:
Implement the delegate on parent view:
addSubview(segControl)
segControl.delegate = self
Delegate:
func segSelectedIndexChange(to index: Int) {
switch index {
case 0: print("Average")
case 1: print("Total")
case 2: print("Pending")
default: break
}
}
Result:
here is the code that I check if they images are tapped but only the 3 image is apply full screen. As you can see I set the image is tapped to statusImageView to call the function of zoomImage So I want fixed for all images.
func imageTapped() {
let tapGestureRecognizer = UITapGestureRecognizer(target: self, action: #selector(imageZoom(tapGestureRecognizer:)))
if detailsImage[0].tag == 0 {
detailsImage[0].isUserInteractionEnabled = true
detailsImage[0].addGestureRecognizer(tapGestureRecognizer)
self.statusImageView = detailsImage[0]
}
let tapGestureRecognizer1 = UITapGestureRecognizer(target: self, action: #selector(imageZoom(tapGestureRecognizer:)))
detailsImage[1].isUserInteractionEnabled = true
detailsImage[1].addGestureRecognizer(tapGestureRecognizer1)
self.statusImageView = detailsImage[1]
let tapGestureRecognizer2 = UITapGestureRecognizer(target: self, action: #selector(imageZoom(tapGestureRecognizer:)))
detailsImage[2].isUserInteractionEnabled = true
detailsImage[2].addGestureRecognizer(tapGestureRecognizer2)
self.statusImageView = detailsImage[2]
}
let blackBackgroundColor = UIView()
let tappedImage = UIImageView()
var statusImageView: UIImageView?
let navigationBarView = UIView()
#objc func imageZoom(tapGestureRecognizer: UITapGestureRecognizer) {
annimationImage(detailsImage: statusImageView!)
}
And then I call the annihilationImage function which is takes the statusImageView as input
func annimationImage(detailsImage: UIImageView) {
if let startingFrame = statusImageView?.superview?.convert(statusImageView!.frame, to: nil) {
statusImageView!.alpha = 0
blackBackgroundColor.frame = self.view.frame
blackBackgroundColor.backgroundColor = UIColor.black
blackBackgroundColor.alpha = 0
view.addSubview(blackBackgroundColor)
navigationBarView.frame = CGRect(x: 0, y: 0, width: 1000, height: 100)
navigationBarView.backgroundColor = UIColor.black
navigationBarView.alpha = 0
if let keyWindow = UIApplication.shared.keyWindow {
keyWindow.addSubview(navigationBarView)
}
let tappedImage = UIImageView()
tappedImage.backgroundColor = .gray
tappedImage.frame = startingFrame
tappedImage.contentMode = .scaleToFill
tappedImage.isUserInteractionEnabled = true
tappedImage.image = statusImageView?.image
tappedImage.clipsToBounds = true
view.addSubview(tappedImage)
UIView.animate(withDuration: 0.75, animations: {
tappedImage.frame = CGRect(x: 0, y: y, width: self.view.frame.size.width, height: 300)
})
}
}
I want to make an if statement that while check which image is tapped
You can use tapGestureRecognizer.view for getting a view that is assigned a tap gesture. And by this, you can also get the view tag (your view is corresponding to the image view in your code)
#objc func imageZoom(tapGestureRecognizer: UITapGestureRecognizer) {
let senderView = tapGestureRecognizer.view // Here you get a view that is associated with the gesture
let tag = senderView?.tag // Here you get a tag that is assigned to all image
// Add your condition here by tag
annimationImage(detailsImage: statusImageView!)
}
I'm creating a custom, reusable segmented controller using UIViews and I'm having a problem with overlapping views. It currently looks like this:
You can see that the blue selector is under the buttons but I want it to sit at the bottom and be four pixels high. To do this, I have:
let numberOfButtons = CGFloat(buttonTitles.count)
let selectorWidth = frame.width / numberOfButtons
let selectorYPosition = frame.height - 3 <--- This cause it to be hidden behind the button
selector = UIView(frame: CGRect(x: 0, y: selectorYPosition, width: selectorWidth, height: 4))
selector.layer.cornerRadius = 0
selector.backgroundColor = selectorColor
addSubview(selector)
bringSubviewToFront(selector) <--- I thought this would work but it does nothing
which results in the selector UIView being hidden behind the segment UIView (I have the Y position set to - 3 so you can see how it's being covered up. I actually want it to be - 4, but that makes it disappear entirely):
I thought using bringSubviewToFront() would bring it in front of the segment UIView but it doesn't seem to do anything. I've looked through Apple View Programming Guide and lots of SO threads but can't find an answer.
Can anybody help me see what I'm missing?
Full code:
class CustomSegmentedControl: UIControl {
var buttons = [UIButton]()
var selector: UIView!
var selectedButtonIndex = 0
var borderWidth: CGFloat = 0 {
didSet {
layer.borderWidth = borderWidth
}
}
var borderColor: UIColor = UIColor.black {
didSet {
layer.borderColor = borderColor.cgColor
}
}
var separatorBorderColor: UIColor = UIColor.lightGray {
didSet {
}
}
var commaSeparatedTitles: String = "" {
didSet {
updateView()
}
}
var textColor: UIColor = .lightGray {
didSet {
updateView()
}
}
var selectorColor: UIColor = .blue {
didSet {
updateView()
}
}
var selectorTextColor: UIColor = .black {
didSet {
updateView()
}
}
func updateView() {
buttons.removeAll()
subviews.forEach { $0.removeFromSuperview() }
// create buttons
let buttonTitles = commaSeparatedTitles.components(separatedBy: ",")
for buttonTitle in buttonTitles {
let button = UIButton(type: .system)
button.setTitle(buttonTitle, for: .normal)
button.setTitleColor(textColor, for: .normal)
button.backgroundColor = UIColor.white
button.addTarget(self, action: #selector(buttonTapped), for: .touchUpInside)
buttons.append(button)
}
// make first button selected
buttons[0].setTitleColor(selectorTextColor, for: .normal)
let numberOfButtons = CGFloat(buttonTitles.count)
let selectorWidth = frame.width / numberOfButtons
let selectorYPosition = frame.height - 3
selector = UIView(frame: CGRect(x: 0, y: selectorYPosition, width: selectorWidth, height: 4))
selector.layer.cornerRadius = 0
selector.backgroundColor = selectorColor
addSubview(selector)
bringSubviewToFront(selector)
let stackView = UIStackView(arrangedSubviews: buttons)
stackView.axis = .horizontal
stackView.alignment = .fill
stackView.distribution = .fillEqually
addSubview(stackView)
stackView.translatesAutoresizingMaskIntoConstraints = false
stackView.topAnchor.constraint(equalTo: self.topAnchor).isActive = true
stackView.bottomAnchor.constraint(equalTo: self.bottomAnchor).isActive = true
stackView.leftAnchor.constraint(equalTo: self.leftAnchor).isActive = true
stackView.rightAnchor.constraint(equalTo: self.rightAnchor).isActive = true
}
#objc func buttonTapped(button: UIButton) {
for (buttonIndex, btn) in buttons.enumerated() {
btn.setTitleColor(textColor, for: .normal)
if btn == button {
let numberOfButtons = CGFloat(buttons.count)
let selectorStartPosition = frame.width / numberOfButtons * CGFloat(buttonIndex)
UIView.animate(withDuration: 0.3, animations: { self.selector.frame.origin.x = selectorStartPosition })
btn.setTitleColor(selectorTextColor, for: .normal)
}
}
sendActions(for: .valueChanged)
}
}
You are covering up your selector with the stackView.
You need to do:
bringSubviewToFront(selector)
after you have added all of the views. Move that line to the bottom of updateView().
I have 8 buttons and I want to display a picture every time I press the buttons.
What I wonder is, do I need to have 8 functions to display these images?
Or is there any easier ways?
Here is how I've done it, it works as it should, but I do not want to repeat the same things over and over again?
var imageView1:UIImageView!
var imageView2:UIImageView!
var imageView3:UIImageView!
override func viewDidLoad() {
super.viewDidLoad()
showImage1()
showImage2()
showImage3()
tapGestureRecognizerFunc()
}
#objc func button1Tap() {
if self.imageView1.isHidden {
self.imageView1.isHidden = false
}else{
self.imageView1.isHidden = true
}
}
#objc func button2Tap() {
if self.imageView2.isHidden {
self.imageView2.isHidden = false
}else{
self.imageView2.isHidden = true
}
}
#objc func button3Tap() {
if self.imageView3.isHidden {
self.imageView3.isHidden = false
}else{
self.imageView3.isHidden = true
}
}
func showImage1() {
imageView1 = UIImageView(frame: CGRect(x: 271, y: 8, width: 29, height: 29))
imageView1.image = UIImage(named: "Done.png")
imageView1.contentMode = .scaleAspectFit
View1.addSubview(imageView1)
imageView1.isHidden = true
}
func showImage2() {
imageView2 = UIImageView(frame: CGRect(x: 271, y: 8, width: 29, height: 29))
imageView2.image = UIImage(named: "Done.png")
imageView2.contentMode = .scaleAspectFit
View2.addSubview(imageView2)
imageView2.isHidden = true
}
func showImage3() {
imageView2 = UIImageView(frame: CGRect(x: 271, y: 8, width: 29, height: 29))
imageView2.image = UIImage(named: "Done.png")
imageView2.contentMode = .scaleAspectFit
View3.addSubview(imageView2)
imageView2.isHidden = true
}
func tapGestureRecognizerFunc () {
let exercise1Tap = UITapGestureRecognizer(target: self, action: #selector(button1Tap))
exercise1Tap.numberOfTapsRequired = 2
View1.addGestureRecognizer(exercise1Tap)
let exercise2Tap = UITapGestureRecognizer(target: self, action: #selector(button2Tap))
exercise2Tap.numberOfTapsRequired = 2
View2.addGestureRecognizer(exercise2Tap)
let exercise3Tap = UITapGestureRecognizer(target: self, action: #selector(button3Tap))
exercise3Tap.numberOfTapsRequired = 2
View3.addGestureRecognizer(exercise3Tap)
}
yes i'm newbie
Since I don't know, where and how you create the Buttons it is difficult to answer.
The following is just a tip.
You should use an array of UIImageView
Your callback should use the Form buttonAction(sender : UIButton)
You could use a tag for the button to get the number of the corresponding button
For example:
class ViewController: UIViewController {
var imageviews : [UIImageView] = []
override func viewDidLoad() {
super.viewDidLoad()
for i in 1...8 {
let imageview = UIImageView()
view.addSubview(imageview)
imageview.tag = i
imageviews.append(imageview)
let button = UIButton(frame: CGRect(x: 0, y: CGFloat(i)*50.0, width: 100, height: 30))
view.addSubview(button)
button.setTitle("Button \(i)", for: .normal)
button.setTitleColor(.black, for: .normal)
button.tag = i
button.addTarget(self, action: #selector(buttonAction), for: .touchUpInside)
}
}
#objc func buttonAction(sender : UIButton) {
let index = sender.tag
print("Button \(index) pressed")
imageviews[index].isHidden = !imageviews[index].isHidden
}
}
You can set the colour of a button by doing setTitleColor(.white, for: .normal), which will set the button to white. But what if wanted to check the colour of the title inside the button?
I tried
let color = titleColor(for: .normal) and let color = titleLabel?.textColor but when I try to set that color elsewhere, nothing happens.
Use:
extension UIButton {
func loadingIndicator(show: Bool) {
let tag = 9876
var color: UIColor?
if show {
color = titleColor(for: .normal)
let indicator = UIActivityIndicatorView()
let buttonHeight = self.bounds.size.height
let buttonWidth = self.bounds.size.width
indicator.center = CGPoint(x: buttonWidth/2, y: buttonHeight/2)
indicator.tag = tag
indicator.color = UIColor.white
setTitleColor(.clear, for: .normal)
self.addSubview(indicator)
indicator.startAnimating()
} else {
if let indicator = self.viewWithTag(tag) as? UIActivityIndicatorView {
indicator.stopAnimating()
indicator.removeFromSuperview()
setTitleColor(color, for: .normal)
}
}
}
}
This is how you can get the color of the title of the UIButton with state and than you can used it anywhere you want.
let color = btn.titleColor(for: .normal);
label.textColor = color
As you can see my Button color is correctly used in Label TextColor in this image.
This is how you will do it in the Extension
extension UIButton {
func loadingIndicator(show: Bool) {
let tag = 9876
var color: UIColor?
if show {
color = titleColor(for: .normal)
let indicator = UIActivityIndicatorView()
let buttonHeight = self.bounds.size.height
let buttonWidth = self.bounds.size.width
indicator.center = CGPoint(x: buttonWidth/2, y: buttonHeight/2)
indicator.tag = tag
indicator.color = UIColor.white
setTitleColor(.clear, for: .normal)
self.addSubview(indicator)
indicator.startAnimating()
} else {
if let indicator = self.viewWithTag(tag) as? UIActivityIndicatorView {
indicator.stopAnimating()
indicator.removeFromSuperview()
setTitleColor(color, for: .normal)
}
}
}
}
And use it like that:
//This will set the saved color for `UIButton` title
btn.loadingIndicator(show: false)