gridView avec des cellules différentes tailles, pinterest style

Fond

GridView est une classe qui étend la classe AdapterView , ce qui signifie qu'il affiche les cellules dans une grille de style de manière efficace, le recyclage des vues anciennes comme des nouvelles lorsque l'utilisateur fait défiler il.

Le problème

Parfois, vous voulez obtenir une INTERFACE spéciale, qui ressemble à du Windows Phone Tuiles de l'INTERFACE utilisateur, ayant des cellules de tailles différentes sur le dessus les uns des autres.

Quelque chose comme ceci:

AABB
AACC
AADD
AADD

chaque lettre représente une partie de sa cellule, de sorte que la cellule est Un 2x4 , des cellules B et des cellules C de prendre 2x1 chaque , et de la cellule D 2x2 .

Il pourrait être encore plus que cela, où la cellule D de terminer un peu au-dessus de ce que j'ai montré, et juste en dessous il y a une autre cellule, donc la fin de la D et la fin de l'Un ne sont pas nécessaires alignés.

un exemple d'une application qui a ce style est pinterest .

GridView n'autorise pas une telle chose.

En fait , toutes les solutions que j'ai essayé a des problèmes. Voudrais demander si il y a d'autres alternatives ou de meilleures solutions.

Ce que j'ai trouvé

Il y a plusieurs façons de gérer ce problème:

  1. Comme une classe qui étend la classe AdapterView GridView a la possibilité d'avoir un type pour chaque élément (à l'aide de la BaseAdapter), ce qui vous permettrait de définir à quelle à la disposition de la cellule .

    Cependant, il a encore des limites, parce que vous obtiendrez des lignes d'éléments, l'un sous l'autre. vous devez les avoir alignés.

  2. GridLayout est une relativement nouvelle mise en page, et c'est tout à fait flexible. Google a publié une belle bibliothèque de compatibilité pour elle, supporing API7 et au-dessus.

    Cependant, il n'utilise pas tout de recyclage de vues, donc c'est un mauvais choix dans le cas où vous souhaitez afficher un grand nombre d'éléments.

    Si vous avez beaucoup d'articles, vous devez créer tous les points de vue pour eux .

  3. QuiltView Bibliothèque - s'étend de GridLayout, donc, fondamentalement, a le même problème comme ça.

  4. StaggeredGridView - paraît le plus prometteur, mais il a beaucoup de bugs, surtout lors d'un changement d'orientation. de tels bugs comprennent des cellules vides, mal de défilement et des Npe (rare mais arrive encore). Je suis également pas sûr si elle prend en charge personnalisée cellules au lieu de imageViews seul .

  5. d'autres solutions, comme le mentionne ici .

La question

Personne ne sait d'une autre solution à ce problème? Peut-être quelques solutions de contournement pour l'une des solutions que je vous ai montré?

EDIT: je pense que sur StaggeredGridView , le défilement et des exceptions peuvent être résolus en utilisant une normale ImageView que vous définissez sa taille à l'intérieur de la getView. je pense que la raison pour qu'il fonctionne d'une manière bizarre, c'est que les mises à jour de l'échantillon la taille de l'imageview après qu'il a été chargé à partir de l'internet.

Cependant, des cellules vides question demeure dans cette bibliothèque. non seulement cela, mais leurs tailles changer beaucoup de choses , même sans modification de l'orientation.

EDIT: pour l'instant, je pense que la meilleure solution est d'utiliser , PinterestLikeAdapterView bibliothèque.

il n'a pas de problèmes que je peux trouver.

toutefois, il ne peut pas faire des articles à prendre plus de 1 largeur de la cellule. c'est très bon quand même.

EDIT: malheureusement, il a des problèmes avec notifyDataSetChanged . j'ai signalé à ce sujet ici.

  • Je serais fortement recommander ceci double synchronisée ListView bibliothèque. C'est plus efficace que l'utilisation d'un contrôle GridView
  • je l'ai déjà mentionné cette solution (#5 dans la liste) . il a beaucoup de problèmes. il ne peut pas utiliser une seule carte pour tous les éléments. ce n'est pas fluide (fait défiler les listviews l'un après l'autre), et il n'est pas personnalisable (impossible de définir le nombre de colonnes).
  • jayway.com/2014/02/17/a-multi-column-list
InformationsquelleAutor android developer | 2013-09-01
  1. 17

    Est un peu tard pour répondre?

    consulter cette bibliothèque de etsy.
    il a l'air très prometteur.

    https://github.com/etsy/AndroidStaggeredGrid

    Je pense que c'est la version la plus récente de https://github.com/maurycyw/StaggeredGridView

    .

    Mis à jour.

    Essayez d'utiliser RecyclerView StaggeredGridLayoutManager de google au lieu

        RecyclerView recyclerView = (RecyclerView) findViewById(R.id.recycler_view);
    recyclerView.setLayoutManager(new StaggeredGridLayoutManager(2, StaggeredGridLayoutManager.VERTICAL));
    recyclerView.setItemAnimator(new DefaultItemAnimator());
    recyclerView.setAdapter(adapter);
    • ça fonctionne bien? a-t-elle tous les bugs connus?
    • J'ai essayé les deux et juge de la configuration par défaut, je pense que c'est mieux. Dans mon cas, etsy peut facilement intégrer avec chris banes tirez-la pour la libération de bien.
    • ils disent qu'il manque de quelques choses de base: "La StaggeredGridView ne prend pas en charge les éléments suivants:Élément sélecteur de un drawable, Élément long de l'événement de presse,des barres de Défilement Ligne diviseurs,les effets de Bord,la Décoloration bord,Overscroll"
    • Comment à ce sujet: developer.android.com/reference/android/support/v7/widget/...
    InformationsquelleAutor Krit
  2. 5

    Je pense que RecyclerView avec StaggeredGridLayoutManager peut résoudre ce problème, et que si vous souhaitez vous aussi avoir un rapide barre de défilement, vous pouvez essayer cette bibliothèque.

    Donc, plus de truc sont nécessaires, que Google a fourni une solution...

    • Je n'arrive toujours pas trouver une bonne widget, par exemple, j'ai essayé de mettre en œuvre StaggeredGridLayoutManager, mais ne peut pas, de regarder la question, j'ai fait face à this. Si vous trouvez une mise en œuvre de il pouvez-vous ajouter la référence. merci.
    InformationsquelleAutor android developer
  3. 0

    Vous pouvez être en mesure d'accomplir ceci avec un seul ListView, où chaque cellule contient un autre modèle de grille. J'ai fait quelque chose de similaire à ce que vous décrivez, à l'aide de cette technique. Si la taille de la cellule besoin d'être unique, cela ne fonctionne pas, mais il devrait être suffisant pour le cas que vous avez décrit:

    AABB
AACC
AADD
AADD

    La création d'une poignée de modèles de ce genre, avec les diverses dispositions des A,B,C,D, vous pouvez au hasard, puis de les utiliser comme ListView cellules et un simple décalage de mathématiques permettrait à votre adaptateur pour remplir chaque subcell accomplir quelque chose comme ce qui suit:

    AABB
AACC
AADD
AADD

BBBB
ACCC
ADDD
ADDD

AAAA
BBCC
BBCC
DDDD

AABB
AACC
AADD
AADD

AABB
AACC
DDDD
DDDD
    • ce que j'ai montré est juste un exemple. il y a plusieurs façons possibles de mettre les cellules, et le nombre de cellules de l'appareil peuvent changer comme il y a des petits appareils et des gros appareils (tablettes par exemple), et vous pourriez vouloir changer les choses lorsque l'appareil est sur le paysage au lieu de portrait. c'est une bonne solution si.
    InformationsquelleAutor Graham