Share
Comprendre les schémas est important pour bien concevoir une application Android. Dans ce tutoriel, vous apprendrez tout sur les dispositions linéaires, qui organisent les contrôles de l'interface utilisateur, ou widgets, verticalement ou horizontalement à l'écran. Lorsqu'elles sont utilisées correctement, les mises en page linéaires peuvent être la mise en page fondamentale sur laquelle de nombreuses interfaces utilisateur d'applications Android intéressantes peuvent être conçues..
Les mises en page linéaires sont l’un des types de mises en page les plus simples et les plus couramment utilisés par les développeurs Android pour organiser les contrôles au sein de leurs interfaces utilisateur. La disposition linéaire fonctionne comme son nom l’indique: elle organise les contrôles de manière linéaire, que ce soit verticalement ou horizontalement. Lorsque l'orientation de la présentation est définie sur verticale, tous les contrôles enfants de celle-ci sont organisés dans une seule colonne. lorsque l'orientation de la présentation est définie sur horizontale, tous les contrôles enfants de celle-ci sont organisés sur une seule ligne.
Les dispositions linéaires peuvent être définies dans les ressources de présentation XML ou par programme dans le code Java de l'application..
La figure suivante montre une disposition linéaire avec sept contrôles TextView. L'orientation de cette présentation linéaire est définie sur verticale, ce qui entraîne l'affichage de chaque contrôle TextView dans une seule colonne. Chaque contrôle TextView a son attribut text défini sur une couleur, avec cette même couleur définie en tant qu'arrière-plan du contrôle; chaque contrôle est étiré de la largeur de l'écran en définissant l'attribut layout_width des contrôles sur fill_parent.
Le moyen le plus pratique et le plus facile à gérer de concevoir des interfaces utilisateur pour les applications consiste à créer des ressources de présentation XML. Cette méthode simplifie grandement le processus de conception de l'interface utilisateur, en transférant une grande partie de la création et de la présentation statiques des contrôles de l'interface utilisateur et de la définition des attributs de contrôle vers XML, au lieu de jalonner le code..
Les ressources de présentation XML doivent être stockées dans la hiérarchie des répertoires de projet / res / layout. Jetons un coup d'oeil à la disposition linéaire arc-en-ciel présentée dans la section précédente. Encore une fois, cet écran est fondamentalement une disposition linéaire verticale définie pour remplir la totalité de l'écran, ce qui est obtenu en définissant ses attributs layout_width et layout_height sur fill_parent. Ce fichier de ressources de présentation, nommé judicieusement /res/layout/rainbow.xml, est défini dans XML comme suit:
Vous avez peut-être remarqué que chacun des contrôles enfants de la présentation linéaire possède un certain nombre d'attributs intéressants, dont l'un appelé layout_weight. Nous en reparlerons dans quelques instants.
Les deux figures suivantes montrent à quoi cette disposition pourrait ressembler sur un périphérique en modes portrait et paysage:
Rappelez-vous que, dans l'activité, une seule ligne de code dans la méthode onCreate () est nécessaire pour charger et afficher une ressource de présentation à l'écran. Si la ressource de présentation était stockée dans le fichier /res/layout/rainbow.xml, cette ligne de code serait:
setContentView (R.layout.rainbow);
Vous pouvez également créer et configurer par programmation des mises en page linéaires. Ceci est fait en utilisant la classe LinearLayout (android.widget.LinearLayout). Vous trouverez les paramètres spécifiques aux enfants dans la classe LinearLayout.LayoutParams. En outre, les paramètres de présentation types (android.view.ViewGroup.LayoutParams), tels que layout_height et layout_width, ainsi que les paramètres de marge (ViewGroup.MarginLayoutParams) s'appliquent toujours aux objets LinearLayout..
Au lieu de charger une ressource de présentation directement à l'aide de la méthode setContentView () comme indiqué précédemment, vous devez créer le contenu de l'écran en Java, puis fournir un objet de présentation parent qui contient tout le contenu du contrôle à afficher sous forme de vues enfant dans setContentView (). méthode. Dans ce cas, votre mise en page parent serait la mise en page linéaire.
Par exemple, le code suivant montre comment faire en sorte qu'une activité instancie un LinearLayout par programme et y place trois objets TextView dans sa méthode onCreate ():
Accentsconagua
public void onCreate (Bundle savedInstanceState) super.onCreate (savedInstanceState); // setContentView (R.layout.rainbow); TextView tv1 = new TextView (this); tv1.setText ("FIRST"); tv1.setTextSize (100); tv1.setGravity (Gravity.CENTER); TextView tv2 = new TextView (this); tv2.setTextSize (100); tv2.setGravity (Gravity.CENTER); tv2.setText ("MIDDLE"); TextView tv3 = new TextView (this); tv3.setTextSize (100); tv3.setGravity (Gravity.CENTER); tv3.setText ("LAST"); LinearLayout ll = new LinearLayout (this); ll.setOrientation (LinearLayout.VERTICAL); ll.setLayoutParams (nouveaux LayoutParams (LayoutParams.FILL_PARENT, LayoutParams.FILL_PARENT)); ll.setGravity (Gravity.CENTER); ll.addView (tv1); ll.addView (tv2); ll.addView (tv3); setContentView (ll); Les deux figures suivantes montrent à quoi cette disposition pourrait ressembler sur un périphérique en modes portrait et paysage:
Regardons de plus près la liste de code Java ci-dessus. Tout d'abord, trois contrôles TextView sont créés et configurés. Chacun a une taille de texte (taille de police), un alignement du texte (gravité) et le texte lui-même. Ensuite, une mise en page linéaire est créée avec une orientation verticale. Ses paramètres de disposition lui permettent de remplir tout le parent (dans ce cas, tout l'écran) et sa gravité fait que tous les contrôles enfants sont centrés dans l'écran, et non dans le coin supérieur gauche. Chacun des trois contrôles TextView est ajouté en tant que vue enfant à l'aide de la méthode addView (). Enfin, la présentation linéaire est transmise à la méthode setContentView () en tant que contrôle parent à afficher à l'écran..
Comme vous pouvez le constater, la taille du code peut augmenter rapidement au fur et à mesure que de nouveaux contrôles sont ajoutés à l'écran. Pour l'organisation et la facilité de maintenance, il est préférable de définir et d'utiliser des mises en page par programmation plutôt que dans le cas contraire..
Parlons maintenant des attributs qui aident à configurer une présentation linéaire et ses contrôles enfants..
Certains attributs spécifiques s’appliquent aux dispositions linéaires. Parmi les attributs les plus importants que vous utiliserez avec les mises en page linéaires, citons:
En outre, les attributs généraux du style ViewGroup s’appliquent aux dispositions linéaires. Ceux-ci inclus:
La plupart des attributs de la mise en page linéaire sont assez explicites. Cependant, l'attribut layout_weight mérite un peu plus de discussion. Contrairement aux autres attributs de présentation linéaires, qui sont appliqués à la vue de présentation linéaire elle-même, cet attribut s'applique à ses contrôles enfants. Les valeurs de poids elles-mêmes doivent être des nombres (par exemple .50, .25, .10, .10, .05,), où le total si vous additionnez les valeurs de poids de tous les enfants est égal à 1 (100%)..
Le poids d'un enfant contrôle le degré d'importance ou d'espace qu'il a dans la présentation linéaire parente. Ceci est mieux illustré à l'aide d'un exemple. Revenons à la disposition linéaire arc-en-ciel que nous avons utilisée plus tôt. Afin de permettre à tous les contrôles enfants de «se développer» pour remplir la disposition linéaire de manière égale, quelle que soit la taille de l'écran, nous avons utilisé layout_weight pour attribuer des poids relatifs à chaque TextView. Comme il y a sept couleurs que nous voulons donner le même mérite, nous avons divisé 1 sur 7 et avons obtenu environ 0,143. Cependant, comme nous voulions que les pondérations soient égales à 1, cinq des pondérations des contrôles ont reçu une valeur de 0,14 et deux une valeur de 0,15, une différence subtile qui rend notre somme exactement égale à 1, mais elle est tout à fait perceptible. les premier et dernier contrôles.
Cette astuce de poids fonctionne bien lorsqu'il y a suffisamment d'espace à l'écran pour que toutes les commandes s'affichent correctement. Cela dit, lorsque l’espace devient restreint, l’attribut weight peut être remplacé par d’autres facteurs, tels que le découpage de la vue ou, dans le cas d’un TextView, l’essai de ne pas envelopper le texte. Cela devient évident lorsque nous modifions le fichier de disposition rainbow.xml pour qu'il contienne une disposition horizontale similaire (layout_height est également défini sur fill_parent)..
Les deux figures suivantes montrent ce que cette même présentation (modifiée uniquement en orientation horizontale) peut apparaître sur un périphérique en mode portrait et en mode paysage:
Nous nous attendons à ce que les zones rouges et violettes (poids 0,15) soient légèrement plus grandes que les autres couleurs (poids 0,14), mais ce n'est pas ainsi que cela s'affiche. Si vous regardez de près le RED TextView, il devrait occuper plus d’espace que son voisin ORANGE TextView. Cependant, comme "Rouge" est un mot court, et "Orange" ne l’est pas, il se bouscule automatiquement pour éviter que tous les mots s’emballent. Le résultat est plus agréable, mais il peut être un peu gênant de contourner le problème si ce n'est pas l'effet souhaité..
Les interfaces utilisateur des applications Android sont définies à l'aide de dispositions, et les dispositions linéaires sont l'un des types de disposition fondamentaux utilisés. La disposition linéaire permet d’organiser les contrôles enfants en une seule ligne (horizontalement) ou en une colonne (verticalement). Le placement du contrôle enfant peut être encore ajusté en utilisant les attributs de gravité et de poids.
Les développeurs mobiles Lauren Darcey et Shane Conder ont co-écrit plusieurs livres sur le développement Android: un livre de programmation en profondeur intitulé Développement d'applications sans fil Android et Sams TeachYourself Développement d'applications Android en 24 heures. Lorsqu'ils n'écrivent pas, ils passent leur temps à développer des logiciels mobiles dans leur entreprise et à fournir des services de conseil. Vous pouvez les contacter par courrier électronique à l'adresse [email protected], via leur blog à l'adresse androidbook.blogspot.com et sur Twitter @androidwireless..
