{"id":2822,"date":"2016-08-18T11:59:38","date_gmt":"2016-08-18T15:59:38","guid":{"rendered":"\/cours\/xcode\/wp\/?page_id=2822"},"modified":"2016-08-18T11:59:38","modified_gmt":"2016-08-18T15:59:38","slug":"caissier-electronique","status":"publish","type":"page","link":"https:\/\/ve2cuy.com\/xcode\/caissier-electronique\/","title":{"rendered":"Caissier.\u00c9lectronique"},"content":{"rendered":"

Atelier anim\u00e9 par l’enseignant<\/h2>\n

Note: \u00a0R\u00e9alis\u00e9 sous Xcode 9B6<\/span><\/h2>\n

\u00c9tape 1 – R\u00e9alisation de la maquette<\/h1>\n
\n

Objectif<\/strong><\/span>: \u00a0R\u00e9aliser une mise en page qui fonctionne en mode portrait et en mode paysage.
\nVoici la maquette finale:<\/p>\n

<\/h1>\n

\"caissier-electronique-02\"<\/a><\/h1>\n

Ressources
\n\"calculer\"<\/a> \"123\"<\/a>
\nAction<\/strong><\/span>: \u00a0R\u00e9aliser la maquette
\nNote<\/span><\/strong>: \u00a0Les champs de saisie sont de type\u00a0UITextField<\/em> sauf pour tps et tv qui sont de type UILabel<\/em>.
\nAction<\/strong><\/span>: \u00a0Tester l’application dans le simulateur (orientation portrait et paysage). \u00a0Faire les ajustements au besoin.
\n <\/p>\n

\u00c9tape 2 – D\u00e9finir les liens MVC – @IBOUTLET et @IBAction<\/h1>\n
\n

Action<\/strong><\/span>: \u00a0D\u00e9finir les liens suivants:<\/p>\n

    @IBOutlet weak var quantit\u00e9: UITextField!\n    @IBOutlet weak var prix: UITextField!\n    @IBOutlet weak var total: UITextField!\n    @IBOutlet weak var totalAvecTaxes: UITextField!\n    @IBOutlet weak var tps: UILabel!\n    @IBOutlet weak var tvq: UILabel!\n    @IBAction func calculerTotalAvecTaxes(_ sender: AnyObject) {\n    } \/\/ func calculerTotalAvecTaxes\n<\/pre>\n
Action<\/span><\/strong>: Au d\u00e9marrage, initialiser les champs num\u00e9riques \u00e0 ‘nil<\/em>‘:<\/p>\n
    override func viewDidLoad() {\n        super.viewDidLoad()\n        quantit\u00e9.text = nil\n        prix.text = nil\n        total.text = nil\n        tps.text = nil\n        tvq.text = nil\n        totalAvecTaxes.text = nil\n    }  \/\/ viewDidLoad()<\/pre>\n
 <\/p>\n
\u00c9tape 3 – Programmer la d\u00e9l\u00e9gation<\/h1>\n
\n
<\/h1>\n
Action: <\/strong>Adh\u00e9rer au protocole UITextFieldDelegate.<\/span><\/span><\/p>\n
class ViewController: UIViewController, UITextFieldDelegate {\n<\/pre>\n
Action:<\/strong><\/span> \u00c9tablir un lien entre un composant et un protocole.
\n\"delegate\"<\/a>
\nAction<\/strong><\/span>: Exp\u00e9rimenter avec les m\u00e9thodes du protocole\u00a0UITextFieldDelegate<\/strong>:
\n\"textFieldDelegate\"<\/a><\/p>\n
    func textFieldDidBeginEditing(_ textField: UITextField) {\n        print(\"#L'utilisateur est entr\u00e9 dans la zone de texte!\")\n        textField.textColor = UIColor.red\n    }\n    func textFieldDidEndEditing(_ textField: UITextField) {\n        textField.textColor = UIColor.black\n    }\n    func textFieldShouldReturn(_ textField: UITextField) -> Bool {\n        print(\"#L'utilisateur a appuy\u00e9 sur la touche retour!\")\n        return true\n    }\n<\/pre>\n
 <\/p>\n
\u00c9tape 4 – Programmer les fonctionnalit\u00e9s de l’application<\/h1>\n
\n
R\u00e9vision prof<\/a><\/p>\n
Tester si un champ est vide<\/h3>\n
Il est possible de tester si un champ est vide de la fa\u00e7on suivante:<\/p>\n
    func textFieldDidEndEditing(_ textField: UITextField) {\n        textField.textColor = UIColor.black\n        if textField.text!.isEmpty == true {\n          afficherAlert(\"Le champ de saisie ne doit pas \u00eatre vide!\")\n        }\n    }\n<\/pre>\n
<\/h3>\n
Afficher une fen\u00eatre d’alerte<\/h3>\n
Voici comment afficher une fen\u00eatre d’alerte:<\/p>\n
    func afficherAlert(_ message:String) {\n        let alert = UIAlertController(title: \"Attention!\", message: message, preferredStyle: UIAlertControllerStyle.alert)\n        alert.addAction(UIAlertAction(title: \"Je ferai plus attention!\", style: UIAlertActionStyle.default, handler: nil))\n        \/\/ Patch temporaire pour Xcode 8b5; utilisation de 'DispatchQueue' pour ex\u00e9cuter le self.present()\n        DispatchQueue.main.async( execute: { self.present(alert,  animated: true, completion: nil) } )\n        \/\/self.present(alert,  animated: true, completion: nil)\n    }\n<\/pre>\n
 
\nDans notre cas, il suffit de tester s’il est possible de le convertir en nombre:<\/p>\n
if let _ = Float(textField.text!) {\n  \/\/ calculer le total ...\n} else\n{\n  afficherAlert(\"Erreur, Il faut entrer un nombre!\")\n}\n<\/pre>\n
 <\/p>\n
Quelques conversions num\u00e9riques<\/span><\/span><\/h3>\n
Le contenu d’un UITextField<\/em> et d’un UILabel<\/em> est accessible via la propri\u00e9t\u00e9 ‘text’, comme dans ‘quantit\u00e9.text’.
\nLa propri\u00e9t\u00e9 ‘text’ est de type ‘String’.
\nAvant de pouvoir utiliser son contenu \u00e0 des fins arithm\u00e9tiques il faudra le convertir.
\nLe fa\u00e7on la plus simple, est d’utiliser le constructeur des types num\u00e9riques.
\nPar exemple,<\/p>\n