Ionic-framework: exploit : onglets glissables pour Android

Créé le 20 janv. 2016  ·  83Commentaires  ·  Source: ionic-team/ionic-framework

Type : exploit

Version ionique : 2.x

Plate -forme : vue Web Android 4.4

Ce serait formidable d'avoir une directive sur les onglets glissables, ou au moins d'autoriser l'option des onglets glissables dans la directive ion-tabs afin que nous puissions parcourir les onglets.

Ceci est implémenté par défaut dans la conception matérielle d'Android (http://developer.android.com/design/patterns/swipe-views.html#between-tabs), alors peut-être que cela ne devrait être appliqué qu'à la plate-forme Android. Je le demande dans Ionic 2.x car j'ai vu que Material Design a été intégré à Ionic.

Un exemple serait celui-ci :
SlideTabs Gif

J'ai découvert qu'il y avait un essai d'implémentation ici : https://github.com/JKnorr91/ion-slide-box-tabs , cependant, il a beaucoup de défauts.

Je suis sûr que cela pourrait être implémenté à l'aide de la directive ion-slide-box, mais selon la documentation, il sera obsolète et je ne suis pas sûr de la nouvelle API (introuvable nulle part)

stale issue

Commentaire le plus utile

Ce serait formidable (et logique) si les onglets eux-mêmes étaient également glissables :

ionic

Tous les 83 commentaires

il y avait un PR pour montrer comment faire cela dans ionic v2 avec des diapositives ioniques et un segment ionique, l'exemple de code se trouve dans le dossier de test du code source :
https://github.com/driftyco/ionic/pull/4970

@3dd13 , merci beaucoup, je vais y jeter un œil ! Je faisais des recherches dans les issues mais je n'ai pas pu trouver ce commit !

De plus, j'espère que cela fonctionnera bien, car le problème habituel est qu'il n'y a pas d'animation d'onglets lors du changement d'onglets

Je viens de publier hier mon application Ionic 2 GitNinja pour Android et j'ai reçu trois commentaires d'utilisateurs souhaitant pouvoir balayer entre les onglets. C'est ce à quoi les gens sont habitués sur Android, donc je pense que cette fonctionnalité serait géniale.

+1

+1

Ce serait formidable (et logique) si les onglets eux-mêmes étaient également glissables :

ionic

Au moins des transitions de page entre les onglets sont nécessaires pour Android (Windows Phone). C'est le comportement standard d'une application Android. Changer sans transitions de page semble en fait très étrange - d'autant plus que le changement d'onglet dans la barre d'onglets est bien animé. Le support par balayage serait bien sûr parfait.

+1 Ceci est un ux natif de base sur Android

+1 Cette fonctionnalité est la demande la plus fréquente que je reçois de mes utilisateurs

+1 Ici, cette fonctionnalité est également la demande la plus fréquente

+1 (également pour iOS)

Je suis surpris que ce ne soit pas dans la v1. Je suppose que c'est parce que l'interface utilisateur s'est davantage concentrée sur iOS ? (ou du moins j'ai eu cette impression)

@dasilvacontin c'est correct. Dans Ionic 2, nous mettons l'accent sur la conception de matériaux avec la conception ios (:

Mon application est prête pour la production, mais je ne peux pas la mettre en ligne sans onglets glissables.

+1 Mon application aussi...
:+1:

+1

Mon tout premier commentaire +1 sur github 😄

+1

+1

Voici également une exigence UX ... +1

De la bêta 3, il a été déplacé vers la bêta 12. :(

@pantonis Attendez -vous vraiment à cette fonctionnalité aussi ..

J'attends cette fonctionnalité de beta.3
Une fonctionnalité indispensable pour les applications destinées à Android

C'est une fonctionnalité compliquée à mettre en œuvre correctement, nous devons encore corriger quelques choses et des diapositives ioniques. Mais c'est entre nos priorités !

Voir également:
https://github.com/driftyco/ionic/issues/7075
https://github.com/driftyco/ionic/issues/7049
https://github.com/driftyco/ionic/issues/6726
https://github.com/driftyco/ionic/issues/5508

+1 hâte d'y être

+1 J'attends seulement deux choses pour migrer mon application vers ionic 2 : les onglets glissables et le support des webworkers.

+1

+1

+1 devrait être ajouté à Ionic 1 et Ionic 2 dès que possible.

Salut à tous! Je suis abonné à ceci pour obtenir des mises à jour utiles. Ionic a-t-il une politique sur les commentaires +1 ? Je reçois souvent des e-mails à ce sujet, seulement pour découvrir que quelqu'un a commenté "+1", ce qui ne semble pas constructif.

Bonjour @kz , nous n'avons pas vraiment de politique officielle sur les commentaires +1, je vous recommande de modifier vos paramètres de notification github si possible. De plus, juste pour que tout le monde sache que nous prévoyons d'implémenter cette fonctionnalité, et comme vous pouvez le voir sur le côté droit de github, elle est attribuée à beta.12, ce qui signifie que vous pouvez vous attendre à cette fonctionnalité dans cette version pour le moment. Je voudrais également demander à notre communauté qu'avant de commenter un +1, rappelez-vous simplement que l'équipe ici chez ionic et toute personne abonnée à ce problème en tant que @kz recevra des notifications lorsque vous commenterez, y compris un e-mail et que c'est mieux si votre commentaire ajoute du contenu, des idées, etc. au problème. Merci tout le monde!

j'attends ionic 2 : onglets glissables

+1 Je voudrais certainement l'utiliser.

+1 Une fonctionnalité indispensable !!!!!

Pourquoi est-il supprimé du jalon bêta 12 ? Vous êtes passé de la bêta 3 à la bêta 12, et maintenant même pas en bêta 12 ?

:(

Oui, j'attends avec impatience la version beta.12. Quand est la version beta.12 ?

Ce serait formidable si les onglets pouvaient glisser.

Bonjour à tous! Étant donné que nous nous rapprochons de notre version RC, nous avons décidé de prendre du recul et de nous concentrer sur l'arrêt des bogues dans la version bêta.12. Ce sont des bogues qui peuvent soit totalement casser une application, soit casser une grande partie de la fonctionnalité du framework. Cela ne signifie pas que nous n'allons pas implémenter de nouvelles fonctionnalités telles que ce problème, mais nous voulons vraiment nous concentrer sur l'obtention de ce que nous avons déjà super stable et prêt pour la production. De plus, beta.12 sera mis à jour vers angular 2 rc5 et devrait enfin inclure une compilation anticipée !

@jgw96 combien de versions candidates prévoyez-vous ? Si ce n'est pas un secret :sourire:

Bonne question! Espérons qu'il n'y en ait pas trop ! 😃

Pour le moment, nous n'en avons qu'un prévu, mais il y en aura peut-être plus. Vous pouvez toujours consulter notre feuille de route ici pour voir ce que nous prévoyons de faire. Merci!

Juste une note puisque par cette nouvelle, l'afflux de messages et de commentaires +1 va rendre fous tous ceux qui écoutent ce fil qui attendent des nouvelles réelles sur cette fonctionnalité. Vous pouvez obtenir des mises à jour de statut en utilisant le bouton d'abonnement sur la droite. Vous n'avez pas besoin de publier à moins que vous n'ayez quelque chose de digne de mention, et si vous avez besoin de +1, vous pouvez simplement utiliser l'emote +1 que Github a ajoutée pour réduire la colère, tout en permettant de voter. Il est temps de briser cette culture +1 que nous sommes tous coupables de faire proliférer .

Toutes les informations dont vous avez besoin pour juger et voter sur les fonctionnalités à venir : les jalons et leur feuille de route, ainsi qu'un tableau Trello pour voter.

Merci @mtpultz ! Nous n'avons pas de politique officielle sur les +1, mais nous vous demandons de vous rappeler que tous ceux qui sont abonnés à ce problème, ainsi que l'équipe d'Ionic reçoivent des e-mails et des notifications lorsqu'un nouveau commentaire est publié sur un problème, donc il est apprécié que le commentaire ajoute du contenu, des idées, des suggestions, etc. au problème plutôt qu'un simple +1. Encore une fois, ce n'est pas une politique officielle ou quoi que ce soit, juste quelque chose à retenir.

  • 1 pour les onglets à glisser Quand cette fonctionnalité sera-t-elle disponible ?

Cela fait-il donc partie des directives d'interaction utilisateur Windows, si je me souviens bien.
Peut-être que cette fonctionnalité devrait également être ajoutée à la plate-forme Windows par défaut.

Dans l'attente de cette fonctionnalité, je me suis battu pour l'exécuter sur mon application très complexe...

Bonjour! Nous déplaçons nos demandes de fonctionnalités vers un nouveau document de demande de fonctionnalités . J'ai déplacé cette demande de fonctionnalité dans la doc et pour cette raison, je fermerai ce problème pour l'instant. Merci d'avoir utilisé Ionic !

@jgw96 , hé, je suis l'affiche originale de ce numéro ici !
J'ai essayé d'éviter le spam car j'ai vu des tonnes de messages +1 ou "J'ai aussi besoin de ça".

Quoi qu'il en soit, c'est bien que vous déplaciez toutes les demandes de fonctionnalités dans un document, mais, juste comme une petite pensée (pour aider à ce changement de processus), peut-être qu'il pourrait être bon d'ajouter là dans le document le nombre de "J'aime" ou la pertinence de chaque numéro, car pour le moment, cela ressemble à une longue liste de problèmes classés au moment où il a été publié. Jusqu'à présent, nous savions en quelque sorte que vous aviez cela en priorité, mais il y avait d'autres problèmes, donc cette fonctionnalité a été interrompue. Je le dis simplement, car le problème n'est pas seulement la fonctionnalité, mais aussi les métadonnées qui l'accompagnent (réactions des personnes, sans toutefois dire que toutes sont pertinentes).
Et bien, maintenant que je vois ce document, je dirais que cela fait que tout le monde se sent un peu perdu sur ce qui sera votre prochaine étape...

Donc, afin d'éviter de perdre ces métadonnées, peut-être (comme idée rapide, en plus de l'écrire dans la doc), qu'en est-il à l'avenir, permettre aux gens de voter sur les fonctionnalités, comme nous le faisions un peu ici. Je suis sûr que cela vous aiderait vraiment à décider quelle serait la prochaine fonctionnalité à implémenter ;) Un petit site Web comme celui-ci prendrait environ 1 à 2 heures ou moins à créer, et de nombreux autres projets open source ou similaires ont un outil comme ça ;)

Mais quoi qu'il en soit, merci beaucoup pour le travail acharné de toute l'équipe Ionic, et heureux de voir que ce super framework est si génial, et bientôt un RC :D

Acclamations!

EDIT : Si quelqu'un d'autre est d'accord, n'hésitez pas à ajouter une réaction au message, mais pas en tant que message, mais en tant que réaction +1 appropriée (voir le bouton dans le coin supérieur droit du message ? Oui, là : D)

@Sturgelose Merci pour les idées ! Nous expérimentons actuellement zenhub (désolé pour toute confusion), nous ne pouvons donc même pas conserver l'idée de la liste des fonctionnalités de google doc. Pour cette raison, je rouvre ce problème pour le moment.

Merde tout le monde.

Cela signifie que le http://ideas.ionic.io/ideas/top n'a pas été utilisé ?

Cette fonctionnalité est la deuxième priorité de la communauté, basée sur les votes populaires. Les choses sont, aucun mot n'a été donné à ce sujet, et je me demandais si le site était d'aucune utilité, maintenant c'est une confirmation ?

Quoi qu'il en soit, félicitations pour le bon travail, merci.

@ victorivens05 il y a eu une certaine confusion avec ce site, ce n'est _pas_ pour Ionic Framework, c'est pour Ionic Cloud. Nous devons régler cela.

Merci pour les commentaires à tous, c'est définitivement sur la liste, mais nous devons d'abord sortir le RC, ce qui devrait arriver sous peu.

J'espère que ce sera dans le jalon RC1...

@NgYueHong Pas encore en RC0 ?

@infinnie Je n'en vois aucune mention dans le journal des modifications et ce problème reste toujours ouvert.

Cela devrait être en priorité 1 lol ! +1
J'espère que ce n'est pas implémenté en utilisant ion-slides .
Cela a foiré UX dans ionic 1. alors que l'utilisateur essaie de faire défiler plus rapidement comme il le ferait dans une application native normale, l'onglet changerait. Ce n'était pourtant pas officiel.

Fast scrolling et sliding tabs ne vont pas de pair lorsque ion-slides sont utilisés.

Prenez votre temps, mais ce serait bien si les diapositives ne sont pas utilisées.

Toute la meilleure équipe ionique 👍

J'ai mis à jour 4970 qui utilise des segments et des diapositives pour fonctionner avec RC0.

Il est disponible sous forme d'essentiel https://gist.github.com/aarjithn/d282b019f6046f0de2f0ded623554313.

Le seul problème que je vois avec cela est que les onglets eux-mêmes ne sont pas glissables.

https://github.com/leoruhland/ion-slides-tabs a l'air bien, ce serait bien si quelqu'un pouvait le porter sur ionic2.

Salut essayé votre suggestion et exemple;
Et l'a mis en œuvre ; fonctionne bien pour la version beta 2.
Ressemble à:

#
screen shot 2016-10-14 at 18 41 01

Ce que je recherche, c'est une amélioration un peu "de l'interface utilisateur Tinder":

  • Pas d'interface utilisateur d'onglets mais juste des icônes
  • Où l'on aurait un logo au centre
  • Avoir une classe active pour l'onglet sélectionné

tinder-ui

Des pensées pour modifier l'exemple vers cela?

Des onglets glissables seraient formidables, mais les implémenter avec des diapositives ioniques n'est pas optimal, du moins pas si vous souhaitez conserver, par exemple, une pile de navigation distincte dans l'un d'eux.

D'accord avec @Alx101 .
Ma suggestion serait d'utiliser un attribut sur la balise tab/segment. Comme "ion-sweep=true".

Cette amélioration sera fantastique, je l'attends jour après jour ! :)

Merci!

Est-il encore prévu d'inclure cette fonctionnalité dans ionic2 ? Non mentionné dans aucune réunion-cadre depuis le 2016-07-29. J'attends cette fonctionnalité depuis le premier jour...

Peut-être que cela devrait être placé dans un nouveau numéro, vu que celui-ci est fermé et a probablement coulé dans le "tuyau" en faveur des problèmes ouverts ?

Salut tout le monde, ce sujet est toujours ouvert. Il y a un PR ouvert pour cela ici : https://github.com/driftyco/ionic/pull/7185. Cependant, il faut le revoir. Le dernier objectif est que nous voulons que notre composant Segment soit égal en termes de conception/fonctionnalité au composant Material Design Tabs , y compris la possibilité de glisser. Il reste encore beaucoup à faire pour y parvenir. Bien que nous aimerions passer du temps là-dessus, nous nous concentrons actuellement sur la correction de bogues et l'amélioration du cadre existant. Je vais cependant ajouter ceci au jalon afin que je puisse me souvenir de le revoir. Merci pour votre patience, nous savons qu'il s'agit d'une fonctionnalité très recherchée et nous voulons absolument l'intégrer au framework !

+1

+1 pour les segments balayables !

Avez-vous des idées sur la façon de changer cela pour ressembler aux onglets coulissants de l'amadou ?
Pourrions-nous supprimer les onglets en haut ou les relooker pour qu'ils ressemblent à l'interface utilisateur de Tinder ou existe-t-il un autre moyen de le faire ?

Les onglets coulissants fonctionnent bien tels quels, je voudrais supprimer les indicateurs d'onglets et les remplacer par une icône à la place.

Remplacer ceci :

<ion-toolbar>
    <ion-segment [(ngModel)]="selectedSegment" (ionChange)="onSegmentChanged($event)">
        <ion-segment-button value="first">
            Profiel
        </ion-segment-button>
        <ion-segment-button value="second">
            Voorstellen
        </ion-segment-button>
        <ion-segment-button value="third">
            Account
        </ion-segment-button>
    </ion-segment

Sans perdre "l'état" pour mettre en évidence ou afficher une certaine icône.
Des pensées?

Quelle serait également la meilleure pratique pour charger le contenu des onglets coulissants ?
Est-ce que l'on placerait toute l'application dans ce slidepage.html ou serait-il préférable d'avoir des pages séparées et de les charger dans les onglets en fonction du nom de la page ?

captura de pantalla 2016-11-18 a las 10 08 56
:(

Je ne sais même pas pourquoi ceux-ci s'appellent rc.x :)

@gbelmm , ce n'est pas parce que nous le déplaçons des jalons que nous n'y travaillons pas ou que nous ne le prenons pas au sérieux. Nous essayons de sortir des versions au maximum toutes les deux semaines, ce qui signifie que certaines choses plus difficiles devront attendre parce que nous ne voulons pas vous envoyer des choses cassées (nous faisons des erreurs, cependant).

Nous essayons d'être très transparents mais nous ne garantissons jamais que des problèmes ou des fonctionnalités sortiront à un moment donné.

C'est la nature du génie logiciel !

@mlynch Je sais que ce problème ou cette fonctionnalité est difficile car il n'y a pas de comportement par défaut sur iOS. Je veux cette fonctionnalité pour mon application, mais je sais que c'est difficile, alors prenez le temps dont vous avez besoin car vous le méritez, haha, vous faites du bon travail en faisant du RC si souvent.

@jgw96 Pourquoi cette fonctionnalité est-elle maintenant supprimée du jalon ? :(

J'attendais aussi cette fonctionnalité :/

Je fais un exemple simple de 2 swipedTabs, j'espère que cela aidera jusqu'à ce que je termine le plugin complet.
Lien Youtube

Lien github


Les gars, ils travaillent sur les RC, cela signifie qu'ils se concentrent uniquement sur la correction des bogues sur les fonctionnalités 2.0.0 uniquement. Il y aura donc d'abord une version finale 2.0.0, puis peut-être qu'ils introduiront de nouvelles fonctionnalités en 2.1 ou 2.0.1, alors soyez patient. J'attends ça aussi alors attends.

C'est tout :)

Je suis juste un peu préoccupé par l'architecture ionique 2 si une fonctionnalité aussi bien cotée ne peut pas être résolue en un an.

Ok, les gars, OP du problème ici. Oui, cela prend beaucoup de temps, mais les gars, nous devons réaliser que Ionic 2 a été créé presque à partir de zéro l'année dernière, ce qui signifie qu'il n'y a pas tellement de temps pour gérer de grandes fonctionnalités comme celle-ci. Ainsi, faire passer une plate-forme comme celle-ci de la version bêta à une version presque en 1 an est une énorme réussite. De plus, si nous lisons un peu tous les commentaires (et nous débarrassons du spam), vous verrez que la fonctionnalité est retardée car il y a des prérequis. Copie d'un poste beaucoup plus haut:

C'est une fonctionnalité compliquée à mettre en œuvre correctement, nous devons encore corriger quelques choses et des diapositives ioniques. Mais c'est entre nos priorités !

Voir également:

7075

7049

6726

5508

De tous ces problèmes, tous ont été fermés mais le dernier, qui est toujours ouvert, a encore besoin de travail.

Oui, je suis d'accord, cette fonctionnalité a reçu des tonnes de demandes et moi la première 😏 Mais nous devons comprendre que s'ils nous fournissent une fonctionnalité mal implémentée, nous continuerons également à nous plaindre et je suis sûr qu'ils ne veulent pas offrir une mauvaise expérience lorsqu'ils savent que cela ne fonctionnera pas bien à cause des problèmes répertoriés précédemment. Donc, je préfère attendre un peu plus et avoir une fonctionnalité correctement implémentée plutôt que d'essayer de pirater le code. De plus, nous pouvons toujours utiliser une vue à onglets sans balayer, ce qui n'est pas si mal.

En somme, les gars et les filles, ayons patience et confiance en eux. Quoi qu'il en soit, j'en profite pour vous souhaiter à tous un joyeux Noël et de joyeuses fêtes !

COMMENTAIRE SUPPLÉMENTAIRE :
Et s'il vous plaît, nous avons tous les mêmes pensées sur les retards et tout. N'oubliez pas que la messagerie ici informe tous ceux qui s'abonnent. À moins que ce ne soit quelque chose de constructif, essayez de vous retenir. Sinon, vous pouvez toujours utiliser les réactions aux publications !! 👍

ça a une solution?

@adamdbradley @brandyscarney @mlynch @jgw96

Génial, la version 2.0 est enfin sortie. Maintenant, intégrons cette fonctionnalité d'onglet Swipeable tant attendue dans les prochaines mises à jour.

Si vous ne voulez pas attendre un composant officiel, vous pouvez utiliser deux curseurs pour créer votre propre composant "Swipeable Tab".
J'utilise deux curseurs (à l'intérieur de la barre de navigation ionique et de la zone de contenu ionique) et je les laisse se contrôler.

@ViewChild('pageSlider') pageSlider: Slides;
@ViewChild('headerSlider') headerSlider: Slides;
...
this.headerSlider.control = this.pageSlider;
this.pageSlider.control = this.headerSlider;

Cela fonctionne assez bien pour mon application (rc6 ou final).

Je ne peux pas croire que 2.0 ait été déclaré sans cette fonctionnalité. Si cela n'est pas implémenté, il est vraiment évident pour les utilisateurs que l'application n'est pas native car c'est quelque chose d'attendu pour chaque application Android.

Salut tout le monde,

Nous savons qu'il s'agit d'une caractéristique importante pour vous tous. Nous sommes bien conscients que c'est quelque chose que nous devons ajouter; il est en haut de notre liste de fonctionnalités. Notre objectif était de publier la version 2.0 finale, d'obtenir des corrections de bogues, puis de recommencer à ajouter des fonctionnalités. Croyez-moi, nous aimerions passer la plupart de notre temps à ajouter des fonctionnalités, mais ce n'est pas possible lorsqu'il y a des bogues qui empêchent nos utilisateurs d'utiliser leurs applications. Ce n'est pas aussi simple que d'ajouter du CSS à certains onglets. Cela nécessitera de mettre à jour notre composant de segment, de s'assurer qu'il interagit correctement avec les autres gestes, d'ajouter un style supplémentaire, etc.

L'ajout de commentaires à ce problème demandant des mises à jour nous distrait. Je vais verrouiller ce problème pour cette raison. Nous mettrons à jour le problème lorsque nous aurons des nouvelles à partager à ce sujet. Nous apprécions votre patience. 🙂

Cette page vous a été utile?
0 / 5 - 0 notes