hubo un PR para demostrar cómo hacer eso en ionic v2 con ion-slides y ion-segment, el código de muestra está en la carpeta de prueba del código fuente:
https://github.com/driftyco/ionic/pull/4970

@ 3dd13 , muchas gracias, ¡le echaré un vistazo! ¡Estaba haciendo búsquedas en los problemas pero no pude encontrar este compromiso!

Además, espero que funcione bien, ya que el problema habitual es que no hay animación de pestañas al cambiar de pestaña.

Acabo de lanzar mi aplicación Ionic 2 GitNinja ayer para Android y recibí tres comentarios de usuarios que querían poder pasar de una pestaña a otra. Esto es a lo que la gente está acostumbrada en Android, así que creo que esta característica sería genial.

+1

+1

Sería genial (y lógico) si las pestañas también se pudieran deslizar:

Se necesitan al menos transiciones de página entre pestañas para Android (Windows Phone). Es el comportamiento estándar de una aplicación de Android. Cambiar sin transiciones de página parece muy extraño en realidad, especialmente porque el cambio de pestaña en la barra de pestañas está muy bien animado. El soporte de deslizamiento sería, por supuesto, perfecto.

+1 Este es un ux nativo básico en Android

+1 Esta característica es la solicitud más frecuente que recibo de mis usuarios

+1 Aquí, esta función también es la solicitud más frecuente

+1 (también para iOS)

Me sorprende que esto no estaba en v1. Supongo que es porque la interfaz de usuario se ha centrado más en iOS. (o al menos me dio esa impresión)

@dasilvacontin eso es correcto. En Ionic 2 estamos enfocando el diseño de materiales junto con el diseño de ios (:

Mi aplicación está lista para la producción, pero no puedo ejecutarla sin pestañas deslizables.

+1 Mi aplicación también...
:+1:

+1

Mi primer comentario +1 en github 😄

+1

+1

También aquí hay un requisito de UX... +1

De la beta 3 se movió a la beta 12. :(

@pantonis Realmente espero esta función también...

Estoy esperando esta característica de beta.3
Una característica muy necesaria para aplicaciones dirigidas a Android

Es una función complicada de implementar correctamente, todavía tenemos que arreglar un par de cosas y deslices de iones. ¡Pero está entre nuestras prioridades!

Ver también:
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 esperando esto

+1 Estoy esperando solo dos cosas para migrar mi aplicación a ionic 2: pestañas intercambiables y soporte para trabajadores web.

+1

+1

+1 Debería agregarse a Ionic 1 e Ionic 2 lo antes posible.

¡Oigan todos! Estoy suscrito a esto para recibir actualizaciones útiles. ¿Ionic tiene una política sobre comentarios +1? Recibo correos electrónicos sobre esto con bastante frecuencia, solo para descubrir que alguien comentó '+1', lo que no parece constructivo.

Hola @kz , en realidad no tenemos una política oficial sobre los comentarios +1, recomendaría cambiar la configuración de notificación de github si es posible. Además, para que todos sepan que estamos planeando implementar esta función y, como puede ver en el lado derecho de github, está asignada a beta.12, lo que significa que puede esperar esta función en esa versión en este momento. También me gustaría pedirle a nuestra comunidad que antes de comentar un +1 solo recuerde que el equipo aquí en ionic y cualquiera que esté suscrito a este problema como @kz recibirá notificaciones cuando comente, incluido un correo electrónico y eso es lo mejor. si su comentario agrega contenido, ideas, etc. al problema. ¡Gracias a todos!

estoy esperando ionic 2: pestañas intercambiables

+1 Definitivamente me gustaría usar esto.

+1 ¡Una característica imprescindible!!!!!

¿Por qué se elimina del hito beta 12? ¿Pasó todo el camino de la beta 3 a la beta 12, y ahora ni siquiera en la beta 12?

:(

Sí, espero con ansias el lanzamiento de la versión beta.12. ¿Cuándo es el lanzamiento beta.12?

Sería genial si las pestañas se pueden deslizar.

¡Hola, todos! Dado que nos estamos acercando mucho a nuestro lanzamiento de RC, decidimos dar un paso atrás y centrarnos en mostrar errores de detención en beta.12. Estos son errores que pueden romper totalmente una aplicación o romper una gran parte de la funcionalidad del marco. Esto no significa que no vamos a implementar nuevas características como este problema, pero realmente queremos centrarnos en obtener lo que ya tenemos súper estable y listo para producir. ¡También beta.12 se actualizará a angular 2 rc5 y finalmente debería incluir una compilación anticipada!

@ jgw96 ¿cuántos candidatos de lanzamiento planeas? Si no es un secreto :sonrisa:

¡Buena pregunta! ¡Ojalá no demasiados! 😃

Por el momento solo tenemos 1 planeado, pero puede haber más. Siempre puede consultar nuestra hoja de ruta aquí para ver qué planeamos hacer. ¡Gracias!

Solo una nota, ya que con esta noticia, la afluencia de publicaciones y comentarios de +1 volverá locos a todos los que escuchan este hilo y esperan noticias reales sobre esta función. Puede obtener actualizaciones de estado utilizando el botón de suscripción a la derecha. No necesita publicar a menos que tenga algo digno de mención, y si necesita hacer +1, puede usar el emote +1 que Github ha agregado para reducir la ira, pero aún permitir la emisión de votos. Es hora de romper con esta cultura del +1 que todos somos culpables de proliferar .

Toda la información que necesita para juzgar y votar sobre las próximas funciones: hitos y su hoja de ruta, así como un tablero de Trello para votar.

¡Gracias @mtpultz ! No tenemos una política oficial sobre los +1, pero le pedimos que recuerde que todos los que están suscritos a este problema, así como el equipo aquí en Ionic, reciben correos electrónicos y notificaciones cuando se publica un nuevo comentario en un problema, así que se agradece si el comentario agrega contenido, ideas, sugerencias, etc. al problema en lugar de solo un +1. Nuevamente, esta no es una política oficial ni nada, solo algo para recordar.

• 1 para pestañas deslizables ¿Cuándo se lanzará esta función?

Entonces, ¿es parte de la guía de interacción del usuario de Windows, según recuerdo?
Tal vez esta función también debería agregarse a la plataforma Windows de forma predeterminada.

Espero con ansias esta función, he estado luchando para ejecutarla en mi aplicación muy compleja...

¡Hola! Estamos trasladando nuestras solicitudes de funciones a un nuevo documento de solicitud de funciones. He movido esta solicitud de función al documento y por eso cerraré este problema por ahora. ¡Gracias por usar Ionic!

@ jgw96 , ¡hey, soy el autor original de este número aquí!
He estado tratando de evitar el spam ya que he visto toneladas de mensajes +1 o "También necesito este".

De todos modos, es bueno que estés moviendo todas las solicitudes de funciones en un documento, pero, solo como un pequeño pensamiento (para ayudar en este cambio de proceso), tal vez podría ser bueno agregar allí en el documento la cantidad de 'Me gusta' o relevancia que tiene cada problema, ya que en este momento se siente como una larga lista de problemas ordenados por el momento en que se publicó. Hasta ahora, sabíamos que tenías esto como prioridad, pero hubo otros problemas, por lo que esta función se detuvo. Solo lo digo porque un problema no es solo la función, sino también los metadatos (reacciones de las personas, aunque no digo que todas sean relevantes).
Y bueno, ahora que veo ese documento, diría que hace que cualquiera se sienta un poco perdido sobre cuál será su próximo paso...

Entonces, para evitar perder estos metadatos, tal vez (como una idea rápida, además de escribirlo en el documento), ¿qué pasa en el futuro, permitir que las personas voten sobre las funciones, como lo estábamos haciendo aquí? Estoy seguro de que realmente te ayudaría a decidir cuál sería la próxima característica a implementar ;) Un sitio web pequeño como este, tomaría de 1 a 2 horas o menos para crearlo, y muchos otros proyectos de código abierto o similares tienen una herramienta. Me gusta esto ;)

Pero de todos modos, muchas gracias por el arduo trabajo de todo el equipo de Ionic, y me alegra ver que este gran marco se ve tan increíble y pronto será un RC: D

¡Salud!

EDITAR: si alguien más está de acuerdo, siéntase libre de agregar una reacción a la publicación, pero no como un mensaje, sino como una reacción de +1 adecuada (¿ve el botón en la esquina superior derecha del mensaje? Sí, allí: D)

@Sturgelose ¡ Gracias por las ideas! En realidad, estamos experimentando con zenhub ahora (perdón por cualquier confusión), por lo que es posible que ni siquiera mantengamos la idea de la lista de funciones de Google Doc. Debido a esto estoy reabriendo este tema por ahora.

Hola a todos.

¿Esto significa que http://ideas.ionic.io/ideas/top no se ha utilizado?

Esta característica es la segunda en prioridad de la comunidad, según los votos populares. Las cosas son, no se dijo nada al respecto, y me preguntaba si el sitio era de alguna utilidad, ¿ahora eso es una confirmación?

De todos modos, felicidades por el buen trabajo, gracias.

@victorivens05 hubo cierta confusión con ese sitio, no es para Ionic Framework, es para Ionic Cloud. Necesitamos arreglar eso.

Gracias por los comentarios a todos, esto definitivamente está en la lista, pero primero debemos sacar el RC, lo que debería suceder en breve.

Espero que esto esté en el hito RC1...

@NgYueHong ¿ Aún no está en RC0?

@infinnie No veo ninguna mención al respecto en el registro de cambios y este problema aún permanece abierto.

Esto debería estar en prioridad 1 lol! +1
Espero que no esté implementado usando ion-slides .
Eso arruinó UX en ionic 1. Mientras el usuario intenta desplazarse más rápido como lo haría en una aplicación nativa normal, la pestaña cambiaría. Aunque no era oficial.

Fast scrolling y sliding tabs no van de la mano cuando se usan ion-slides .

Tómese su tiempo, pero sería genial si no se usan las diapositivas.

Todo el mejor equipo iónico 👍

Actualicé 4970 que usa segmentos y diapositivas para trabajar con RC0.

Está disponible como esencia https://gist.github.com/aarjithn/d282b019f6046f0de2f0ded623554313.

El único problema que veo con esto es que las pestañas en sí no se pueden deslizar.

https://github.com/leoruhland/ion-slides-tabs se ve bien, sería bueno si alguien pudiera portarlo a ionic2.

Hola probé tu sugerencia y ejemplo;
Y lo implementó; funciona bien para la versión beta 2.
Parece:

#

Lo que estoy buscando es mejorar un poco la "interfaz de usuario de Tinder":

• No las pestañas de la interfaz de usuario, sino solo los iconos
• Donde uno tendría un logo en el centro
• Tener una clase activa para la pestaña seleccionada

¿Alguna idea para modificar el ejemplo hacia esto?

Las pestañas que se pueden deslizar serían excelentes, pero implementarlas con diapositivas iónicas no es óptimo, al menos no si desea mantener, por ejemplo, una pila de navegación separada en una de ellas.

De acuerdo con @ Alx101 .
Mi sugerencia sería usar un atributo en la etiqueta de pestaña/segmento. Como "barrido de iones = verdadero".

¡Esta mejora será fantástica, estoy esperando esto, día tras día! :)

¡Gracias!

¿Todavía hay algún plan para incluir esta función en ionic2? No mencionado en ninguna Reunión Marco desde el 29-07-2016. Estoy esperando esta función desde el primer día...

¿Quizás esto debería colocarse en un nuevo problema, ya que este está cerrado y probablemente se haya filtrado por el "tubo" a favor de los problemas abiertos?

Hola a todos, este tema sigue abierto. Hay un PR abierto para esto aquí: https://github.com/driftyco/ionic/pull/7185. Sin embargo, necesita ser revisado. El objetivo más reciente es que queremos que nuestro componente Segmento tenga el mismo diseño/funcionalidad que el componente Pestañas de diseño de materiales , incluida la capacidad de deslizar. Todavía queda mucho por hacer para lograr esto. Si bien nos encantaría dedicar algo de tiempo a esto, actualmente nos estamos enfocando en obtener algunas correcciones de errores y mejorar el marco existente. Sin embargo, agregaré esto al hito para recordar volver a visitarlo. Gracias por su paciencia, sabemos que esta es una característica muy buscada y definitivamente queremos incluirla en el marco.

+1

¡+1 para segmentos deslizables!

¿Alguna idea actualizada sobre cómo cambiar esto para que se parezca a las pestañas deslizantes de Tinder?
¿Podríamos eliminar las pestañas en la parte superior o cambiarles el estilo para que se parezcan a la interfaz de usuario de Tinder o hay otra forma de hacerlo?

Las pestañas deslizantes funcionan bien tal como están, básicamente, me gustaría eliminar los indicadores de las pestañas y reemplazarlo con un icono en su lugar.

Reemplazando esto:

<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

Sin perder el "estado" de resaltar o mostrar un determinado icono.
¿Alguna idea?

Además, ¿cuál sería la mejor práctica para cargar el contenido de las pestañas deslizantes?
¿Se colocaría toda la aplicación dentro de este archivo slidepage.html o sería mejor tener páginas separadas y cargarlas dentro de las pestañas según el nombre de la página?

:(

ni siquiera estoy seguro de por qué estos llamados rc.x :)

@gbelmm solo porque lo estemos moviendo de hitos no significa que no estemos trabajando en ello o que no lo estemos tomando en serio. Tratamos de sacar lanzamientos como máximo cada dos semanas, eso significa que algunas cosas más difíciles tendrán que esperar porque no queremos enviarles cosas rotas (aunque cometemos errores).

Estamos tratando de ser muy transparentes, pero nunca garantizamos que los problemas o funciones aparecerán en un momento determinado.

¡Esa es la naturaleza de la ingeniería de software!

@mlynch , sé que el problema o la función es difícil porque no hay un comportamiento predeterminado en iOS. Quiero esta función para mi aplicación, pero sé que es difícil, así que tómense el tiempo que necesitan porque se lo merecen jaja, ustedes están haciendo un buen trabajo haciendo RC con tanta frecuencia.

@ jgw96 ¿Por qué esta característica ahora se eliminó del hito? :(

yo también estaba esperando esta función :/

Hago un ejemplo simple de 2 swipedTabs, espero que ayude hasta que complete el complemento completo.
Enlace de Youtube

enlace github

Chicos, están trabajando en RC, lo que significa que solo se enfocan en la corrección de errores en las funciones 2.0.0 únicamente. Así que primero habrá una versión final 2.0.0 y luego tal vez introduzcan nuevas características en 2.1 o 2.0.1, así que tenga paciencia. Estoy esperando esto también, así que espera.

Eso es todo :)

Solo estoy un poco preocupado por la arquitectura ionic 2 si una característica de tan alta calificación no se puede resolver en un año.

Ok, chicos, OP de la cuestión aquí. Sí, esto lleva mucho tiempo, pero muchachos, tenemos que darnos cuenta de que Ionic 2 se creó casi desde cero en el último año, lo que significa que no hay mucho tiempo para manejar grandes características como esta. Por lo tanto, obtener una plataforma como esta desde la versión beta hasta casi su lanzamiento en 1 año es un gran logro. Además, si leemos un poco todos los comentarios (y nos deshacemos del spam), verá que la función se está retrasando porque hay requisitos previos. Copiando de una publicación mucho más arriba:

Es una función complicada de implementar correctamente, todavía tenemos que arreglar un par de cosas y deslices de iones. ¡Pero está entre nuestras prioridades!

Ver también:

7075

7049

6726

5508

De todos estos problemas, todos se han cerrado, pero el último, que aún está abierto, aún necesita trabajo.

Sí, estoy de acuerdo, esta función ha tenido toneladas de solicitudes y yo la primera 😏 Pero debemos entender que si nos brindan una función mal implementada, seguiremos quejándonos también y estoy seguro de que no quieren. ofrecen una mala experiencia cuando saben que no funcionará bien debido a los problemas enumerados anteriormente. Por lo tanto, prefiero esperar un poco más y tener una función implementada correctamente que intentar piratear el código. Además, aún podemos usar una vista con pestañas sin deslizar, lo cual no es tan malo.

En suma, chicos y chicas, tengamos paciencia y confiemos en ellos. De todos modos, aprovecho para desearos a todos ¡Feliz Navidad y fiestas!

COMENTARIO ADICIONAL:
Y por favor, todos estamos pensando lo mismo sobre los retrasos y todo. Recuerde que los mensajes aquí notifican a todos los que se suscriben. A menos que sea algo constructivo, trata de contenerte. De lo contrario, ¡siempre puedes usar las reacciones a las publicaciones! 👍

esto tiene alguna solucion?

@adamdbradley @brandyscarney @mlynch @jgw96

Impresionante, finalmente se lanza la versión 2.0. Ahora vamos a integrar esta esperada función de pestaña deslizable en las próximas actualizaciones.

Si no quiere esperar por un componente oficial, puede usar dos controles deslizantes para crear su propio componente 'Pestaña deslizable'.
Estoy usando dos controles deslizantes (dentro de la barra de navegación de iones y el área de contenido de iones) y dejo que se controlen entre sí.

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

Esto funciona bastante bien para mi aplicación (rc6 o final).

No puedo creer que 2.0 se haya declarado sin esta característica. Si esto no se implementa, es realmente obvio para los usuarios que la aplicación no es nativa, ya que es algo esperado para todas las aplicaciones de Android.

Hola a todos,

Sabemos que esta es una característica importante para todos ustedes. Somos muy conscientes de que es algo que debemos agregar; está en la parte superior de nuestra lista de funciones. Nuestro objetivo era lanzar la versión 2.0 final, obtener algunas correcciones de errores y luego comenzar a agregar funciones nuevamente. Confía en mí, nos encantaría pasar la mayor parte de nuestro tiempo agregando funciones, pero eso no es posible cuando hay errores que impiden que nuestros usuarios usen sus aplicaciones. Esto no es tan simple como agregar algo de CSS a algunas pestañas. Esto requerirá actualizar nuestro componente de segmento, asegurándonos de que interactúe correctamente con otros gestos, agregando estilo adicional y más.

Agregar comentarios a este problema solicitando actualizaciones nos distrae. Cerraré este problema por este motivo. Actualizaremos el problema cuando tengamos noticias para compartir al respecto. Nosotros apreciamos su paciencia. 🙂