Have anyone implemented a shrinking header like instagram? ie, similar to Scroll Sista
Thanks.
Have anyone implemented a shrinking header like instagram? ie, similar to Scroll Sista
Thanks.
I’m guessing/hoping Ionic will eventually build this in as official option. Looks like they tried it for v1 but I think it was too buggy.
Is there anything out there by now? Anyone?
Hi guys,
Here is the code I am using. I am new to ionic 2 so feel free to make improvements.
So, here are the steps to get it working:
Place the following in the .ts file you need the header shrinker.
Import shrink.ts
import {Shrink} from ..
Add provider
@Component({
templateUrl: 'build/pages/mypage/mypage.html',
providers: [Shrink]
})
Add ViewChild
export class SomeClass {
@ViewChild(Content) content: Content;
Add Shrink to constructor
constructor(private header: Shrink) {
Add funcion
ngAfterViewInit() {
this.header.init(this.content);
}
In your .html add the following to ion-header
<ion-header [ngStyle]="header.returnStyle()">
You may want to add fullscreen to your ion-content
<ion-content fullscreen>
Place shrink.ts in your project to import it
https://gist.github.com/jfsemaan/1b767c6f3630cc471baebb7bd5f60ba5