Share
Le tutoriel de ce débutant pour le SDK iOS vous apprendra à construire une interface simple composée d'un nom d'utilisateur et d'un mot de passe. UITextField. Nous verrons comment ajouter un champ de texte dans Interface Builder et comment en créer un par programme. De plus, nous explorerons les UITextFieldDelegate Méthodes de protocole et démonstration de quelques techniques utiles pour travailler avec une entrée utilisateur.
La création d'éléments, tels qu'un champ de texte, peut être effectuée de deux manières. Vous pouvez le créer dans Interface Builder ou vous pouvez le coder vous-même par programme. Bien qu'il puisse être plus pratique de créer un élément dans Interface Builder, de nombreux programmeurs préfèrent créer des éléments par programmation. Ce tutoriel expliquera brièvement les deux options.
Lancez Xcode et cliquez sur Fichier> Nouveau> Projet. Cliquez sur "Application" dans le volet iOS à gauche. Cliquez sur l'icône intitulée "Single View Application" et cliquez sur "Suivant".
Dans le champ "Nom du produit", tapez "TextFieldARC" et entrez un nom pour votre identificateur d'entreprise, tel que "com.companyName". Choisissez "iPhone" dans le menu "Famille de périphériques". Veillez à décocher "Utiliser les storyboards" et "Inclure les tests unitaires", puis à cocher "Utiliser le comptage automatique des références" avant de cliquer sur "Suivant". Choisissez un emplacement pour stocker votre projet et cliquez sur "Créer".
Accentsconagua
UITextField Cliquez sur le fichier "ViewController.m" et tapez le code suivant dans le champ viewDidLoad méthode.
CGRect passwordTextFieldFrame = CGRectMake (20.0f, 100.0f, 280.0f, 31.0f); UITextField * passwordTextField = [[UITextField alloc] initWithFrame: passwordTextFieldFrame]; passwordTextField.placeholder = @ "Mot de passe"; passwordTextField.backgroundColor = [UIColor whiteColor]; passwordTextField.textColor = [UIColor blackColor]; passwordTextField.font = [UIFont systemFontOfSize: 14.0f]; passwordTextField.borderStyle = UITextBorderStyleRoundedRect; passwordTextField.clearButtonMode = UITextFieldViewModeWhileEditing; passwordTextField.returnKeyType = UIReturnKeyDone; passwordTextField.textAlignment = UITextAlignmentLeft; passwordTextField.contentVerticalAlignment = UIControlContentVerticalAlignmentCenter; passwordTextField.tag = 2; passwordTextField.autocapitalizationType = UITextAutocapitalizationTypeNone; [self.view addSubview: passwordTextField];
Notez que la propriété de balise du champ de texte est définie sur "2". La définition de la propriété de balise est un moyen de garder trace du champ de texte actif dans votre programme..
Cliquez sur le fichier "ViewController.xib" dans le panneau "Navigateur" de votre projet Xcode. Cliquez sur "Affichage" dans le volet "Structure du document" sur la gauche. Cliquez sur Afficher> Utilitaires> Afficher la bibliothèque d'objets. Faites défiler la bibliothèque d'objets dans le coin inférieur gauche jusqu'à trouver un objet "Champ de texte". Cliquez pour le sélectionner, puis faites glisser le champ de texte sur la vue..
Ajustez le champ de texte pour qu'il s'étende dans la partie supérieure de la vue. Une fois le champ de texte sélectionné, cliquez sur Afficher> Utilitaires> Inspecteur Afficher les attributs. Recherchez le champ "Espace réservé" dans le volet "Inspecteur d'attributs" sous "Champ de texte" et remplacez-le par "Nom d'utilisateur". Cliquez sur le menu déroulant "Effacer le bouton" et choisissez "Apparaît pendant l'édition". Cliquez sur le bouton "Return Key" et choisissez "Next". Enfin, faites défiler le champ "Tag" sous "Affichage" et remplacez-le par "1". Cliquez sur Fichier> Enregistrer.
Si vous exécutez votre programme maintenant, vous devriez avoir un UITextField objet sur l'écran qui peut recevoir une entrée! Vous pouvez accéder à la valeur de l'objet avec le texte propriété (c'est-à-dire passwordTextField.text).
Cependant, l’utilisation de TextField à ce stade présentera un problème notable. Il n'y a pas de méthode par défaut pour supprimer le clavier de la vue. Alors, pour notre prochain tour…
La renonciation au clavier lorsque l’arrière-plan est tapé peut être réalisée de différentes manières. Le code ci-dessous est un exemple d'une technique. Cliquez sur le fichier "ViewController.m" et ajoutez l'implémentation de méthode suivante:
- (void) touchesBegan: (NSSet *) touche withEvent: (UIEvent *) événement NSLog (@ "touchesBegan: withEvent:"); [self.view endEditing: YES]; [super touchesBegan: touche withEvent: event];
Exécutez le projet à nouveau et vous devriez maintenant pouvoir fermer le clavier simplement en tapant sur l'écran.
La délégation est un modèle de conception qui permet essentiellement à deux objets de communiquer entre eux. UNE UITextField messages d'objet le approprié UITextFieldDelegate méthode lorsque certains événements se produisent, par exemple lorsque le champ de texte commence à être modifié. Lorsqu'un message est envoyé à l'une des méthodes, vous avez la possibilité d'effectuer des actions personnalisées. L'objet recevant les messages de délégué peut être n'importe quel objet conforme au protocole de délégué, dans ce cas UITextFieldDelegate. Cependant, dans le scénario le plus courant, l’objet recevant le message UITextField les messages des délégués seront les mêmes UIViewController objet qui contient le UITextField en tant que sous-vue.
Cliquez sur le fichier "ViewController.m". dans le viewDidLoad méthode où nous avons créé par programme le champ de texte ci-dessus, ajoutez le code suivant:
passwordTextField.delegate = self; // ADD THIS LINE [self.view addSubview: passwordTextField];
En mettant le champ de texte déléguer la propriété à soi, la ViewController objet devient le délégué du champ de texte et est capable d'implémenter le UITextFieldDelegate les méthodes.
Pour définir le délégué pour le champ de texte créé dans Interface Builder, cliquez sur "ViewController.xib". Cliquez sur le champ de texte dans la vue, puis cliquez sur Afficher> Utilitaires> Afficher l'inspecteur de connexions. Recherchez "delegate" sous "Outlets" dans le volet "Connections Inspector" sur la droite. Cliquez sur le cercle adjacent et faites-le glisser vers "Propriétaire du fichier" dans le volet "Structure du document" sur la gauche. Ceci relie le champ de texte de sorte que le ViewController objet est défini en tant que délégué du champ de texte. Cliquez sur Fichier> Enregistrer.
Enfin, cliquez sur "ViewController.h" et tapez le code suivant pour conformer la classe à la UITextFieldDelegate protocole:
@interface ViewController: UIViewController
Le suivant UITextFieldDelegate les méthodes de protocole sont toutes optionnelles, ce qui signifie qu'elles ne doivent pas nécessairement être implémentées par le délégué. Cependant, nous allons tous les mettre en œuvre pour apprendre à les connaître. Discutons des méthodes au fur et à mesure que nous les tapons.
textFieldShouldBeginEditing: et textFieldDidBeginEditing: Cliquez sur "ViewController.m" et ajoutez le code suivant.
- (BOOL) textFieldShouldBeginEditing: (UITextField *) textField NSLog (@ "textFieldShouldBeginEditing"); textField.backgroundColor = [UIColor colorWithRed: 220.0f / 255.0f vert: 220.0f / 255.0f bleu: 220.0f / 255.0f alpha: 1.0f]; retourner OUI; - (void) textFieldDidBeginEditing: (UITextField *) textField NSLog (@ "textFieldDidBeginEditing");
textFieldShouldBeginEditing: est appelé juste avant le champ de texte devient actif. C’est un bon endroit pour personnaliser le comportement de votre application. Dans ce cas, la couleur d'arrière-plan du champ de texte change lorsque cette méthode est appelée pour indiquer que le champ de texte est actif.. textFieldDidBeginEditing: est appelé quand le champ de texte devient actif.
textFieldShouldEndEditing: et textFieldDidEndEditing: Ajoutez le code suivant sous les méthodes précédentes.
- (BOOL) textFieldShouldEndEditing: (UITextField *) textField NSLog (@ "textFieldShouldEndEditing"); textField.backgroundColor = [UIColor whiteColor]; retourner OUI; - (void) textFieldDidEndEditing: (UITextField *) textField NSLog (@ "textFieldDidEndEditing");
Ces deux méthodes sont similaires aux méthodes appelées lorsque le champ de texte commence à être modifié.. textFieldShouldEndEditing: est appelé juste avant le champ de texte devient inactif, et textFieldDidEndEditing: est appelé quand le champ de texte devient inactif. À l'intérieur textFieldShouldEndEditing:, la couleur d'arrière-plan redevient blanche afin que le champ de texte puisse retrouver sa couleur d'origine. Encore une fois, ces méthodes vous permettent de personnaliser le comportement de l'application lorsque le champ de texte devient inactif..
textField: shouldChangeCharactersInRange: replacementStringAjoutez le code suivant sous les méthodes précédentes.
- (BOOL) textField: (UITextField *) textField shouldChangeCharactersInRange: (NSRange) range replacementString: (NSString *) chaîne NSLog (@ "textField: shouldChangeCharactersInRange: replacementString:"); if ([string isEqualToString: @ "#"]) return NO; else return YES;
textFieldShouldChangeCharactersInRange: replacementString: est appelé chaque fois que l'utilisateur tape un caractère sur le clavier. En fait, cette méthode est appelée juste avant l'affichage d'un caractère. Si vous souhaitez restreindre certains caractères à un champ de texte, cette méthode vous convient. Comme vous pouvez le voir dans notre exemple, nous avons ajouté une logique pour interdire le symbole "#".
textFieldShouldClear:Ajoutez le code suivant sous les méthodes précédentes.
- (BOOL) textFieldShouldClear: (UITextField *) textField NSLog (@ "textFieldShouldClear:"); retourner OUI;
textFieldShouldClear: est appelé lorsque l'utilisateur appuie sur le bouton d'effacement, le "x" gris situé dans le champ de texte. Avant que le champ de texte actif ne soit effacé, cette méthode vous permet d'effectuer les personnalisations nécessaires..
textFieldShouldReturn:Ajoutez le code suivant sous les méthodes précédentes.
- (BOOL) textFieldShouldReturn: (UITextField *) textField NSLog (@ "textFieldShouldReturn:"); if (textField.tag == 1) UITextField * passwordTextField = (UITextField *) [self.view viewWithTag: 2]; [passwordTextField devientFirstResponder]; else [[textField resignFirstResponder]]; retourne OUI;
textFieldShouldReturn: est appelée lorsque l'utilisateur appuie sur la touche Retour du clavier. Dans l'exemple, nous trouvons le champ de texte actif en consultant la propriété tag. Si le champ de texte "Nom d'utilisateur" est actif, le champ de texte suivant, "Mot de passe", devrait devenir actif à la place. Si le champ de texte "Mot de passe" est actif, "Mot de passe" doit être démissionné, ce qui entraîne la résignation du clavier..
Cliquez sur Construire> Exécuter, ou cliquez sur la flèche "Exécuter" située dans le coin supérieur gauche. Avec la console ouverte, jouez avec les champs de texte. le NSLog placé précédemment dans chacune des méthodes de protocole de délégué permet de connaître les circonstances dans lesquelles chaque méthode de délégué est appelée.
le UITextFieldDelegate les méthodes de protocole offrent une excellente occasion de personnaliser le comportement d’un UITextField. Ce tutoriel est axé sur certaines des tâches les plus courantes liées à UITextField, telles que la démission du clavier et le passage au champ de texte suivant, mais les possibilités de personnalisation du comportement sont infinies. Une fois que vous commencez à comprendre le modèle de conception des délégués, il est plus facile de vous connecter à d'autres objets prédéfinis qui utilisent des délégués, tels que UITableView ou UIScrollView. Gardez votre vieux copain NSLog dans votre poche arrière lorsque vous commencerez à explorer d’autres délégués, ce qui vous aidera à comprendre le fonctionnement interne du délégué..
