houve um PR para demonstrar como fazer isso no ionic v2 com ion-slides e ion-segment, o código de exemplo está na pasta de teste do código-fonte:
https://github.com/driftyco/ionic/pull/4970

@3dd13 , muito obrigado, vou dar uma olhada! Estava fazendo buscas nas questões mas não consegui achar esse commit!

Além disso, espero que funcione bem, pois o problema usual é que não há animação de guias ao alterar as guias

Acabei de lançar meu aplicativo Ionic 2 GitNinja ontem para Android e recebi três comentários de usuários querendo poder deslizar entre as abas. Isso é o que as pessoas estão acostumadas no Android, então acho que esse recurso seria ótimo.

+1

+1

Seria ótimo (e lógico) se as guias em si também fossem swipable:

Pelo menos as transições de página entre as guias são necessárias para Android (Windows Phone). É o comportamento padrão de um aplicativo Android. Alternar sem transições de página parece muito estranho na verdade - especialmente porque a mudança de guia na barra de guias é bem animada. O suporte de furto seria, obviamente, perfeito.

+1 Este é um ux nativo do núcleo no Android

+1 Este recurso é a solicitação mais frequente que recebo de meus usuários

+1 Aqui este recurso também é o pedido mais frequente

+1 (também para iOS)

Estou surpreso que isso não estava na v1. Eu acho que é porque a interface do usuário foi focada mais no iOS? (ou pelo menos tive essa impressão)

@dasilvacontin está correto. No Ionic 2, estamos fazendo do design de materiais um foco junto com o design ios (:

Meu aplicativo está pronto para produção, mas não posso colocá-lo ao vivo sem guias deslizantes.

+1 Meu aplicativo também...
:+1:

+1

Meu primeiro comentário com +1 no github 😄

+1

+1

Também aqui está um requisito de UX... +1

Do beta 3 foi movido para o beta 12. :(

@pantonis Realmente espere esse recurso também ..

Estou esperando esse recurso da versão beta.3
Um recurso muito necessário para aplicativos direcionados ao Android

É um recurso complicado de ser implementado corretamente, ainda precisamos corrigir algumas coisas e slides de íons. Mas está entre as nossas prioridades!

Veja também:
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 ansioso por isso

+1 estou esperando apenas duas coisas para migrar meu aplicativo para ionic 2: guias deslocáveis ​​e suporte para webworker.

+1

+1

+1 Deve ser adicionado ao Ionic 1 e Ionic 2 o mais rápido possível.

Olá a todos! Estou inscrito para receber atualizações úteis. A Ionic tem uma política de comentários com +1? Estou recebendo e-mails sobre isso com bastante frequência, apenas para descobrir que alguém comentou '+1', o que não parece construtivo.

Olá @kz , nós realmente não temos uma política oficial sobre comentários +1, eu recomendaria alterar suas configurações de notificação do github, se possível. Além disso, para que todos saibam que estamos planejando implementar esse recurso, e como você pode ver no lado direito do github, ele está atribuído ao beta.12, o que significa que você pode esperar esse recurso nessa versão no momento. Também gostaria de pedir à nossa comunidade que antes de comentar um +1, lembre-se de que a equipe aqui da ionic e qualquer pessoa que se inscrever neste problema como @kz receberá notificações quando você comentar, incluindo um e-mail e que é melhor se o seu comentário estiver adicionando conteúdo, ideias etc. ao problema. Obrigado a todos!

estou esperando por ionic 2: abas que podem ser trocadas

+1 Definitivamente gostaria de usar isso.

+1 A deve ter recurso!!!!!

Por que ele foi removido do marco beta 12? Mudou do beta 3 para o beta 12, e agora nem mesmo no beta 12?

:(

Sim, estou ansioso pelo lançamento do beta.12. Quando é o lançamento do beta.12?

Seria ótimo se as guias pudessem ser passadas.

Olá a todos! Já que estamos chegando muito perto de nosso lançamento RC, decidimos dar um passo atrás e focar em mostrar bugs de parada na versão beta.12. Esses são bugs que podem quebrar totalmente um aplicativo ou quebrar uma grande parte da funcionalidade da estrutura. Isso não significa que não vamos implementar novos recursos como esse problema, mas realmente queremos nos concentrar em obter o que já temos super estável e pronto. Também beta.12 será atualizado para angular 2 rc5 e deve finalmente incluir antes do tempo de compilação!

@jgw96 quantos candidatos a lançamento você planeja? Se não for segredo :smile:

Boa pergunta! Espero que não muitos! 😃

No momento temos apenas 1 planejado, mas pode haver mais. Você sempre pode conferir nosso roteiro aqui para ver o que planejamos fazer. Obrigado!

Apenas uma observação, pois com esta notícia o influxo de postagens e comentários +1 vai deixar todos que ouvem este tópico loucos que estão esperando notícias reais sobre esse recurso. Você pode obter atualizações de status usando o botão de inscrição à direita. Você não precisa postar a menos que tenha algo digno de nota, e se precisar marcar +1, basta usar o emote +1 que o Github adicionou para reduzir a raiva, mas ainda permitir a votação. É hora de quebrar essa cultura +1 que todos nós somos culpados de proliferar .

Todas as informações que você precisa para julgar e votar nos próximos recursos: Marcos e seu roteiro , bem como um quadro do Trello para votação.

Obrigado @mtpultz ! Não temos uma política oficial de +1s, mas pedimos que você lembre-se de que todos os inscritos neste problema, bem como a equipe aqui da Ionic, recebem e-mails e notificações quando um novo comentário é postado em um problema. agradecemos se o comentário adicionar conteúdo, ideias, sugestões etc. ao problema, em vez de apenas um +1. Novamente, esta não é uma política oficial nem nada, apenas algo para lembrar.

• 1 para guias deslizantes Quando esse recurso será lançado?

Então, faz parte da diretriz de interação do usuário do Windows, pelo que me lembro.
Talvez esse recurso também deva ser adicionado à plataforma Windows por padrão.

Ansioso por esse recurso, estou lutando para executá-lo no meu aplicativo muito complexo ...

Olá! Estamos movendo nossas solicitações de recursos para um novo documento de solicitação de recursos. Movi esta solicitação de recurso para o documento e, por isso, encerrarei este problema por enquanto. Obrigado por usar o Ionic!

@jgw96 , ei, eu sou o pôster original desta edição aqui!
Tenho tentado evitar spam, pois vi toneladas de mensagens +1 ou "Também preciso disso".

De qualquer forma, é bom que você esteja movendo todas as requisições de recursos em um documento, mas, apenas como um pequeno pensamento (para ajudar nessa mudança de processo), talvez seja bom adicionar lá no documento a quantidade de 'Curtidas' ou relevância que cada número tem, pois agora parece uma longa lista de problemas ordenados pelo momento em que foi postado. Até agora, sabíamos que você tinha isso em prioridade, mas havia outros problemas, então esse recurso foi interrompido. Estou apenas dizendo que um problema não é apenas o recurso, mas também os metadados com ele (reações das pessoas, embora não diga que todas são relevantes).
E bem, agora vendo esse documento, eu diria que faz qualquer um se sentir um pouco perdido sobre qual será seu próximo passo.

Então, para evitar a perda desses metadados, talvez (como uma ideia rápida, além de escrevê-lo no documento), que tal no futuro permitir que as pessoas votem nos recursos, como estávamos fazendo aqui. Tenho certeza de que realmente ajudaria você a decidir qual seria o próximo recurso a implementar ;) Um site pequeno como este levaria de 1 a 2 horas ou menos para ser criado, e muitos outros projetos de código aberto ou similares têm uma ferramenta assim ;)

Mas de qualquer forma, muito obrigado pelo trabalho árduo de toda a equipe Ionic, e fico feliz em ver esse ótimo framework parecer tão incrível, e em breve será um RC :D

Saúde!

EDIT: Se mais alguém concordar, sinta-se à vontade para adicionar uma reação à postagem, mas não como uma mensagem, mas como uma reação +1 adequada (veja o botão no canto superior direito da mensagem? Sim, lá :D)

@Sturgelose Obrigado pelas ideias! Na verdade, estamos experimentando o zenhub agora (desculpe por qualquer confusão), então podemos nem manter a ideia da lista de recursos do google doc. Por causa disso estou reabrindo este problema por enquanto.

Galera todo mundo.

Isso significa que o http://ideas.ionic.io/ideas/top não está sendo usado?

Esse recurso é o segundo em prioridade da comunidade, baseado nos votos populares. As coisas são, nenhuma palavra foi dada sobre isso, e eu me perguntei se o site era de alguma utilidade, agora isso é uma confirmação?

De qualquer forma, parabéns pelo bom trabalho, obrigado.

@victorivens05 houve alguma confusão com esse site, é _não_ para Ionic Framework, é para Ionic Cloud. Precisamos consertar isso.

Obrigado pelo feedback de todos, isso definitivamente está na lista, mas precisamos lançar o RC primeiro, o que deve acontecer em breve.

Espero que isso seja no marco RC1 ...

@NgYueHong Ainda não está no RC0?

@infinnie Não vejo nenhuma menção a isso no changelog e esse problema ainda permanece em aberto.

Isso deveria estar na prioridade 1 lol! +1
Espero que não seja implementado usando ion-slides .
Isso estragou o UX no ionic 1. enquanto o usuário está tentando rolar mais rápido como faria no aplicativo nativo normal, a guia mudaria. Mas não era oficial.

Fast scrolling e sliding tabs não andam de mãos dadas quando ion-slides são usados.

Leve o seu tempo, mas seria ótimo se os slides não fossem usados.

Todo o melhor time iônico 👍

Atualizei 4970 que usa segmentos e slides para trabalhar com RC0.

Está disponível como uma essência https://gist.github.com/aarjithn/d282b019f6046f0de2f0ded623554313.

O único problema que vejo com isso é que as guias em si não são swipable.

https://github.com/leoruhland/ion-slides-tabs parece legal, seria bom se alguém pudesse portá-lo para ionic2.

Oi tentei sua sugestão e exemplo;
E implementou; funciona bem para a versão beta 2.
Parece:

#

O que estou procurando é aprimorar um pouco a "UI do Tinder":

• Não é a interface do usuário de guias, mas apenas ícones
• Onde um teria um logotipo no centro
• Ter uma turma ativa para a guia selecionada

Alguma idéia para modificar o exemplo para isso?

As guias que podem ser deslizadas seriam ótimas, mas implementá-las com ion-slides não é ideal, pelo menos não se você quiser manter, por exemplo, uma pilha de navegação separada em uma delas.

Acordado com @Alx101 .
Minha sugestão seria usar um atributo na tag tab/segment. Como "ion-sweep = true".

Essa melhora será fantástica, estou esperando isso, dia após dia! :)

obrigado!

Ainda existe algum plano para incluir esse recurso no ionic2? Não mencionado em nenhuma Reunião de Quadro desde 29-07-2016. Estou esperando por esse recurso desde o primeiro dia...

Talvez isso deva ser colocado em uma nova edição, visto que esta está fechada e provavelmente escorreu pelo "pipe" em favor de questões abertas?

Olá a todos, esta questão ainda está em aberto. Há um PR aberto para isso aqui: https://github.com/driftyco/ionic/pull/7185. No entanto, ele precisa ser revisto. O objetivo mais recente é que nosso componente Segment seja igual em design/funcionalidade ao componente Material Design Tabs , incluindo a capacidade de deslizar. Muito ainda precisa ser feito para que isso aconteça. Embora gostaríamos de dedicar algum tempo a isso, no momento estamos nos concentrando em obter algumas correções de bugs e melhorar a estrutura existente. Vou adicionar isso ao marco para que eu possa lembrar de revisitá-lo. Obrigado por sua paciência, sabemos que esse é um recurso muito procurado e definitivamente queremos incluí-lo no framework!

+1

+1 para segmentos deslizantes!

Quaisquer atualizações de pensamentos sobre como mudar isso para se parecer com as guias deslizantes do Tinder?
Podemos remover as guias na parte superior ou reestilizá-las para se parecerem com a interface do usuário do tinder ou existe outra maneira de fazer isso?

As guias deslizantes funcionam bem como estão, basicamente, eu gostaria de remover os indicadores de guias e substituí-lo por um ícone.

Substituindo isso:

<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

Sem perder o "estado" para destacar ou exibir um determinado ícone.
Alguma ideia?

Além disso, qual seria a melhor prática para carregar o conteúdo das guias deslizantes?
Alguém colocaria o aplicativo inteiro dentro deste slidepage.html ou seria melhor ter páginas separadas e carregá-las dentro das guias com base no nome da página?

:(

nem sei por que esses chamados rc.x :)

@gbelmm só porque estamos mudando de marcos não significa que não estamos trabalhando nisso ou não estamos levando a sério. Tentamos lançar lançamentos no máximo a cada duas semanas, o que significa que algumas coisas mais difíceis terão que esperar porque não queremos enviar coisas quebradas para todos vocês (mas cometemos erros).

Estamos tentando ser muito transparentes, mas nunca garantimos que problemas ou recursos serão lançados em um determinado momento.

Essa é a natureza da engenharia de software!

@mlynch eu sei que esse problema ou recurso é difícil porque não há comportamento padrão no iOS. Eu quero esse recurso para o meu aplicativo, mas eu sei que isso é difícil, então tomem o tempo que todos precisam, porque vocês merecem haha, vocês estão fazendo um bom trabalho fazendo RC com tanta frequência.

@jgw96 Por que esse recurso agora foi removido do marco? :(

eu estava esperando por esse recurso também :/

eu faço um exemplo simples de 2 swipedTabs, espero que ajude até que eu complete o plugin completo.
Link do Youtube

Link do github

Pessoal, eles estão trabalhando em RC's, isso significa que eles focam apenas na correção de bugs apenas nos recursos 2.0.0. Então, primeiro será uma versão final 2.0.0 e então talvez eles introduzam novos recursos em 2.1 ou 2.0.1, então seja paciente. Estou esperando isso também, então espere.

Isso é tudo :)

Estou um pouco preocupado com a arquitetura iônica 2 se um recurso tão alto não puder ser resolvido em um ano.

Ok, pessoal, OP da questão aqui. Sim, isso está demorando muito, mas pessoal, temos que perceber que o Ionic 2 foi criado quase do zero no ano passado, o que significa que não há muito tempo para lidar com grandes recursos como este. Portanto, obter uma plataforma como esta da versão beta para quase o lançamento em 1 ano é uma grande conquista. Além disso, se lermos um pouco todos os comentários (e nos livrarmos do spam), você verá que o recurso está atrasado porque há pré-requisitos. Copiando de um post muito superior:

É um recurso complicado de ser implementado corretamente, ainda precisamos corrigir algumas coisas e slides de íons. Mas está entre as nossas prioridades!

Veja também:

7075

7049

6726

5508

De todas essas questões, todas foram encerradas, mas a última, que ainda está em aberto, ainda precisa ser trabalhada.

Sim, concordo, esse recurso teve muitos pedidos e eu o primeiro 😏 Mas temos que entender que se eles nos fornecerem um recurso mal implementado, continuaremos reclamando também e tenho certeza que eles não querem entregar uma experiência ruim quando eles sabem que não funcionará bem devido aos problemas listados anteriormente. Então, prefiro esperar um pouco mais e ter um recurso implementado corretamente do que tentar hackear o código. Além disso, ainda podemos usar uma visualização com guias sem deslizar, o que não é tão ruim.

Em suma, rapazes e moças, vamos ter paciência e confiar neles. De qualquer forma, aproveito para desejar a todos um feliz natal e boas festas!

COMENTÁRIO ADICIONAL:
E por favor, todos nós estamos tendo os mesmos pensamentos sobre os atrasos e tudo mais. Lembre-se de que enviar mensagens aqui é notificar todos os inscritos. A menos que seja algo construtivo, tente se conter. Caso contrário, você sempre pode usar reações aos posts!! 👍

isso tem alguma solução?

@adamdbradley @brandyscarney @mlynch @jgw96

Impressionante, a versão 2.0 é finalmente lançada. Agora vamos obter esse recurso de guia deslizante há muito esperado integrado pelas próximas atualizações.

Se você não quiser esperar por um componente oficial, você pode usar dois controles deslizantes para criar seu próprio componente 'Swipeable Tab'.
Estou usando dois controles deslizantes (dentro da barra de navegação de íons e da área de conteúdo de íons) e deixo que eles controlem um ao outro.

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

Isso funciona muito bem para o meu aplicativo (rc6 ou final).

Eu não posso acreditar que 2.0 foi declarado sem esse recurso. Se isso não for implementado, é realmente óbvio para os usuários que o aplicativo não é nativo, pois é algo esperado para todos os aplicativos Android.

Oi a todos,

Sabemos que esta é uma característica importante para todos vocês. Estamos bem cientes de que é algo que precisamos acrescentar; está no topo da nossa lista de recursos. Nosso objetivo era lançar a versão 2.0 final, obter algumas correções de bugs e começar a adicionar recursos novamente. Confie em mim, adoraríamos passar a maior parte do nosso tempo adicionando recursos, mas isso não é possível quando há bugs que impedem nossos usuários de usar seus aplicativos. Isso não é tão simples quanto adicionar algum CSS a algumas guias. Isso exigirá a atualização de nosso componente de segmento, garantindo que ele interaja com outros gestos corretamente, adicionando estilo adicional e muito mais.

Adicionar comentários a este problema pedindo atualizações é uma distração para nós. Estarei bloqueando esta questão por este motivo. Atualizaremos o problema quando tivermos notícias para compartilhar. Nós apreciamos sua paciência. 🙂