Page 1 of 2 12 LastLast
Results 1 to 10 of 17

Thread: ExtJs 6.5.3.57 Modern Material - Screen is not resize when Tablet keyboard is display

  1. #1
    Ext JS Premium Member dtex-lab's Avatar
    Join Date
    Sep 2009
    Location
    Italy
    Posts
    411

    Question Answered: ExtJs 6.5.3.57 Modern Material - Screen is not resize when Tablet keyboard is display

    Hi
    I have a simple MsgBox asking a text
    on a Tablet (android with latest chrome but also on others browser and iOS too).. when the user put the focus on the text field, the keyboard appeart, but screen is not resize and so the dialog is not visible

    if you check in the fiddle

    https://fiddle.sencha.com/#view/editor&fiddle/2ffr

    (keep the tablet in landscape mode)

    tap on the text field inside the dialog.. the keyboard appears.. but the preview section will not resize and so the dialog is not more visible (or not fully visible)
    instead the "code" part is resized..
    how resize the MsgBox ?

    Thanks
    we make IT work for you

  2. You can write a handler for Ext.view resize event: http://docs.sencha.com/extjs/6.5.1/m...l#event-resize

    Important note: For the best performance on mobile devices, use this only when you absolutely need to monitor a Element's size. Note: This event is not available to be used with event delegation. Instead resize only fires if you explicitly add at least one listener to it, for performance reasons.

  3. #2
    Sencha User yeghikyan's Avatar
    Join Date
    Mar 2009
    Location
    München
    Posts
    574
    Answers
    99

    Default

    Have you tried to set height property in percents?
    z.B.
    height: '80%'
    "The competent programmer is fully aware of the strictly limited size of his own skull; therefore he approaches the programming task in full humility, and among other things he avoids clever tricks like the plague." – Edsger W. Dijkstra

  4. #3
    Ext JS Premium Member dtex-lab's Avatar
    Join Date
    Sep 2009
    Location
    Italy
    Posts
    411

    Default

    Hi
    Quote Originally Posted by yeghikyan View Post
    Have you tried set height property in percents?
    z.B.
    height: '80%'
    I just try it and doesn't works.. test with 80%, 50% .. but doesn't works
    Thanks
    we make IT work for you

  5. #4
    Sencha User yeghikyan's Avatar
    Join Date
    Mar 2009
    Location
    München
    Posts
    574
    Answers
    99

    Default

    So is better:

    Code:
    Ext.application({
        name: 'Fiddle',
    
    
        launch: function () {
            Ext.Msg.show({
                title: "Keyboard Issue",
                value: "Initial Value",
                message: "Try to enter a text below:",
                //modal: true,
                //width: '50%',
                
                
                height : '100%',
                maxHeight: 250,
                
                
                buttons: Ext.MessageBox.OKCANCEL,
                multiLine: true,
                //prompt: true,
                fn: Ext.emptyFn
            });
        }
    });
    "The competent programmer is fully aware of the strictly limited size of his own skull; therefore he approaches the programming task in full humility, and among other things he avoids clever tricks like the plague." – Edsger W. Dijkstra

  6. #5
    Sencha User yeghikyan's Avatar
    Join Date
    Mar 2009
    Location
    München
    Posts
    574
    Answers
    99
    "The competent programmer is fully aware of the strictly limited size of his own skull; therefore he approaches the programming task in full humility, and among other things he avoids clever tricks like the plague." – Edsger W. Dijkstra

  7. #6
    Ext JS Premium Member dtex-lab's Avatar
    Join Date
    Sep 2009
    Location
    Italy
    Posts
    411

    Default

    Thanks
    Are you using iOS ?

    under iPAD in both safari and chrome is working
    But under Android.. it doesn't works (under Chrome)

    really under iPAD/iOS is working also my version (no idea why before not.. maybe different code).. it is not working under Androd (6.0.1)
    we make IT work for you

  8. #7
    Sencha User yeghikyan's Avatar
    Join Date
    Mar 2009
    Location
    München
    Posts
    574
    Answers
    99

    Default

    Yes, iOS.
    "The competent programmer is fully aware of the strictly limited size of his own skull; therefore he approaches the programming task in full humility, and among other things he avoids clever tricks like the plague." – Edsger W. Dijkstra

  9. #8
    Ext JS Premium Member dtex-lab's Avatar
    Join Date
    Sep 2009
    Location
    Italy
    Posts
    411

    Default

    Ok. so you confirmed me..
    under Android is not working.
    can it be a bug of extjs?
    we make IT work for you

  10. #9
    Sencha User yeghikyan's Avatar
    Join Date
    Mar 2009
    Location
    München
    Posts
    574
    Answers
    99

    Default

    can you show the screenshot?
    "The competent programmer is fully aware of the strictly limited size of his own skull; therefore he approaches the programming task in full humility, and among other things he avoids clever tricks like the plague." – Edsger W. Dijkstra

  11. #10
    Ext JS Premium Member dtex-lab's Avatar
    Join Date
    Sep 2009
    Location
    Italy
    Posts
    411

    Default

    Attached a small video

    regards
    we make IT work for you

Page 1 of 2 12 LastLast

Similar Threads

  1. Ext.js 6.5 Modern Material Design Snippets
    By busaware1 in forum Ext:User Extensions and Plugins
    Replies: 1
    Last Post: 31 May 2017, 10:23 AM
  2. Replies: 2
    Last Post: 9 Jan 2017, 8:55 PM
  3. [OPEN] textareafield won't flex with modern / material theme
    By froamer in forum Ext 6.2 Early Access
    Replies: 2
    Last Post: 8 Sep 2016, 3:04 AM
  4. how to create viirtual keyboard in extjs 6 modern toolkit
    By chandrakalametta in forum Ext JS 6.x Q&A
    Replies: 4
    Last Post: 14 Apr 2016, 4:18 AM

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •