¿Cómo crear un botón mediante programación?

256

¿Cómo creo programáticamente elementos gráficos (como a UIButton) en Swift? Traté de crear y agregar un botón a una vista, pero no pude.

val_lek
fuente

Respuestas:

414

Aquí hay una solución completa para agregar UIButtonprogramáticamente con targetAction .
Swift 2.2

override func viewDidLoad() {
  super.viewDidLoad()

  let button = UIButton(frame: CGRect(x: 100, y: 100, width: 100, height: 50))
  button.backgroundColor = .greenColor()
  button.setTitle("Test Button", forState: .Normal)
  button.addTarget(self, action: #selector(buttonAction), forControlEvents: .TouchUpInside)

  self.view.addSubview(button)
}

func buttonAction(sender: UIButton!) {
  print("Button tapped")
}

Probablemente sea mejor usar en NSLayoutConstraintlugar de framecolocar correctamente el botón para cada pantalla de iPhone.

Código actualizado a Swift 3.1 :

override func viewDidLoad() {
  super.viewDidLoad()

  let button = UIButton(frame: CGRect(x: 100, y: 100, width: 100, height: 50))
  button.backgroundColor = .green
  button.setTitle("Test Button", for: .normal)
  button.addTarget(self, action: #selector(buttonAction), for: .touchUpInside)

  self.view.addSubview(button)
}

func buttonAction(sender: UIButton!) {
  print("Button tapped")
}

Código actualizado a Swift 4.2 :

override func viewDidLoad() {
  super.viewDidLoad()

  let button = UIButton(frame: CGRect(x: 100, y: 100, width: 100, height: 50))
  button.backgroundColor = .green
  button.setTitle("Test Button", for: .normal)
  button.addTarget(self, action: #selector(buttonAction), for: .touchUpInside)

  self.view.addSubview(button)
}

@objc func buttonAction(sender: UIButton!) {
  print("Button tapped")
}

Lo anterior aún funciona si func buttonActionse declara privateo internal.

Anil Varghese
fuente
3
y no olvides que tu clase objetivo debe derivarse de NSObject
Alexey Globchastyy
77
y no olvides que la función que es tu acción no puede ser privada
Pablo Zbigy Jablonski
2
Es extraño que decidieran hacer una acción con una cadena en lugar de usar una función (¡con las cadenas es aún más inseguro que los selectores!). Compatibilidad con versiones anteriores de Obj-C probablemente :(
Ixx
¿Hay alguna forma de cambiar el radio de la esquina de un botón?
MoralCode
3
A partir de Swift 1.2, los downcasts ya no se pueden hacer con "as", deben "forzarse a fallar" con "as!".
TenaciousJay
100

Puede agregar UIButton, UIlable y UITextfield programáticamente de esta manera.

Código UIButton

// var button   = UIButton.buttonWithType(UIButtonType.System) as UIButton
let button = UIButton(type: .System) // let preferred over var here
button.frame = CGRectMake(100, 100, 100, 50)
button.backgroundColor = UIColor.greenColor()
button.setTitle("Button", forState: UIControlState.Normal)
button.addTarget(self, action: "Action:", forControlEvents: UIControlEvents.TouchUpInside)
self.view.addSubview(button)

Código UILabel

var label: UILabel = UILabel()
label.frame = CGRectMake(50, 50, 200, 21)
label.backgroundColor = UIColor.blackColor()
label.textColor = UIColor.whiteColor()
label.textAlignment = NSTextAlignment.Center
label.text = "test label"
self.view.addSubview(label)

Código UITextField

var txtField: UITextField = UITextField()
txtField.frame = CGRectMake(50, 70, 200, 30)
txtField.backgroundColor = UIColor.grayColor()
self.view.addSubview(txtField)

Espero que esto te ayude.

Akhtar
fuente
entonces, ¿por qué necesita el operador "como" en la primera línea de código que compartió antes de UIButton ...?
zumzum
buttonWithType devuelve el tipo AnyObject, por lo que debe emitirlo como un UIButton
Chris C
1
@ElgsQianChen Puede usar este código de acuerdo con sus requisitos. por ejemplo, si desea agregar un UIButton cuando aparezca la vista, agregue el código en viewWillAppear.
Akhtar
1
A partir de Swift 1.2, los downcasts ya no se pueden hacer con "as", deben "forzarse a fallar" con "as!".
TenaciousJay
Para las personas que se encuentran con advertencias en desuso de los literales de cadena objetiva C La respuesta correcta está aquí: stackoverflow.com/a/36308587/968848
n.by.n
61

Para Swift 3

let button = UIButton()
button.frame = CGRect(x: self.view.frame.size.width - 60, y: 60, width: 50, height: 50)
button.backgroundColor = UIColor.red
button.setTitle("your Button Name", for: .normal)
button.addTarget(self, action: #selector(buttonAction), for: .touchUpInside)
self.view.addSubview(button)

func buttonAction(sender: UIButton!) {
    print("Button tapped")
}

Para Swift 4

 let button = UIButton()
 button.frame = CGRect(x: self.view.frame.size.width - 60, y: 60, width: 50, height: 50)
 button.backgroundColor = UIColor.red
 button.setTitle("Name your Button ", for: .normal)
 button.addTarget(self, action: #selector(buttonAction), for: .touchUpInside)
 self.view.addSubview(button)

 @objc func buttonAction(sender: UIButton!) {
    print("Button tapped")
 }
Museer Ahamad Ansari
fuente
button.frame = (frame: CGRect(x: self.view.frame.size.width - 60, y: 20, width: 50, height: 50))debería serbutton.frame = CGRect(x: self.view.frame.size.width - 60, y: 20, width: 50, height: 50)
JC
2
En Swift 4 antes de "func" necesita agregar "@objc".
Ruslan Leshchenko
29

Swift 3

let btn = UIButton(type: .custom) as UIButton
btn.backgroundColor = .blue
btn.setTitle("Button", for: .normal)
btn.frame = CGRect(x: 100, y: 100, width: 200, height: 100)
btn.addTarget(self, action: #selector(clickMe), for: .touchUpInside)
self.view.addSubview(btn)

func clickMe(sender:UIButton!) {
  print("Button Clicked")
}

Salida

ingrese la descripción de la imagen aquí

usuario3182143
fuente
Gracias m8! Comenzando con Swift hoy, así que todo es extraño (:
Felipe
17

Cómo hacer esto usando Swift 3.0 .

func createButton() {
    let button = UIButton(type: .system)
    button.frame = CGRect(x: 100.0, y: 100.0, width: 100.0, height: 100.0)
    button.setTitle(NSLocalizedString("Button", comment: "Button"), for: .normal)
    button.backgroundColor = .green
    button.addTarget(self, action: #selector(buttonAction(sender:)), for: .touchUpInside)
    view.addSubview(button)
}

@objc func buttonAction(sender: UIButton) {
    print("Button pushed")
}
CodeBender
fuente
16
 var sampleButton:UIButton?

 override func viewDidLoad() {
  super.viewDidLoad()

 }
 override func viewDidAppear(animated: Bool) {

  sampleButton = UIButton(type: .RoundedRect)
  //sampleButton.frame = CGRect(x:50, y:500, width:70, height:50)

  sampleButton!.setTitle("Sample \n UI Button", forState: .Normal)
  sampleButton!.titleLabel?.lineBreakMode = .ByWordWrapping
  sampleButton!.titleLabel?.textAlignment = .Center
  sampleButton!.setTitleColor(UIColor.whiteColor(), forState: .Normal)
  sampleButton!.layer.cornerRadius = 6
  sampleButton!.backgroundColor = UIColor.redColor().colorWithAlphaComponent(0.6)
  sampleButton?.tintColor =  UIColor.brownColor()


  //Add padding around text
  sampleButton!.titleEdgeInsets = UIEdgeInsetsMake(-10,-10,-10,-10)
  sampleButton!.contentEdgeInsets = UIEdgeInsetsMake(5,5,5,5)

  //Action set up
  sampleButton!.addTarget(self, action: "sampleButtonClicked", forControlEvents: .TouchUpInside)
  self.view.addSubview(sampleButton!)


  //Button Constraints:
  sampleButton!.translatesAutoresizingMaskIntoConstraints = false

  //To anchor above the tab bar on the bottom of the screen:
  let bottomButtonConstraint = sampleButton!.bottomAnchor.constraintEqualToAnchor(bottomLayoutGuide.topAnchor, constant: -20)

  //edge of the screen in InterfaceBuilder:
  let margins = view.layoutMarginsGuide
  let leadingButtonConstraint = sampleButton!.leadingAnchor.constraintEqualToAnchor(margins.leadingAnchor)

  bottomButtonConstraint.active = true
  leadingButtonConstraint.active = true


 }
 func sampleButtonClicked(){

  print("sample Button Clicked")

 }
AG
fuente
14

La API no ha cambiado, solo la sintaxis. Puedes hacer un UIButtony agregarlo así:

var button = UIButton(frame: CGRectMake(0, 0, 50, 50))
self.view.addSubview(button) // assuming you're in a view controller
Cezary Wojcik
fuente
7

Puede crear así y puede agregar acciones también como esta ...

import UIKit

let myButton = UIButton(frame: CGRect(x: 0, y: 0, width: 50, height: 50))

init(nibName nibNameOrNil: String!, bundle nibBundleOrNil: NSBundle!)
{       super.init(nibName: nibName, bundle: nibBundle) 
        myButton.targetForAction("tappedButton:", withSender: self)
}

func tappedButton(sender: UIButton!)
{ 
     println("tapped button")
}
Dharmbir Singh
fuente
lo siento, pero el compilador envió un error en línea: self.view.addSubview (ver: myButton). El error es el siguiente: "Etiqueta de argumento extraño 'vista:' en llamada"
val_lek
Elimine esta línea self.view.addSubview (view: myButton) Para obtener más información, vea mi respuesta editada.
Dharmbir Singh
Gracias, pero ¿cómo puedo agregar este botón en self.view?
val_lek
6

Agregue este código en viewDidLoad
// add Button

            var button=UIButton(frame: CGRectMake(150, 240, 75, 30))
            button.setTitle("Next", forState: UIControlState.Normal)
            button.addTarget(self, action: "buttonTapAction:", forControlEvents: UIControlEvents.TouchUpInside)
            button.backgroundColor = UIColor.greenColor()
            self.view.addSubview(button)

Escriba esta función fuera de ella, esto llamará cuando toque el botón

func buttonTapAction(sender:UIButton!)
{
    println("Button is working")
}
Nimmy Alphonsa Jose
fuente
6

En Swift 2 y iOS 9.2.1

var button: UIButton = UIButton(type: UIButtonType.Custom) as UIButton
self.button.frame = CGRectMake(130, 70, 60, 20)
self.button.setTitle("custom button", forState: UIControlState.Normal)
self.button.addTarget(self, action:"buttonActionFuncName", forControlEvents: UIControlEvents.TouchUpInside)
self.button.setTitleColor(UIColor.blackColor(), forState: .Normal)
self.button.layer.borderColor = UIColor.blackColor().CGColor
self.button.titleLabel?.font = UIFont(name: "Helvetica-Bold", size: 13)
self.view.addSubview(self.button)
Muhammad Qasim
fuente
6

Para Swift 5 igual que Swift 4

 let button = UIButton()
 button.frame = CGRect(x: self.view.frame.size.width - 60, y: 60, width: 50, height: 50)
 button.backgroundColor = UIColor.red
 button.setTitle("Name your Button ", for: .normal)
 button.addTarget(self, action: #selector(buttonAction), for: .touchUpInside)
 self.view.addSubview(button)

 @objc func buttonAction(sender: UIButton!) {
    print("Button tapped")
 }
Zgpeace
fuente
4

Es posible. Hace todo de la misma manera, excepto que usa la sintaxis rápida. Por ejemplo, podría hacer un UIButton en un código como este:

 var button: UIButton = UIButton(frame: CGRectMake(0, 0, 100, 100))
Connor
fuente
3

Para crear UIButton desde el guión gráfico: 1 - Arrastre el objeto UIButton desde la Biblioteca de objetos a ViewController en el archivo del guión gráfico 2 - Mostrar el asistente del editor 3 - Arrastre con el botón derecho desde UIButton crear arriba en su clase. El resultado es el siguiente:

@IBAction func buttonActionFromStoryboard(sender: UIButton)
{
    println("Button Action From Storyboard")
}

Para crear UIButton mediante programación: 1- Escribe en "override func viewDidLoad ()":

        let uiButton    = UIButton.buttonWithType(UIButtonType.System) as UIButton
        uiButton.frame  = CGRectMake(16, 116, 288, 30)
        uiButton.setTitle("Second", forState: UIControlState.Normal);
        uiButton.addTarget(self, action: "buttonActionFromCode:", forControlEvents: UIControlEvents.TouchUpInside)
        self.view.addSubview(uiButton)

2- agregue la función IBAction:

@IBAction func buttonActionFromCode(sender:UIButton)
{
    println("Button Action From Code")
}
Alessandro Pirovano
fuente
A partir de Swift 1.2, los downcasts ya no se pueden hacer con "as", deben "forzarse a fallar" con "as!".
TenaciousJay
3
            let myFirstButton = UIButton()
            myFirstButton.setTitle("Software Button", forState: .Normal)
            myFirstButton.setTitleColor(UIColor.redColor(), forState: .Normal)
            myFirstButton.frame = CGRectMake(100, 300, 150, 50)
            myFirstButton.backgroundColor = UIColor.purpleColor()
            myFirstButton.layer.cornerRadius = 14
            myFirstButton.addTarget(self, action: "pressed:", forControlEvents: .TouchUpInside)
            self.view.addSubview(myFirstButton)
            myFirstButton.hidden=true
            nameText.delegate = self


func pressed(sender: UIButton!) {
        var alertView = UIAlertView()
        alertView.addButtonWithTitle("Ok")
        alertView.title = "title"
        alertView.message = "message"
        alertView.show();
    }
abdul sathar
fuente
3

Si en el simulador. Algunas veces no reconoce el selector, parece que hay un error. Aunque no me enfrenté a su código, simplemente cambié el nombre de la acción (selector). Funciona

let buttonPuzzle:UIButton = UIButton(frame: CGRectMake(100, 400, 100, 50))
buttonPuzzle.backgroundColor = UIColor.greenColor()
buttonPuzzle.setTitle("Puzzle", forState: UIControlState.Normal)
buttonPuzzle.addTarget(self, action: "buttonAction:", forControlEvents: UIControlEvents.TouchUpInside)
buttonPuzzle.tag = 22;
self.view.addSubview(buttonPuzzle)

La función de selección está aquí:

func buttonAction(sender:UIButton!)
{

    var btnsendtag:UIButton = sender
    if btnsendtag.tag == 22 {            
        //println("Button tapped tag 22")
    }
}
Dharmesh Kheni
fuente
Parece que me encuentro con el mismo problema. Inicialmente creé el botón una IBAction en el guión gráfico, pero recibí un "selector no reconocido enviado a la instancia", luego eliminé la IBAction creada de esa manera e intenté usar .addTarget, ambos conducen al mismo error.
RayInNoIL
Lo que funcionó para mí fue eliminar todo el código IBOutlet e IBAction en el archivo .swift y todas las conexiones en InterfaceBuilder. Luego recrear todo.
RayInNoIL
2

Esto me funciona muy bien, #DynamicButtonEvent #IOS #Swift #Xcode

func setupButtonMap(){
    let mapButton = UIButton(type: .system)
    mapButton.setImage(#imageLiteral(resourceName: "CreateTrip").withRenderingMode(.alwaysOriginal), for: .normal)
    mapButton.frame = CGRect(x: 0, y: 0, width: 34, height: 34)
    mapButton.contentMode = .scaleAspectFit
    mapButton.backgroundColor = UIColor.clear
    mapButton.addTarget(self, action: #selector(ViewController.btnOpenMap(_:)), for: .touchUpInside)
    navigationItem.leftBarButtonItem = UIBarButtonItem(customView: mapButton)
    }
@IBAction func btnOpenMap(_ sender: Any?) {
    print("Successful")
}
Lex
fuente
2

Escriba este código de muestra en Swift 4.2 para agregar botón mediante programación.

override func viewDidLoad() {
    super.viewDidLoad()
        let myButton = UIButton(frame: CGRect(x: 100, y: 100, width: 100, height: 50))
        myButton.backgroundColor = .green
        myButton.setTitle("Hello UIButton", for: .normal)
        myButton.addTarget(self, action: #selector(myButtonAction), for: .touchUpInside)
        self.view.addSubview(myButton)
}

 @objc func myButtonAction(sender: UIButton!) {
    print("My Button tapped")
}
Parth
fuente
1
    // UILabel:
    let label = UILabel()
    label.frame = CGRectMake(35, 100, 250, 30)
    label.textColor = UIColor.blackColor()
    label.textAlignment = NSTextAlignment.Center
    label.text = "Hello World"
    self.view.addSubview(label)

    // UIButton:
    let btn: UIButton = UIButton(type: UIButtonType.Custom) as UIButton
    btn.frame = CGRectMake(130, 70, 60, 20)
    btn.setTitle("Click", forState: UIControlState.Normal)
    btn.setTitleColor(UIColor.blackColor(), forState: .Normal)
    btn.addTarget(self, action:Selector("clickAction"), forControlEvents: UIControlEvents.TouchUpInside)
    view.addSubview(btn)


    // Button Action:
    @IBAction func clickAction(sender:AnyObject)
    {
        print("Click Action")
    }
El rey
fuente
1

Paso 1: hacer un nuevo proyecto

ingrese la descripción de la imagen aquí

Paso 2: en ViewController.swift

import UIKit

class ViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()

        // CODE
        let btn = UIButton(type: UIButtonType.System) as UIButton        
        btn.backgroundColor = UIColor.blueColor()
        btn.setTitle("CALL TPT AGENT", forState: UIControlState.Normal)
        btn.frame = CGRectMake(100, 100, 200, 100)
        btn.addTarget(self, action: "clickMe:", forControlEvents: UIControlEvents.TouchUpInside)
        self.view.addSubview(btn)

    }

    func clickMe(sender:UIButton!) {
      print("CALL")
    }

    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
    }


}

fuente
0

Swift: Ui Button crea programáticamente

let myButton = UIButton()

myButton.titleLabel!.frame = CGRectMake(15, 54, 300, 500)
myButton.titleLabel!.text = "Button Label"
myButton.titleLabel!.textColor = UIColor.redColor()
myButton.titleLabel!.textAlignment = .Center
self.view.addSubview(myButton)
Shanmugasundharam
fuente
0

ingrese la descripción de la imagen aquí

 func viewDidLoad(){
                    saveActionButton = UIButton(frame: CGRect(x: self.view.frame.size.width - 60, y: 0, width: 50, height: 50))
                    self.saveActionButton.backgroundColor = UIColor(red: 76/255, green: 217/255, blue: 100/255, alpha: 0.7)
                    saveActionButton.addTarget(self, action: #selector(doneAction), for: .touchUpInside)
                    self.saveActionButton.setTitle("Done", for: .normal)
                    self.saveActionButton.layer.cornerRadius = self.saveActionButton.frame.size.width / 2
                    self.saveActionButton.layer.borderColor = UIColor.darkGray.cgColor
                    self.saveActionButton.layer.borderWidth = 1
                    self.saveActionButton.center.y = self.view.frame.size.height - 80
                    self.view.addSubview(saveActionButton)
        }

          func doneAction(){
          print("Write your own logic")
         }
Sai kumar Reddy
fuente
0

Por lo general, voy para configurar una extensión de UIBotton. Swift 5.

let button: UIButton = UIButton()
override func viewDidLoad() {
        super.viewDidLoad()
     button.setup(title: "OK", x: 100, y: 430, width: 220, height: 80, color: .yellow)
        buttonD.setTitleColor(.black, for: .normal)

}
extension UIButton {
    func setup(title: String, x: CGFloat, y: CGFloat, width: CGFloat, height: CGFloat, color: UIColor){
        frame = CGRect(x: x, y: y, width: width, height: height)
        backgroundColor = color
        setTitle(title , for: .normal) 
        }
    }
Raíz de remolacha
fuente
-1
Uilabel code 

var label: UILabel = UILabel()
label.frame = CGRectMake(50, 50, 200, 21)
label.backgroundColor = UIColor.blackColor()
label.textColor = UIColor.whiteColor()
label.textAlignment = NSTextAlignment.Center
label.text = "test label"
self.view.addSubview(label)
varun
fuente
2
Siempre se recomienda agregar alguna explicación a su código
Bowdzone
-2
override func viewDidLoad() {

super.viewDidLoad()
    // Do any additional setup after loading the view, typically from a nib.

    var imageView = UIImageView(frame: CGRectMake(100, 150, 150, 150));
    var image = UIImage(named: "BattleMapSplashScreen.png");
    imageView.image = image;
    self.view.addSubview(imageView);

}
Durgesh
fuente