Au cours de Google I / O 2015, Google a présenté la bibliothèque de support technique pour les développeurs Android. Grâce à cette bibliothèque, les développeurs peuvent facilement implémenter davantage de concepts de conception de matériaux dans leurs applications, car de nombreux éléments clés n'étaient pas disponibles au départ. En plus d'être facile à utiliser, la bibliothèque de support technique de Design est rétro-compatible avec l'API 7. La bibliothèque de support technique de conception peut être incluse dans vos projets Android en important la dépendance Gradle..
compiler 'com.android.support:design:22.2.0'
Il existe deux grandes catégories d’outils dans la bibliothèque de support de conception:
Nous commencerons par examiner quels nouveaux composants visuels sont disponibles pour améliorer le rendu de vos applications..
Éditer le texte
Les vues ont été autour dans Android depuis le tout début, et bien qu'elles soient simples à utiliser, elles n'ont pas beaucoup changé. Avec la Design Support Library, Google a introduit une nouvelle vue de conteneur appelée TextInputLayout
. Cette nouvelle vue ajoute des fonctionnalités à la norme Éditer le texte
, tels que la prise en charge des messages d'erreur et des astuces animées pour rendre votre interface utilisateur pop.
Comme indiqué dans l'extrait ci-dessous, TextInputLayout
peut être inclus dans votre fichier de mise en page comme un wrapper pour un standard Éditer le texte
.
Gianluca Segato examinera de plus près le TextInputLayout
composant dans un prochain tutoriel.
Le bouton d'action flottante est l'un des composants d'interface utilisateur les plus prédominants dans les applications Material Design. Depuis leur introduction, les développeurs ont dû créer ces boutons à partir de zéro ou choisir l'une des nombreuses bibliothèques tierces conçues spécifiquement autour de ces boutons..
Avec la bibliothèque de support de conception, des boutons d'action flottants peuvent être inclus dans une présentation et ancrés à une partie de l'écran à l'aide de quelques lignes XML simples. Chaque bouton est facilement personnalisable avec des icônes et des couleurs. Deux tailles sont disponibles, la norme (56dp) et mini (40dp). L'un des principaux avantages est que ces boutons seront désormais pris en charge par Google à mesure que leur design évoluera..
Tandis que ViewPager
et DrawerLayout
composants ont été disponibles pendant un certain temps à travers le bibliothèque de support v4, Google les a développés en fournissant deux nouveaux widgets connexes. La première est une version officielle de la bibliothèque ViewPagerIndicator couramment utilisée par Jake Wharton, appelée TabLayout
. La seconde est la NavigationView
, qui fournit un support pour les vues d'en-tête de tiroir.
TabLayout
TabLayout
les composants peuvent avoir du contenu ajouté à eux manuellement dans le code en utilisant l'un des addTab
méthodes. Regardez l'exemple suivant.
tabLayout.addTab (tabLayout.newTab (). setText ("Tab 1")); tabLayout.addTab (tabLayout.newTab (). setText ("Onglet 2")); tabLayout.addTab (tabLayout.newTab (). setText ("Onglet 3"));
Alternativement, vous pouvez associer TabLayout
composants avec un ViewPager
. Ceci est accompli en appelant setupWithViewPager ()
, en passant dans le ViewPager
comme premier et unique argument. C’est une autre façon de changer les sections de la ViewPager
. Il convient de noter que getPageTitle ()
doit être remplacé lors de l'utilisation TabLayout
avec un ViewPager
donner un nom à chaque onglet.
NavigationView
NavigationView
est un nouveau widget qui étend les fonctionnalités du DrawerLayout
. Les développeurs peuvent désormais ajouter des dispositions d'en-tête dans le tiroir et marquer les sections sélectionnées avec ce composant facile à utiliser..
En plus de cela, il est maintenant très simple de créer des sections et des sous-sections dans le tiroir à l'aide de fichiers de ressources de menu. Pour commencer, un NavigationView
doit simplement être associé à un DrawerLayout
en XML.
Tandis que le Pain grillé
message a été un aliment de base d'Android pendant des années, un nouveau widget d'interface utilisateur appelé Snackbar
est disponible pour fournir une fonctionnalité similaire avec un look amélioré. Non seulement le Snackbar
Présenter des informations à l'utilisateur pendant une courte période, il prend également en charge une action unique pour ajouter une fonctionnalité contextuelle à vos applications et peut être ignoré par un geste de balayage..
Snackbar
est mis en œuvre de manière similaire à Pain grillé
, il convient toutefois de noter que pour en créer une nécessite une vue pouvant être utilisée pour rechercher le bas de l'affichage de l'application..
Snackbar.make (vue, "Action", Snackbar.LENGTH_LONG) .setAction ("Action!", Nouvelle View.OnClickListener () @Override public void onClick (View v) Log.e ("App", "Action", "Action! "); ) .spectacle();
Le comportement et l’animation d’une interface utilisateur est très important dans la conception de matériaux. Pour faciliter cela, Google a publié plusieurs composants dans la bibliothèque de support technique de conception qui aident les cas d'utilisation courants. Kerry Perez-Huanca se penchera sur cet aspect de la bibliothèque de support de conception dans un prochain tutoriel..
Vous avez peut-être remarqué dans l'exemple précédent que le FloatingActionButton
déplacé lorsque le Snackbar
vue est apparue. Ceci est fait en utilisant un nouveau widget appelé le Coordonnateur
, qui enveloppe les vues qui devraient être déplacées pour faire place à d'autres vues.
De nombreux développeurs ont demandé un moyen plus simple d'afficher une image de parallaxe fonctionnant avec un motif de conception à retour rapide, disparaissant ou réapparaissant lorsque l'utilisateur fait défiler. Vous pouvez voir ce comportement dans le Play Store pour les listes d'applications. Pour permettre aux développeurs de mettre cela en œuvre sans passer trop de temps à écrire du code redondant, Google a publié CollapsingToolBarLayout
et AppBarLayout
vues. En utilisant diverses options dans ces widgets, les développeurs peuvent épingler des vues en haut de l'écran ou spécifier quand ces vues doivent devenir visibles lorsque l'utilisateur fait défiler l'écran..
La bibliothèque de support de conception a apporté de nombreux outils tant attendus à Android. Lorsqu'il est associé à la bibliothèque AppCompat, il est beaucoup plus facile d'ajouter Material Design aux applications tout en maintenant la compatibilité avec les versions antérieures..
Vous trouverez de nombreux exemples d'utilisation de ces nouveaux composants dans l'application de référence officielle de Google, CheeseSquare, et Tuts + continuera à fournir des didacticiels détaillés sur la mise en œuvre de ces nouvelles fonctionnalités..