iosswiftuikit

Google Image looks blue


I have the following code

import UIKit

class AuthViewController: UIViewController {
    private let scrollView = UIScrollView()
    private let containerView = UIView()

    // MARK: - Login Form Elements
    private let titleLabel = UILabel()
    private let emailTextField = UITextField()
    private let passwordTextField = UITextField()
    private let loginButton = UIButton(type: .system)
    private let alreadyHaveAccountButton = UIButton(type: .system)
    private let forgotPasswordButton = UIButton(type: .system)
    private let loginWithAppleButton = UIButton(type: .system)

    // MARK: - Signup Form Elements
    private let firstNameTextField = UITextField()
    private let lastNameTextField = UITextField()
    private let signupEmailTextField = UITextField()
    private let signupPasswordTextField = UITextField()
    private let signupSubmitButton = UIButton(type: .system)

    private var isSignupFormVisible = false

    override func viewDidLoad() {
        super.viewDidLoad()
        view.backgroundColor = .white
        setupScrollView()
        setupLoginForm()
        //setupSignupForm()
        // toggleSignupFormVisibility(show: false)
    }

    private func setupScrollView() {
        view.addSubview(scrollView)
        scrollView.translatesAutoresizingMaskIntoConstraints = false
        scrollView.addSubview(containerView)
        containerView.translatesAutoresizingMaskIntoConstraints = false

        NSLayoutConstraint.activate([
            scrollView.topAnchor.constraint(equalTo: view.safeAreaLayoutGuide.topAnchor),
            scrollView.leadingAnchor.constraint(equalTo: view.leadingAnchor),
            scrollView.trailingAnchor.constraint(equalTo: view.trailingAnchor),
            scrollView.bottomAnchor.constraint(equalTo: view.bottomAnchor),

            containerView.topAnchor.constraint(equalTo: scrollView.topAnchor),
            containerView.leadingAnchor.constraint(equalTo: scrollView.leadingAnchor),
            containerView.trailingAnchor.constraint(equalTo: scrollView.trailingAnchor),
            containerView.bottomAnchor.constraint(equalTo: scrollView.bottomAnchor),
            containerView.widthAnchor.constraint(equalTo: scrollView.widthAnchor)
        ])
    }

    private func setupLoginForm() {
        let stackView = UIStackView(arrangedSubviews: [
            titleLabel,
            createTextField(placeholder: "Email", textField: emailTextField),
            createTextField(placeholder: "Password", textField: passwordTextField, isSecure: true),
            loginButton,
            createGoogleSignInButton(),
            loginWithAppleButton,
            alreadyHaveAccountButton,
            forgotPasswordButton
        ])
        stackView.axis = .vertical
        stackView.spacing = 12
        stackView.translatesAutoresizingMaskIntoConstraints = false
        containerView.addSubview(stackView)

        titleLabel.text = "Login"
        titleLabel.textAlignment = .center
        titleLabel.font = UIFont(name: "Inter-Bold", size: 24)
        loginButton.setTitle("Login", for: .normal)
        loginButton.titleLabel?.font = UIFont(name: "Inter-Bold", size: 18)
        forgotPasswordButton.titleLabel?.font = UIFont(name: "Inter-Regular", size: 16)
        forgotPasswordButton.setTitle("Forgot Password?", for: .normal)
        loginWithAppleButton.titleLabel?.font = UIFont(name: "Inter-Regular", size: 16)
        loginWithAppleButton.setTitle("Login with Apple", for: .normal)
        alreadyHaveAccountButton.setTitle("Don't have an account? Sign Up", for: .normal)
        alreadyHaveAccountButton.titleLabel?.font = UIFont(name: "Inter-Regular", size: 16)

        alreadyHaveAccountButton.addTarget(self, action: #selector(switchToSignupForm), for: .touchUpInside)

        NSLayoutConstraint.activate([
            stackView.topAnchor.constraint(equalTo: containerView.safeAreaLayoutGuide.topAnchor, constant: 50),
            stackView.centerYAnchor.constraint(equalTo: containerView.centerYAnchor),
            stackView.leadingAnchor.constraint(equalTo: containerView.leadingAnchor, constant: 20),
            stackView.trailingAnchor.constraint(equalTo: containerView.trailingAnchor, constant: -20)
        ])
    }

    private func setupSignupForm() {
        let stackView = UIStackView(arrangedSubviews: [
            titleLabel,
            createTextField(placeholder: "First Name", textField: firstNameTextField),
            createTextField(placeholder: "Last Name", textField: lastNameTextField),
            createTextField(placeholder: "Email", textField: signupEmailTextField),
            createTextField(placeholder: "Password", textField: signupPasswordTextField, isSecure: true),
            signupSubmitButton,
            loginWithAppleButton,
            createGoogleSignInButton(),
            alreadyHaveAccountButton
        ])
        stackView.axis = .vertical
        stackView.spacing = 12
        stackView.translatesAutoresizingMaskIntoConstraints = false
        containerView.addSubview(stackView)

        titleLabel.text = "Sign Up"
        titleLabel.textAlignment = .center
        titleLabel.font = UIFont(name: "Inter-Bold", size: 24)
        signupSubmitButton.setTitle("Sign Up", for: .normal)
        signupSubmitButton.titleLabel?.font = UIFont(name: "Inter-Bold", size: 18)
        alreadyHaveAccountButton.titleLabel?.font = UIFont(name: "Inter-Regular", size: 16)
        alreadyHaveAccountButton.setTitle("Already have an account? Login", for: .normal)
        loginWithAppleButton.setTitle("Sign Up with Apple", for: .normal)

        alreadyHaveAccountButton.addTarget(self, action: #selector(switchToLoginForm), for: .touchUpInside)

        NSLayoutConstraint.activate([
            stackView.topAnchor.constraint(equalTo: containerView.safeAreaLayoutGuide.topAnchor, constant: 50),
            stackView.centerYAnchor.constraint(equalTo: containerView.centerYAnchor),
            stackView.leadingAnchor.constraint(equalTo: containerView.leadingAnchor, constant: 20),
            stackView.trailingAnchor.constraint(equalTo: containerView.trailingAnchor, constant: -20)
        ])
    }

    @objc private func switchToSignupForm() {
        for subview in containerView.subviews {
            subview.removeFromSuperview()
        }
        setupSignupForm()
    }

    @objc private func switchToLoginForm() {
        for subview in containerView.subviews {
            subview.removeFromSuperview()
        }
        setupLoginForm()
    }

    private func createTextField(placeholder: String, textField: UITextField, isSecure: Bool = false) -> UITextField {
        textField.placeholder = placeholder
        textField.borderStyle = .roundedRect
        textField.isSecureTextEntry = isSecure
        textField.translatesAutoresizingMaskIntoConstraints = false
        textField.heightAnchor.constraint(equalToConstant: 50).isActive = true
        textField.layer.borderWidth = 1
        textField.layer.borderColor = UIColor.black.cgColor
        return textField
    }
    
    private func createGoogleSignInButton() -> UIButton {
        let button = UIButton(type: .system)
        button.setImage(UIImage(named: "google"), for: .normal)
        button.imageView?.contentMode = .scaleAspectFit
        button.translatesAutoresizingMaskIntoConstraints = false
        button.heightAnchor.constraint(equalToConstant: 50).isActive = true
        button.widthAnchor.constraint(equalToConstant: 200).isActive = true
        return button
    }
}

When I render it, the sign in with google button looks blue. See attached. Does anyone know what I'm doing wrong?

It should say "Continue with Google"

enter image description here


Solution

  • I'm going to guess your google.png image looks something like this:

    maybe

    In your createGoogleSignInButton() func, you have:

    let button = UIButton(type: .system)
    

    The .system button type uses a default .tintColor of blue, which changes any non-transparent portion of the image to that tint color... and you end up with a solid blue button.

    Change that line to:

    let button = UIButton()
    

    and you should get this:

    output