Ionic-framework: feat: Перелистываемые вкладки для Android

Созданный на 20 янв. 2016  ·  83Комментарии  ·  Источник: ionic-team/ionic-framework

Тип : подвиг

Ионная версия : 2.x

Платформа : Android 4.4 веб-просмотр

Было бы здорово иметь директиву прокручиваемых вкладок или, по крайней мере, разрешить опцию прокручиваемых вкладок в директиве ion-tabs, чтобы мы могли пролистывать вкладки.

Это реализовано в Android Material Design по умолчанию (http://developer.android.com/design/patterns/swipe-views.html#between-tabs), поэтому, возможно, это следует применять только к платформе Android. Я запрашиваю это в Ionic 2.x, так как я видел, что Material Design был интегрирован в Ionic.

Примером этого может быть вот этот:
SlideTabs Gif

Я узнал, что здесь есть пробная реализация: https://github.com/JKnorr91/ion-slide-box-tabs , однако в ней много недостатков.

Я уверен, что это можно реализовать с помощью директивы ion-slide-box, но, согласно документации, она будет объявлена ​​устаревшей, и я не уверен в новом API (нигде не могу найти)

stale issue

Самый полезный комментарий

Было бы здорово (и логично), если бы сами вкладки тоже можно было листать:

ionic

Все 83 Комментарий

был PR, чтобы продемонстрировать, как это сделать в ionic v2 с ion-slides и ion-segment, пример кода находится в тестовой папке исходного кода:
https://github.com/driftyco/ionic/pull/4970

@3dd13 , спасибо большое, посмотрю! Я искал в проблемах, но не смог найти эту фиксацию!

Кроме того, я надеюсь, что это работает хорошо, так как обычная проблема заключается в том, что нет анимации вкладок при смене вкладок.

Только вчера выпустил свое приложение Ionic 2 GitNinja для Android и получил три комментария от пользователей, желающих иметь возможность переключаться между вкладками. Это то, к чему люди привыкли на Android, поэтому я думаю, что эта функция была бы отличной.

+1

+1

Было бы здорово (и логично), если бы сами вкладки тоже можно было листать:

ionic

Для Android (Windows Phone) нужны как минимум переходы страниц между вкладками. Это стандартное поведение приложения для Android. Переключение без перехода между страницами на самом деле выглядит очень странно, тем более, что смена вкладок на панели вкладок красиво анимирована. Поддержка свайпов, конечно, была бы идеальной.

+1 Это основной нативный UX на Android

+1 Эта функция — самый частый запрос, который я получаю от своих пользователей.

+1 Вот эта фича тоже самый частый запрос

+1 (также для iOS)

Я удивлен, что этого не было в v1. Я думаю, это потому, что пользовательский интерфейс был больше ориентирован на iOS? (по крайней мере у меня сложилось такое впечатление)

@dasilvacontin это правильно. В Ionic 2 мы уделяем особое внимание дизайну материалов наряду с дизайном iOS (:

Мое приложение готово к работе, но я не могу запустить его без вкладок с возможностью пролистывания.

+1 Мое приложение тоже...
:+1:

+1

Мой первый +1 комментарий на github 😄

+1

+1

Также здесь есть требование UX... +1

Из бета 3 он был перемещен в бета 12. :(

@pantonis Я тоже ожидаю эту функцию ..

Я ожидаю эту функцию от beta.3
Очень нужная функция для приложений, ориентированных на Android.

Это сложная функция, которую нужно правильно реализовать, нам еще нужно исправить пару вещей и ион-слайды. Но это между нашими приоритетами!

Смотрите также:
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 с нетерпением жду этого

+1 Я жду только двух вещей, чтобы перенести свое приложение на ionic 2: переключаемые вкладки и поддержку веб-воркеров.

+1

+1

+1 Должен быть добавлен к Ionic 1 и Ionic 2 как можно скорее.

Всем привет! Я подписан на это, чтобы получать полезные обновления. Есть ли у Ionic политика в отношении комментариев +1? Я довольно часто получаю электронные письма об этом только для того, чтобы узнать, что кто-то прокомментировал «+1», что не кажется конструктивным.

Здравствуйте @kz , у нас на самом деле нет официальной политики в отношении комментариев +1, я бы порекомендовал изменить настройки уведомлений на github, если это возможно. Кроме того, просто чтобы все знали, что мы планируем реализовать эту функцию, и, как вы можете видеть в правой части github, она назначена на бета-версию 12, что означает, что вы можете ожидать эту функцию в этом выпуске в это время. Я также хотел бы попросить наше сообщество, прежде чем комментировать +1, просто помните, что команда здесь, в ionic, и все, кто подписан на этот выпуск как @kz , будут получать уведомления, когда вы комментируете, включая электронное письмо, и что это лучше всего если ваш комментарий добавляет контент, идеи и т. д. к проблеме. Всем спасибо!

я жду ionic 2: переключаемые вкладки

+1 Определенно хотел бы использовать это.

+1 Обязательная функция!!!!!

Почему он удален из этапа бета-тестирования 12? Полностью перешли от бета 3 к бета 12, а теперь даже не в бета 12?

:(

Да, я с нетерпением жду релиза beta.12. Когда выйдет бета.12?

Было бы здорово, если бы вкладки можно было листать.

Всем привет! Так как мы очень близки к выпуску RC, мы решили сделать шаг назад и сосредоточиться на показе ошибок в бета-версии 12. Это ошибки, которые либо могут полностью сломать приложение, либо нарушить большую часть функциональности фреймворка. Это не означает, что мы не собираемся внедрять новые функции, такие как эта проблема, но мы действительно хотим сосредоточиться на том, чтобы сделать то, что у нас уже есть, суперстабильным и готовым к работе. Также beta.12 будет обновлен до angular 2 rc5 и, наконец, должен включать предварительную компиляцию!

@ jgw96 сколько релиз-кандидатов вы планируете? Если не секрет :smile:

Хороший вопрос! Надеюсь, не слишком много! 😃

На данный момент у нас запланирован только 1, но может быть и больше. Вы всегда можете ознакомиться с нашей дорожной картой здесь, чтобы узнать, что мы планируем делать. Спасибо!

Просто примечание, так как благодаря этой новости поток +1 сообщений и комментариев сведет с ума всех, кто слушает эту ветку, кто ждет реальных новостей об этой функции. Вы можете получать обновления статуса, используя кнопку подписки справа. Вам не нужно публиковать, если у вас нет чего-то достойного внимания, и если вам нужно +1, вы можете просто использовать эмоцию +1, которую Github добавил, чтобы уменьшить гнев, но при этом разрешить голосование. Пришло время сломать эту культуру +1, в распространении которой мы все виновны .

Вся информация, необходимая для оценки и голосования по предстоящим функциям: вехи и их дорожная карта , а также доска Trello для голосования.

Спасибо @mtpultz ! У нас нет официальной политики в отношении +1, но мы просим вас помнить, что все, кто подписан на этот выпуск, а также команда здесь, в Ionic, получают электронные письма и уведомления, когда к выпуску публикуется новый комментарий, поэтому приветствуется, если комментарий добавляет содержание, идеи, предложения и т. д. к проблеме, а не просто +1. Опять же, это не официальная политика или что-то в этом роде, просто нужно помнить.

  • 1 для пролистываемых вкладок. Когда эта функция будет выпущена?

Насколько я помню, это часть руководства по взаимодействию с пользователем Windows.
Возможно, эта функция также должна быть добавлена ​​​​на платформу Windows по умолчанию.

С нетерпением жду этой функции, борюсь за то, чтобы запустить ее в моем очень сложном приложении...

Привет! Мы перемещаем наши запросы функций в новый документ запроса функций. Я переместил этот запрос функции в документ, и поэтому я пока закрою эту проблему. Спасибо за использование Ionic!

@ jgw96 , эй, я автор этого выпуска!
Я пытался избежать спама, так как я видел множество сообщений +1 или «Мне это тоже нужно».

В любом случае, хорошо, что вы перемещаете все запросы функций в документ, но, просто как небольшая мысль (чтобы помочь в этом изменении процесса), может быть, было бы хорошо добавить туда в документе количество «Нравится» или актуальность, которую имеет каждый выпуск, так как сейчас это похоже на длинный список вопросов, упорядоченных по времени их публикации. До сих пор мы как бы знали, что у вас есть это в приоритете, но были другие проблемы, поэтому эта функция была остановлена. Я просто так говорю, поскольку проблема заключается не только в функции, но и в метаданных с ней (реакции людей, хотя и не говорю, что все они актуальны).
И что ж, теперь, увидев этот документ, я бы сказал, что любой чувствует себя немного потерянным в том, какой будет ваш следующий шаг..

Итак, чтобы не потерять эти метаданные, может быть (в качестве быстрой идеи, помимо записи в документе), как насчет того, чтобы в будущем позволить людям голосовать за функции, как мы вроде как делали здесь. Я уверен, что это действительно поможет вам решить, какую следующую функцию реализовать ;) Небольшой веб-сайт, подобный этому, займет около 1-2 часов или меньше, и многие другие проекты с открытым исходным кодом или аналогичные проекты имеют инструмент так ;)

Но в любом случае, большое спасибо за тяжелую работу всей команды Ionic, и рад видеть, что этот замечательный фреймворк выглядит так здорово, и скоро станет RC :D

Ваше здоровье!

РЕДАКТИРОВАТЬ: Если кто-то еще согласен, не стесняйтесь добавлять реакцию на сообщение, но не как сообщение, а как правильную реакцию +1 (см. кнопку в правом верхнем углу сообщения? Да, там: D)

@Sturgelose Спасибо за идеи! На самом деле мы сейчас экспериментируем с zenhub (извините за путаницу), поэтому мы можем даже не сохранить идею списка функций документа Google. Из-за этого я снова открываю этот вопрос на данный момент.

Привет всем.

Это означает, что http://ideas.ionic.io/ideas/top не использовался?

Эта функция является второй по приоритету сообщества, основанной на народных голосах. Дело в том, что об этом не было сказано ни слова, и я задался вопросом, был ли сайт полезен, теперь это подтверждение?

В любом случае, поздравляю с хорошей работой, спасибо.

@victorivens05 с этим сайтом возникла некоторая путаница, он _не_ для Ionic Framework, он для Ionic Cloud. Нам нужно это исправить.

Спасибо всем за отзывы, это определенно в списке, но сначала нам нужно выпустить RC, что должно произойти в ближайшее время.

Надеюсь, это будет вехой RC1...

@NgYueHong Еще не в RC0?

@infinnie Я не вижу упоминания об этом в журнале изменений, и эта проблема все еще остается открытой.

Это должно быть на приоритете 1, лол! +1
Я надеюсь, что это не реализовано с использованием ion-slides .
Это испортило UX в ionic 1. Пока пользователь пытается прокручивать быстрее, чем в обычном нативном приложении, вкладка меняется. Хотя это было не официально.

Fast scrolling и sliding tabs не идут рука об руку при использовании ion-slides .

Не торопитесь, но было бы здорово, если бы слайды не использовались.

Вся лучшая команда ionic 👍

Я обновил 4970 , который использует сегменты и слайды для работы с RC0.

Он доступен как суть https://gist.github.com/aarjithn/d282b019f6046f0de2f0ded623554313.

Единственная проблема, которую я вижу в этом, это то, что сами вкладки не перелистываются.

https://github.com/leoruhland/ion-slides-tabs выглядит аккуратно, было бы неплохо, если бы кто-нибудь смог портировать его на ionic2.

Привет попробовал ваше предложение и пример;
И реализовал это; отлично работает для бета-версии 2.
Выглядит как:

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

То, что я ищу, это немного улучшить «пользовательский интерфейс Tinder»:

  • Пользовательский интерфейс не с вкладками, а просто с иконками
  • Где можно было бы иметь логотип в центре
  • Наличие активного класса для выбранной вкладки

tinder-ui

Любые мысли по изменению примера в этом направлении?

Вкладки с возможностью прокрутки были бы замечательными, но реализация их с помощью ion-слайдов не оптимальна, по крайней мере, если вы хотите сохранить, например, отдельный стек навигации в одной из них.

Согласен с @Alx101 .
Мое предложение состояло бы в том, чтобы использовать атрибут в теге вкладки/сегмента. Например, «ion-sweep = true».

Это улучшение будет фантастическим, я жду этого день за днем! :)

Спасибо!

Планируется ли включить эту функцию в ionic2? Не упоминается ни на одном рамочном совещании с 29 июля 2016 г. Жду эту функцию с первого дня...

Возможно, это следует поместить в новый выпуск, учитывая, что этот выпуск закрыт и, вероятно, просочился по «трубе» в пользу открытых выпусков?

Привет всем, этот вопрос все еще открыт. Здесь есть открытый PR для этого: https://github.com/driftyco/ionic/pull/7185. Однако его необходимо пересмотреть. Последняя цель состоит в том, что мы хотим, чтобы наш компонент Segment был равен по дизайну / функциональности компоненту вкладок Material Design , включая возможность прокрутки. Для этого еще многое предстоит сделать. Хотя мы хотели бы потратить на это некоторое время, в настоящее время мы сосредоточены на исправлении некоторых ошибок и улучшении существующей структуры. Я добавлю это к вехе, чтобы не забыть вернуться к ней. Спасибо за ваше терпение, мы знаем, что это очень востребованная функция, и мы определенно хотим получить ее в фреймворке!

+1

+1 за перелистываемые сегменты!

Любые обновления мыслей о том, как изменить это, чтобы оно выглядело как скользящие вкладки Tinder?
Можем ли мы удалить вкладки сверху или изменить их стиль, чтобы они выглядели как пользовательский интерфейс Tinder, или есть другой способ сделать это?

Скользящие вкладки отлично работают как есть, в основном я хотел бы удалить индикаторы вкладок и вместо этого заменить их значком.

Замена этого:

<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

Без потери «состояния», чтобы выделить или отобразить определенный значок.
Есть предположения?

Кроме того, как лучше всего загружать содержимое скользящих вкладок?
Можно ли разместить все приложение внутри этого slidepage.html или было бы лучше иметь отдельные страницы и загружать их во вкладках на основе имени страницы?

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

даже не уверен, почему они называются rc.x :)

@gbelmm только потому, что мы перемещаем его из вех, не означает, что мы не работаем над этим или не относимся к этому серьезно. Мы стараемся выпускать релизы не чаще, чем раз в две недели, а это значит, что некоторым более сложным вещам придется подождать, потому что мы не хотим отправлять вам все сломанные вещи (хотя мы допускаем ошибки).

Мы стараемся быть максимально прозрачными, но никогда не даем гарантий, что проблемы или функции появятся в определенное время.

Такова природа разработки программного обеспечения!

@mlynch Я знаю, что эта проблема или функция сложны, потому что в iOS нет поведения по умолчанию. Я хочу эту функцию для своего приложения, но я знаю, что это сложно, поэтому не торопитесь, потому что вы этого заслуживаете, ха-ха, ребята, вы так часто делаете хорошую работу, создавая RC.

@jgw96 jgw96 Почему эта функция теперь удалена из вехи? :(

Я тоже ждал эту функцию :/

Я делаю простой пример из 2 swipedTabs, надеюсь, это поможет, пока я не закончу полный плагин.
Ссылка на ютуб

Ссылка на гитхаб


Ребята, они работают над RC, это означает, что они сосредоточены только на исправлении ошибок только в функциях 2.0.0. Итак, сначала будет финальная версия 2.0.0, а затем, возможно, они представят новые функции в 2.1 или 2.0.1, так что наберитесь терпения. Я тоже этого жду, так что жди.

Это все :)

Я просто немного обеспокоен архитектурой Ionic 2, если такая высоко оцененная функция не может быть решена за год.

Хорошо, ребята, ОП проблемы здесь. Да, это занимает много времени, но, ребята, мы должны понимать, что Ionic 2 был создан почти с нуля в прошлом году, а это значит, что не так много времени, чтобы справиться с такими большими функциями, как эта. Таким образом, получить платформу, подобную этой, от бета-версии до почти релиза за 1 год — огромное достижение. Кроме того, если мы немного прочитаем все комментарии (и избавимся от спама), вы увидите, что функция задерживается, потому что есть предварительные условия. Копирую из поста намного выше:

Это сложная функция, которую нужно правильно реализовать, нам еще нужно исправить пару вещей и ион-слайды. Но это между нашими приоритетами!

Смотрите также:

7075

7049

6726

5508

Из всех этих вопросов все были закрыты, но последний, который все еще остается открытым, все еще нуждается в доработке.

Да, я согласен, у этой функции было много запросов, и я первый 😏 Но мы должны понимать, что если они предоставят нам плохо реализованную функцию, мы будем продолжать жаловаться, и я уверен, что они не хотят предоставить плохой опыт, когда они знают, что это не сработает из-за предыдущих перечисленных проблем. Так что я лучше подожду еще немного и получу правильно реализованную функцию, чем буду пытаться взломать код. Кроме того, мы по-прежнему можем использовать представление с вкладками без прокрутки, что не так уж и плохо.

В общем, ребята, давайте наберёмся терпения и доверимся им. В любом случае, я воспользуюсь случаем, чтобы пожелать вам всем счастливого Рождества и праздников!

ДОПОЛНИТЕЛЬНЫЙ КОММЕНТАРИЙ:
И, пожалуйста, мы все одинаково думаем о задержках и обо всем остальном. Помните, что обмен сообщениями здесь уведомляет всех подписавшихся. Если не будет чего-то конструктивного, постарайтесь сдержать себя. В противном случае вы всегда можете использовать реакции на сообщения! 👍

у этого есть какое-то решение?

@adamdbradley @brandyscarney @mlynch @jgw96

Круто, наконец вышла версия 2.0. Теперь давайте добавим эту долгожданную функцию Swipeable Tab, интегрированную в следующие обновления.

Если вы не хотите ждать официального компонента, вы можете использовать два ползунка, чтобы создать свой собственный компонент «Swipeable Tab».
я использую два ползунка (внутри области ion-navbar и ion-content) и позволяю им управлять друг другом.

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

Это неплохо работает для моего приложения (rc6 или final).

Я не могу поверить, что 2.0 был объявлен без этой функции. Если это не реализовано, для пользователей действительно очевидно, что приложение не является родным, поскольку это ожидается от каждого приложения для Android.

Всем привет,

Мы знаем, что это важная особенность для всех вас. Мы хорошо понимаем, что это то, что нам нужно добавить; он находится в верхней части нашего списка функций. Нашей целью было выпустить финальную версию 2.0, исправить некоторые ошибки, а затем снова начать добавлять функции. Поверьте мне, мы хотели бы потратить большую часть нашего времени на добавление функций, но это невозможно, когда есть ошибки, которые мешают нашим пользователям использовать свои приложения. Это не так просто, как добавить немного CSS на некоторые вкладки. Для этого потребуется обновить наш компонент сегмента, убедиться, что он правильно взаимодействует с другими жестами, добавить дополнительные стили и многое другое.

Добавление комментариев к этой проблеме с просьбой об обновлениях отвлекает нас. Я буду блокировать этот вопрос по этой причине. Мы обновим выпуск, когда у нас появятся новости, чтобы поделиться по нему. Мы ценим Ваше терпение. 🙂

Была ли эта страница полезной?
0 / 5 - 0 рейтинги