Ionic-framework: ошибка: появление белой вспышки при переключении вкладок на Android

Созданный на 9 июн. 2015  ·  121Комментарии  ·  Источник: ionic-team/ionic-framework

Тип : ошибка

Платформа : android 4.4 webview

при переключении между вкладками ТОЛЬКО на платформе Android приложение показывает белую вспышку. Не использовать пешеходный переход.Сообщение на форуме http://forum.ionicframework.com/t/white-flash-appearing-when-switching-between-tabs-on-android-in-1-0-0-stable/24774

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

Глядя на это завтра, ребята! :ухмылка:

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

Есть какие-нибудь сведения о статусе этой проблемы?

Имея такую ​​же проблему. Любые обновления?

+1

Приведите минимальный пример, в котором есть эта проблема.

Просто создайте новое ионное приложение (шаблон вкладок) и измените фон на любой цвет, кроме белого. собрать и запустить на устройстве Android (4.4, я тестировался на Nexus 5), и вы заметите, что при каждом изменении вкладки происходит белый щелчок на несколько миллиметров.

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

панель ion-header-bar создается автоматически для меня, где (и как) вы ее используете вручную?

Итак, @GentryRiggen, ты имеешь в виду ионную навигационную панель?

@mhartington Я использую ion-side-menu с ионными вкладками внутри ion-side-menu-content.

<ion-side-menus>
  <ion-side-menu side="left" class="left-side-menu">
    <ion-content drag-content="false" overflow-scroll="false" direction="y" delegate-handle="leftMenu">
      <div class="list">
        <a menu-close class="item item-icon-left" >Something</a>
        <a menu-close class="item item-icon-left" >Something</a>
        <a menu-close class="item item-icon-left" >Something</a>
      </div>
    </ion-content>
  </ion-side-menu>

  <ion-side-menu-content>
    <ion-header-bar align-title="center" class="bar-positive">
      <button class="button button-icon icon ion-navicon" menu-toggle="left"></button>
      <div class="titles">
            <h>TITLE</h1>
      </div>
    </ion-header-bar>

    <ion-tabs class="tabs-positive tabs-icon-only dark-background">
      <ion-tab>
        <ion-nav-view name="tab-1"></ion-nav-view>
      </ion-tab>

      <ion-tab>
        <ion-nav-view name="tab-2"></ion-nav-view>
      </ion-tab>

      <ion-tab>
        <ion-nav-view name="tab-3"></ion-nav-view>
      </ion-tab>
    </ion-tabs>
  </ion-side-menu-content>

</ion-side-menus>

Не используйте для этого ion-header-bar, используйте ion-nav-bar.

@mhartington Я использую 'ion-nav-bar' и мерцание экрана (при перемещении между вкладками) ...
так как вы предлагаете это исправить?

простые вкладки «стартер» от ionic, построенного для Android, показывают мигание между навигацией и, как я полагаю, использует ion-nav-bar.

Хм, в своих тестах не вижу.

https://youtu.be/_ja8a08iSPE

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

Вы говорите о исчезающей панели навигации?

Он говорит о белом экране (периметр содержания ионов), который ненадолго появляется при переключении вкладок.
Вы можете отчетливо увидеть это в своем видео, когда в первый раз переключитесь со «Статус» на «Чаты». Но на самом деле он появляется каждый раз.

@mhartington Я прикрепил видео к своему приложению (замедленная
Я хотел бы принять меры и помочь вам, ребята, решить эту проблему, но мне нужна хотя бы ваша отправная точка ... с чего мне начать?

ссылка на YouTube: https://youtu.be/TTuNPlL6Fmg

Спасибо.

Я посмотрел код, и мне показалось, что ошибка находится в функции tabSelected (директива ionTab)
Кажется, что предыдущая вкладка скрывается перед отображением новой.

Этот грязный прием, который я сделал, похоже, работает. Но я бы хотел увидеть правильное решение.
Просто добавьте тайм-аут около $ ionicViewSwitcher.viewEleIsActive (childElement, false);

Строка 55025 из ionic.bundle.js

$timeout(function () {
 $ionicViewSwitcher.viewEleIsActive(childElement, false);
}, 100);

Это происходит со мной с:

  • Ионный, v1.0.1
  • Кордова 5.3.3

Я использую Android 5.1.1 на Nexus 4.

Чтобы воспроизвести это, я просто делаю стартовое приложение с вкладками, меняю цвет навигационной панели на синий (например, меняя -stable на -positive), и мерцание становится очевидным. Он действительно мерцает с белой навигационной панелью, но вы не можете увидеть мерцание белого на белом.

Я попытался добавить стили, чтобы принудительно установить время перехода на 0 мс на Android, и подтвердил, что приложение применило эти стили к любому элементу заголовка, проверив с помощью прикрепленного инспектора Chrome и проверив вычисленные значения CSS. Я дважды проверил, удалив стили и убедившись, что они перешли от 0 мс до некоторого другого числа (0,2 мс или 0,5 мс - и на самом деле примерно так же быстро, как эффект мигания).

Я попытался исправить @didbarbosa, но Chrome в браузере и приложение для телефона пожаловались, что $ timeout не определен. Когда я зарегистрировал значение $ timeout, оно действительно не было определено.

@ lloy0076 вам нужно ввести его в директиву

IonicModule
.directive('ionTab', [
  '$compile',
  '$ionicConfig',
  '$ionicBind',
  '$ionicViewSwitcher',
  '$timeout',
function($compile, $ionicConfig, $ionicBind, $ionicViewSwitcher,$timeout) {

@didbarbosa - На самом деле я только что заметил, что моя версия Ionic не последняя версия; поэтому я изменил свой "bower.json" следующим образом:

{
"name": "HelloIonic",
"частный": "правда",
"devDependencies": {
"ionic": "driftyco / ionic-bower # ~ 1",
"platform.js": "платформа # ~ 1.3.0"

... и вы бы поверили, что он не мерцает даже без решения $ timeout ...

Может быть, если вы попробуете то же самое с решением перехода CSS, оно может просто «исправить» само себя - хотя я ненавижу проблемы, которые волшебным образом устраняют сами себя подобным образом.

Да, похоже, это исчезло с ночным выпуском.
Хорошие новости :)

На самом деле у меня это не исправлено.

не исправлено для меня 2: \

Есть новости по этому поводу?

У меня тоже есть эта проблема на iOS.

@harryzun относительно iOS, см. https://github.com/driftyco/ionic/issues/4395

На iOS это не та же проблема

Я просто начал замечать это и на Android через некоторое время после обновления до версии 1.1. Не уверен, когда это началось.

это началось около v1

Если у кого-то есть (временное) исправление, я хотел бы его услышать.

Я такая же ошибка ... у кого-нибудь есть дополнительная информация ?? :осьминог:

Вероятно, это не связано, но у меня была аналогичная проблема раньше, и по какой-то странной причине удаление cache: false из моего определения состояния для оскорбительного состояния вкладки родного брата устранило проблему. Я понятия не имею, почему, поскольку мы используем тот же шаблон с той же комбинацией контроллер + шаблон в 3 других местах в нашей настройке вкладки без каких-либо проблем.

Обновить

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

Итак, как упоминалось выше, мы используем один и тот же шаблон во всем нашем приложении, но с одним ключевым отличием: это состояние фактически имело разрешение, поддерживаемое API, в его определении состояния, чтобы обойти недостаток, который у нас в настоящее время есть на нашей серверной части, который мы не сделали. должны быть учтены с другими состояниями x3, которые используют этот шаблон.

Состояние «чат» было родственником основного состояния для вкладки. Чтобы достичь этого состояния, вам просто нужно щелкнуть по члену в главном окне, и вы окажетесь в состоянии чата родного брата. При переходе в него от брата или сестры не наблюдалось черной вспышки, основное состояние было бы видимым до завершения разрешения, а затем нормальная навигация завершилась. При переходе обратно на вкладку (с другой вкладки) с представлением чата в качестве текущего состояния в истории, ui-router + ionic немедленно выполнит замену на новую вкладку, но черный экран будет виден до тех пор, пока решение не будет завершено. .

Это также имеет смысл в отношении того, почему удаление cache: false и значение по умолчанию true устранило проблему.

Думаю, это имеет смысл, если подумать. Надеюсь, это может избавить кого-то от головной боли, если он наткнется на это через Google (так же, как и я).

Я отследил это до этой строки:
https://github.com/driftyco/ionic/blob/af1bfef327e685585244c6051c4d38b98aa6c62a/js/angular/service/viewSwitcher.js#L194

          if (renderStart && renderEnd) {
            // CSS "auto" transitioned, not manually transitioned
            // wait a frame so the styles apply before auto transitioning
            //$timeout(onReflow, 16); <- original
            onReflow(); // removes flicker
          } else if (!renderEnd) {

Это причина мерцания одного кадра при переключении вкладок, потому что новая вкладка становится видимой только через 16 мс.

Я не уверен, в чем смысл этой строки, когда задействованы вкладки, но если вы замените вызов $timeout простым вызовом метода onReflow() , воспринимаемая производительность значительно улучшится, и больше нет мерцания. Даже в навигационной панели.

@mhartington какие-нибудь мысли по этому поводу? Возможно, его следует как минимум сделать настраиваемым.

Кажется, введено https://github.com/driftyco/ionic/commit/8ebde73d0b8afac1bf1c1787c90a72a28a88bc3a от @adamdbradley

Изменить: похоже, лучшее исправление - просто изменить условие if на:

if (direction !== 'swap' && renderStart && renderEnd) {

Edit2: Еще лучшее исправление, которое избавляет от любых потенциальных побочных эффектов, - это заменить вызов $timeout на:
ionic.requestAnimationFrame(onReflow);
Я пришлю с ним пиар.

Очень хорошо сделано!
Устраняет проблему для меня.

Большое спасибо, дружище.

У меня не сработало ... Я обновил свой файл ionic-angular.js, но я не вижу изменений, даже если я увеличиваю начальное значение тайм-аута. Я что-то упускаю?
Для мерцания панели навигации я использовал это исправление https://forum.ionicframework.com/t/flickering-when-navigating-via-tabs-on-android/27281, но теперь контент мерцает.

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

Есть ли план выпуска по этой проблеме? 1.2 или 1.3?

Он включен в последнюю версию 1.2.

+1, есть ли другие решения?

вау, это все еще продолжается. э .. Полагал, что основная команда будет иметь хорошее представление о том, что это такое. У кого-нибудь есть хороший указатель на исходный код, с которым мы могли бы начать экспериментировать?

1.2 это исправил? Там была фиксация, которая должна была решить эту проблему.

Ошибка все еще присутствует с 1.2 по 1.2.2

Я попробовал еще раз, и это решается, если вы поставите:

ionic.requestAnimationFrame(onReflow);  

как он сказал, а не:

$timeout(function() {
              ionic.requestAnimationFrame(onReflow);
            });

Очевидно, $ timeout что-то делает

@mlynch может ты помнишь, для чего это было? https://github.com/driftyco/ionic/commit/d0246cf975bb4022eb890d3b0c28964e3065644c#diff -e25bdd32bda2f4f00f01c823ec86b1f3

Кажется, снова сломал.

Может поэтому:

если код помещен в очередь с использованием $ timeout, он должен запускаться после того, как DOM был обработан с помощью Angular, и после рендеринга браузера (что в некоторых случаях может вызвать мерцание)

Пересмотр версии 1.2.5

К сожалению, это сломало # 4782, из-за чего вид сзади иногда не анимировался правильно. Удаление $timeout , вероятно, слишком упрощенное решение для этого.

все еще есть проблема, даже когда я удаляю тайм-аут ..

+1

Есть и эта проблема ...

+1

+1

обратите внимание, обновление вашего bower.json помогает (правильное выделение), но есть небольшая задержка, как упоминалось

{
"name": "HelloIonic",
"частный": "правда",
"devDependencies": {
"ionic": "driftyco / ionic-bower # 1.7.12", // УБЕДИТЕСЬ, ЧТО ЭТО ОБНОВЛЕНО
"aws-sdk-js": "~ 2.0.9",
"bootstrap": "~ 3.2.0",
"platform.js": "платформа # ~ 1.3.1"
}
}

Во всяком случае, слабая вспышка есть только на android, и это всего лишь доли секунды.

Может ли кто-нибудь подтвердить, что 1.2.3 "copenhagen" устраняет эту проблему?

@mhartington @mlynch Я могу подтвердить, что это свойство все еще не работает с версией 1.2.3. Взгляните на эту последовательность снимков экрана.

Сначала я начинаю со своей вкладки "Счета" вот так:
screen shot 2016-01-19 at 2 05 26 pm

Затем я нажимаю на вкладку «Соседи по комнате», и происходят следующие шаги (которые вызывают мигание):

  1. В приложении указано название "Счета", но отображается закешированная вкладка "Соседи по комнате".
    screen shot 2016-01-19 at 2 05 38 pm
  2. Затем приложение удаляет весь контент, но по-прежнему показывает заголовок «Счета».
    screen shot 2016-01-19 at 2 05 48 pm
  3. Приложение показывает контент "Соседи по комнате"
    screen shot 2016-01-19 at 2 05 59 pm
  4. Приложение исчезает в заголовке «Соседи по комнате»
    screen shot 2016-01-19 at 2 06 15 pm

Сочетание всех этих шагов создает ужасное мерцание при переключении вкладок.

Чтобы увидеть, как работает ошибка, посмотрите это видео:
https://dl.dropboxusercontent.com/u/97539058/Bugs/tabs-bug.mp4

Привет, я понял, что моя ошибка связана с использованием SQLite в моем приложении. Извините за путаницу.

+1

+1

+1

Похоже, проблема с тайм-аутом

проблема просто исчезла для меня! проблема была связана с тем, как я построил свои вкладки!
убедитесь, что вы построили его правильно, навигация внутри вкладок тоже. позаботьтесь о контроллерах родители ==> ребенок

больше никакой белой вспышки

@princefr не могли бы вы уточнить?

Для iOS мне пришлось заменить css [ionic.CSS.TRANSITION_DURATION] на css.WebkitTransition в строке ionic.bundle.js 47715 и 47750

`// Переходы iOS
// -----------------------
provider.transitions.views.ios = function (enterEle, leaveEle, direction, shouldAnimate) {

function setStyles(ele, opacity, x, boxShadowOpacity) {
  var css = {};
  css.WebkitTransition = d.shouldAnimate ? '' : 0;
  css.opacity = opacity;
  if (boxShadowOpacity > -1) {
    css.boxShadow = '0 0 10px rgba(0,0,0,' + (d.shouldAnimate ? boxShadowOpacity * 0.45 : 0.3) + ')';
  }
  css[ionic.CSS.TRANSFORM] = 'translate3d(' + x + '%,0,0)';
  ionic.DomUtil.cachedStyles(ele, css);
}

var d = {
  run: function(step) {
    if (direction == 'forward') {
      setStyles(enteringEle, 1, (1 - step) * 99, 1 - step); // starting at 98% prevents a flicker
      setStyles(leavingEle, (1 - 0.1 * step), step * -33, -1);

    } else if (direction == 'back') {
      setStyles(enteringEle, (1 - 0.1 * (1 - step)), (1 - step) * -33, -1);
      setStyles(leavingEle, 1, step * 100, 1 - step);

    } else {
      // swap, enter, exit
      setStyles(enteringEle, 1, 0, -1);
      setStyles(leavingEle, 0, 0, -1);
    }
  },
  shouldAnimate: shouldAnimate && (direction == 'forward' || direction == 'back')
};

return d;

};

provider.transitions.navBar.ios = function (enterHeaderBar, leaveHeaderBar, direction, shouldAnimate) {

function setStyles(ctrl, opacity, titleX, backTextX) {
  var css = {};
  css.WebkitTransition = d.shouldAnimate ? '' : '0ms';
  css.opacity = opacity === 1 ? '' : opacity;

  ctrl.setCss('buttons-left', css);
  ctrl.setCss('buttons-right', css);
  ctrl.setCss('back-button', css);

  css[ionic.CSS.TRANSFORM] = 'translate3d(' + backTextX + 'px,0,0)';
  ctrl.setCss('back-text', css);

  css[ionic.CSS.TRANSFORM] = 'translate3d(' + titleX + 'px,0,0)';
  ctrl.setCss('title', css);
}

function enter(ctrlA, ctrlB, step) {
  if (!ctrlA || !ctrlB) return;
  var titleX = (ctrlA.titleTextX() + ctrlA.titleWidth()) * (1 - step);
  var backTextX = (ctrlB && (ctrlB.titleTextX() - ctrlA.backButtonTextLeft()) * (1 - step)) || 0;
  setStyles(ctrlA, step, titleX, backTextX);
}

function leave(ctrlA, ctrlB, step) {
  if (!ctrlA || !ctrlB) return;
  var titleX = (-(ctrlA.titleTextX() - ctrlB.backButtonTextLeft()) - (ctrlA.titleLeftRight())) * step;
  setStyles(ctrlA, 1 - step, titleX, 0);
}

var d = {
  run: function(step) {
    var enteringHeaderCtrl = enteringHeaderBar.controller();
    var leavingHeaderCtrl = leavingHeaderBar && leavingHeaderBar.controller();
    if (d.direction == 'back') {
      leave(enteringHeaderCtrl, leavingHeaderCtrl, 1 - step);
      enter(leavingHeaderCtrl, enteringHeaderCtrl, 1 - step);
    } else {
      enter(enteringHeaderCtrl, leavingHeaderCtrl, step);
      leave(leavingHeaderCtrl, enteringHeaderCtrl, step);
    }
  },
  direction: direction,
  shouldAnimate: shouldAnimate && (direction == 'forward' || direction == 'back')
};

return d;

}; `

Кажется, это исправлено для меня, когда я изменил эту строку https://github.com/driftyco/ionic/blob/master/js/angular/service/viewSwitcher.js#L142 на:

callback && ionic.requestAnimationFrame(callback);

Не уверен, что это правильный способ исправить это.

Происходит ли это и на некоторых выпусках iOS (помните, что отчет есть на выпусках Android)?

От: Абдул Вахаб [mailto: [email protected]]
Отправлено: среда, 10 февраля 2016 г., 21:59
Кому: driftyco / ionic [email protected]
Копия: Дэвид Ллойд [email protected]
Тема: Re: [ionic] ошибка: при переключении вкладок на Android появляется белая вспышка (# 3907)

Для iOS мне пришлось заменить css [ionic.CSS.TRANSITION_DURATION] на css.WebkitTransition в строке ionic.bundle.js 47715 и 47750

`// Переходы iOS
// -----------------------
provider.transitions.views.ios = function (enterEle, leaveEle, direction, shouldAnimate) {

function setStyles (ele, opacity, x, boxShadowOpacity) {
var css = {};
css.WebkitTransition = d.shouldAnimate? '': 0;
css.opacity = непрозрачность;
if (boxShadowOpacity> -1) {
css.boxShadow = '0 0 10px rgba (0,0,0,' + (d.shouldAnimate? boxShadowOpacity * 0.45: 0.3) + ')';
}
css [ionic.CSS.TRANSFORM] = 'translate3d (' + x + '%, 0,0)';
ionic.DomUtil.cachedStyles (ele, css);
}

var d = {
run: function (step) {
if (direction == 'вперед') {
setStyles (ввод Ele, 1, (1 - шаг) * 99, 1 - шаг); // начиная с 98% предотвращает мерцание
setStyles (leaveEle, (1 - 0,1 * шаг), шаг * -33, -1);

} else if (direction == 'back') {
  setStyles(enteringEle, (1 - 0.1 * (1 - step)), (1 - step) * -33, -1);
  setStyles(leavingEle, 1, step * 100, 1 - step);

} else {
  // swap, enter, exit
  setStyles(enteringEle, 1, 0, -1);
  setStyles(leavingEle, 0, 0, -1);
}

},
shouldAnimate: shouldAnimate && (direction == 'вперед' || direction == 'назад')
};

return d;

};

provider.transitions.navBar.ios = function (enterHeaderBar, leaveHeaderBar, direction, shouldAnimate) {

function setStyles (ctrl, opacity, titleX, backTextX) {
var css = {};
css.WebkitTransition = d.shouldAnimate? '': '0 мс';
css.opacity = непрозрачность === 1? '': непрозрачность;

ctrl.setCss ('кнопки-влево', css);
ctrl.setCss ('кнопки-вправо', css);
ctrl.setCss ('кнопка возврата', css);

css [ionic.CSS.TRANSFORM] = 'translate3d (' + backTextX + 'px, 0,0)';
ctrl.setCss ('обратный текст', css);

css [ionic.CSS.TRANSFORM] = 'translate3d (' + titleX + 'px, 0,0)';
ctrl.setCss ('заголовок', css);
}

function enter (ctrlA, ctrlB, step) {
если (! ctrlA ||! ctrlB) return;
var titleX = (ctrlA.titleTextX () + ctrlA.titleWidth ()) * (1 - шаг);
var backTextX = (ctrlB && (ctrlB.titleTextX () - ctrlA.backButtonTextLeft ()) * (1 - шаг)) || 0;
setStyles (ctrlA, step, titleX, backTextX);
}

function leave (ctrlA, ctrlB, step) {
если (! ctrlA ||! ctrlB) return;
var titleX = (- (ctrlA.titleTextX () - ctrlB.backButtonTextLeft ()) - (ctrlA.titleLeftRight ())) * шаг;
setStyles (ctrlA, 1 - шаг, titleX, 0);
}

var d = {
run: function (step) {
var enterHeaderCtrl = enterHeaderBar.controller ();
var leaveHeaderCtrl = leaveHeaderBar && leaveHeaderBar.controller ();
if (d.direction == 'назад') {
оставить (enterHeaderCtrl, leaveHeaderCtrl, 1 - шаг);
enter (leaveHeaderCtrl, enterHeaderCtrl, 1 - шаг);
} еще {
ввод (enterHeaderCtrl, leaveHeaderCtrl, шаг);
оставить (leaveHeaderCtrl, enterHeaderCtrl, шаг);
}
},
направление: направление,
shouldAnimate: shouldAnimate && (direction == 'вперед' || direction == 'назад')
};

return d;

}; `

-
Ответьте на это письмо напрямую или просмотрите его на GitHub https://github.com/driftyco/ionic/issues/3907#issuecomment -182324500. https://github.com/notifications/beacon/ABHsBD1Sp3tXsq8707UTfdVHgqSlxI0zks5pixaSgaJpZM4E82pl.gif

+1
мигает на android ..

1+

+1

ребята, просто " cache: true " в вашем " состоянии ", чтобы ваша страница была кэширована перед извлечением и рендеринг прошел гладко

@ Harish-here А что насчет первого раза?

Да, использовать cache: true только для этих целей - не лучшая идея.

@ Хариш-вот. . У меня есть приложение, которое использует одно и то же состояние для разных страниц. Т.е. это подробный вид, который принимает некоторые параметры $ state. Поскольку это одно и то же представление с другим контентом, я не могу использовать cache: false :)
И это тоже не кажется хорошей идеей для этой конкретной проблемы.

Все еще та же проблема здесь с 1.2.4-nightly-1917

+1

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

@princefr, пожалуйста, если вы можете

Для меня это все еще проблема, и это меня очень расстраивает. Есть ли какое-то движение или какое-то понятное решение?

+1

+1

Глядя на это завтра, ребята! :ухмылка:

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

Спасибо @mhartington!

Чтобы добавить еще немного контекста, в моей ситуации я обнаружил, что ошибка присутствует в следующем:

Index.html
<ion-nav-view></ion-nav-view>

view-1.html
<ANY ELEMENT>Something</ANY ELEMENT><ion-nav-view></ion-nav-view>

sub-view-1.html
<ANY></ANY>

Но НЕ присутствует, когда я удалил <ANY ELEMENT> из view-1.html.

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

Я пробовал ВСЕ способы ui-view / ion-view / ion-nav-view / ion-tabs / ion-pane / и т. Д. Абсолютно ничего не работало.

Эта проблема описывает ту же ошибку, но на iOS https://github.com/driftyco/ionic/issues/5888

@mhartington можете ли вы протестировать приложение для конференций? Я и @brandy смогли воспроизвести небольшую вспышку при переключении между вкладками. При этом использовался эмулятор, а не настоящее устройство.

Ошибка в # 5888 относится к ionic2, хотя я не уверен, что кодовые базы достаточно похожи, чтобы это была такая же ошибка.

привет, спасибо, что проявили терпение, очень признательны: smile:

Итак, глядя на вещи, это должно влиять как на iOS, так и на Android с ionic 1.2.4, верно?

Кроме того, кто-нибудь смог воссоздать это с помощью начального приложения вкладок?

@mhartington он есть в стартовом приложении вкладок, вам просто нужно быть очень внимательным. Кроме того, я исправил это в https://github.com/driftyco/ionic/pull/4654, но, видимо, это сломало что-то еще, а затем, когда это было исправлено, это снова было сломано.

Вы можете увидеть это в опубликованном вами видео: https://www.youtube.com/watch?v=_ja8a08iSPE&feature=youtu.be. Обратите внимание, как вместо новой вкладки появляется очень короткая белая вспышка (1 кадр, это очень быстрый).

@andreialecu, хорошо, я

https://youtu.be/R5EafRKTst0

Тот же клип, только сильно замедленный

Глядя на PR, собираюсь увидеть, что можно сделать и не допустить, чтобы он ломал другие вещи: grin:

Всем привет! Так что я думаю, что смог немного разобраться в этом. Я открыл PR, который хорошо выглядит в моих тестах, но хотел бы сначала услышать от вас отзывы.

В ветку viewFlicker внесены изменения.

https://github.com/driftyco/ionic/pull/5937

Если вы не возражаете вытащить код, собрать Ionic из исходного кода и протестировать изменения в своем приложении, мы можем посмотреть, исправит ли это ситуацию и устранить эту ошибку: shipit:

Потрясающие. Это лиса для Android или iOS тоже будет выглядеть лучше?

Банкомат @ctcampbell для Android. В моих тестах мне не удалось вызвать мерцание на iOS.

Вот короткое видео, демонстрирующее PR

https://youtu.be/nWSuocu64FU

+1

@jordantomax означает ли это, что пиар вам

Упс, извините. Просто подписывайтесь на ленту. Хотя я могу это проверить. Нужно ли мне что-то компилировать, чтобы использовать, я вижу, что ваш коммит не коснулся релиза.

Ах

Вы можете выполнить следующие действия.

git clone https://github.com/driftyco/ionic.git
cd ionic 
git checkout viewFlicker
npm install
gulp build

И у вас должен быть скомпилированный код в dist/js/ionic.bundle.js
Вы должны иметь возможность просто скопировать / вставить этот код в тестовый проект и опробовать его.

Кажется, хорошо работает в приложении тестовых вкладок. Однако у меня все еще возникают проблемы с перепрошивкой в ​​моем приложении. Я использую вкладки и меню, но вкладки отображаются только на определенных страницах. Я хочу снять видео, чтобы показать вам, как мне это сделать?

Не могли бы вы вместо этого создать минимальный код или репозиторий git, который я мог бы клонировать и протестировать?
Аналогичная настройка вашего приложения

Отличная идея. Я постараюсь сделать это сегодня вечером или завтра утром. Спасибо за вашу помощь.

@mhartington Я только что протестировал его в своем приложении, и мерцание, похоже, исчезло. : +1:

Я протестировал исправление с помощью стартера вкладок на Nexus 6 с предварительным просмотром Android N, Nexus 7 2013 с 6.0.1, Moto X 2014 с 5.1 и Nexus 7 2013 с 4.4.4 и не увидел никаких миганий на любое из этих устройств. Потрясающие !

@jordantomax удачно собрал этот пример?

@mhartington извините, мы полностью завалились! Я надеюсь поработать над этим в воскресенье.

@mhartington Я только что протестировал это в своем приложении, которое я создаю, и Android и iPhone, похоже, исправлены с помощью # 5937.

@jordantomax , у вас была возможность собрать пример?

Спасибо,
Дэн

Всем привет,

Это исправление работает хорошо, но похоже, что плагин native-page-transitions затем не работает должным образом ... переходы делают сумасшедшие вещи после того, как я установил это исправление. Как вы думаете, это связано?

@tgensol Используйте параметры по умолчанию для этого плагина, это хорошо работает с этим исправлением!

Всем здравствуйте! Судя по моему тестированию, и вы, ребята, тестируете исправление, кажется, работает, я собираюсь закрыть эту проблему на данный момент. @jordantomax, если у вас будет возможность провести этот тест вместе, не стесняйтесь публиковать, и я с радостью снова открою (:. Также

С критическими изменениями в ионном репо, как нам скомпилировать и построить это

Ветвь 1.x теперь называется Ionic 1.3.1 . Если вы клонируете репо и проверяете ветку, вы сможете запустить gulp build для создания распространяемых файлов. Пожалуйста, дайте мне знать, если у вас возникнут проблемы с этим.

Спасибо,
Дэн

Спасибо. уже скачал dist вручную: D

+1

Я исправил это. Это происходит в связи с поведением ионной панели при обновлении ионного обзора: новая полоса, созданная перед входом, скрывает старую полоску (текущую) и мигает. Решение - отложить скрытие текущего бара до события после входа. Если у вас есть вопросы, напишите мне.

@smcreator не могли бы вы поделиться фрагментами кода?

У меня все еще такая же проблема .... любые фрагменты кода Спасибо

Я думаю, что эта проблема исправлена ​​в последних версиях ionic.

У меня была та же проблема, и ответ от @princefr был ключевым. У меня было несколько панелей навигации по представлениям. Добавляя ion-nav-bar только поверх моего файла tabs.html я исправил проблему:

<ion-nav-bar class="my-custom-bar">
  <ion-nav-back-button class="button-clear">
    <i  class="button button-icon ion-android-arrow-back" ng-click="vm.goBack()"></i>
  </ion-nav-back-button>
</ion-nav-bar>

<ion-tabs>
....
</ion-tabs>

Спасибо за вопрос! Эта проблема заблокирована, чтобы предотвратить комментарии, не относящиеся к исходной проблеме. Если это все еще проблема с последней версией Ionic, создайте новую проблему и убедитесь, что шаблон полностью заполнен.

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