Using keyboard with list of inputs

mamcgree commented 7 years ago

Greetings...

I have a scrolling list of ion-inputs.. when I call up your keyboard it covers some of the inputs. Any suggestions on how to use it with a list of inputs. I can seem to figure out how to shrink the scrolling area so I can see the last inputs in the list.

Thank you in advance for your time.. Cheers.. Mark..

skol-pro commented 7 years ago

Hi mamcgree ! I'm really pleased you enjoy the plugin ! :-)

Ok, short tip regarding scrolling to input:

<input type="text" (click)="doSomething($event)"></input>

import { Content } from 'ionic-angular';

[...]

@Component({...})
export class CMP_NAME {
    @ViewChild(Content) content: Content;

    [...]

    public doSomething(event) {
        let target = event.target || event.srcElement || event.currentTarget;
        let offsetTop = target.offsetTop;

        // scrollTo(x, y, duration)
        this.content.scrollTo(0, offsetTop, 150);

        [...]
        // Show keyboard and all the stuff ;-)
    }
}

Hop it will help you, someone told me it worked for him, but haven't tested my-self. I've planned on doing a bit of refactoring and making a service to handle all those things, hope I'm going to find time soon :-)

mamcgree commented 7 years ago

Thanks for the quick response.. Will give it a try and let you know..

Cheers..

On 04/26/2017 12:10 PM, Skol wrote:

Hi mamcgree ! I'm really pleased you enjoy the plugin ! :-)

Ok, short tip regarding scrolling to input:

<input type="text" (click)="doSomething($event)"> import {Content }from 'ionic-angular';

[...]

@Component({...}) export class CMP_NAME { @ViewChild(Content) content: Content;
 [...]

 public  doSomething(event) {
     let  target=  event.target  ||  event.srcElement  ||  event.currentTarget;
     let  offsetTop=  target.offsetTop;

     // scrollTo(x, y, duration)
     this.content.scrollTo(0, offsetTop,150);

     [...]
     // Show keyboard and all the stuff ;-)
 }
}

Hop it will help you, someone told me it worked for him, but haven't tested my-self. I've planned on doing a bit of refactoring and making a service to handle all those things, hope I'm going to find time soon :-)

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/skol-pro/ion-digit-keyboard-v2/issues/7#issuecomment-297461698, or mute the thread https://github.com/notifications/unsubscribe-auth/AK1lM4a74JCCMn-rDgKQbRP0A58xBH2Qks5rz2x7gaJpZM4NJFeK.

mamcgree commented 7 years ago

Greetings..

Your solution works, except for the items a the bottom of the list which cannot be scrolled above the keyboard. Any more suggestions??

Cheers..

skol-pro commented 7 years ago

Glad to read that :-)

Ha ha, well, you can work with an if statement based on offsetTop, if it's > of content - keyboard width, then add a temporary bottom margin to the input ? :-/ (that's a quick answer, don't know if it's the best :-p ... ).

mamcgree commented 7 years ago

Working on something similar.. Going to add blank ion-items.. Its dirty but I think it will work..

Thanks for your help and your great plugin..

Cheers

On 04/26/2017 03:23 PM, Skol wrote:

Glad to read that :-)

Ha ha, well, you can work with an if statement based on offsetTop, if it's > of |content - keyboard width|, then add a temporary bottom margin to the input ? :-/ (that's a quick answer, don't know if it's the best :-p ... ).

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/skol-pro/ion-digit-keyboard-v2/issues/7#issuecomment-297514966, or mute the thread https://github.com/notifications/unsubscribe-auth/AK1lMxhifxLrQlsE4CwS4J_cnLCBgeYAks5rz5mygaJpZM4NJFeK.

mamcgree commented 7 years ago

Greetings..

Your keyboard works great. Is there any way to change the height (the same way to change the width)?

Cheers.

On 04/26/2017 03:23 PM, Skol wrote:

Glad to read that :-)

Ha ha, well, you can work with an if statement based on offsetTop, if it's > of |content - keyboard width|, then add a temporary bottom margin to the input ? :-/ (that's a quick answer, don't know if it's the best :-p ... ).

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/skol-pro/ion-digit-keyboard-v2/issues/7#issuecomment-297514966, or mute the thread https://github.com/notifications/unsubscribe-auth/AK1lMxhifxLrQlsE4CwS4J_cnLCBgeYAks5rz5mygaJpZM4NJFeK.

skol-pro commented 7 years ago

hi !

Glad to read that ! Hum well, not actually, sorry :-/ But that’s a good remark, there is no reasons it won’t be possible !

Le 28 avr. 2017 à 20:13, mamcgree notifications@github.com a écrit :

Greetings..

Your keyboard works great. Is there any way to change the height (the same way to change the width)?

Cheers.

On 04/26/2017 03:23 PM, Skol wrote:

Glad to read that :-)

Ha ha, well, you can work with an if statement based on offsetTop, if it's > of |content - keyboard width|, then add a temporary bottom margin to the input ? :-/ (that's a quick answer, don't know if it's the best :-p ... ).

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/skol-pro/ion-digit-keyboard-v2/issues/7#issuecomment-297514966, or mute the thread https://github.com/notifications/unsubscribe-auth/AK1lMxhifxLrQlsE4CwS4J_cnLCBgeYAks5rz5mygaJpZM4NJFeK.

— You are receiving this because you commented. Reply to this email directly, view it on GitHub https://github.com/skol-pro/ion-digit-keyboard-v2/issues/7#issuecomment-298069151, or mute the thread https://github.com/notifications/unsubscribe-auth/AKINEVEmrsuObWs9pKb6nhOf64FgNWi3ks5r0ixWgaJpZM4NJFeK.

skol-pro / ion-digit-keyboard-v2

Using keyboard with list of inputs #7