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"
I'm going to guess your google.png
image looks something like this:
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: