Скрытие заголовка при прокрутке контента в Ionic 4

Question

ионный заголовок исправлен, он всегда остается в верхней части экрана.

Я бы хотел, чтобы он исчезал со страницей при прокрутке.

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

Answer 1

Как насчет

<ion-header *ngIf="hide">

Пока вы захватываете событие и делаете

this.hide = !this.hide;

Протестировано с событием нажатия кнопки, и работает:)

То же самое может бытьизменено с использованием простого CSS-класса, но это зависит от ваших требований.

<ion-content [scrollEvents]="true" (ionScroll)="onScroll($event)">

в коде функции onScroll, который вы можете включить, можно переключить переменную "hide"

onScroll(event:any) { 
    console.log(event); 
    this.hide = !this.hide; 
}

, чтобы показать/ скрыть заголовок.

Кроме того, следующие ionic-4-how-to-to-to-top-bottom-using-ion-content-scroll-события могут быть полезны для вас, какпрокрутить содержимое.