1. #1
    Sencha User
    Join Date
    Jun 2012
    Posts
    33
    Answers
    3
    Vote Rating
    2
    deliriousrhino is on a distinguished road

      0  

    Default Answered: Tap event on a toolbar

    Answered: Tap event on a toolbar


    I want a add a feature to my site where if a users taps on the top toolbar the contents of the page would scroll back to the top.


    I can handle the scrolling. I just noticed that the toolbar does not have a tap event. Is there a way I can make it throw one?

  2. I solved this problem by placing a absolutely position button in my base class for all my views

    {
    xtype: 'button',
    action: 'scrollToTop',
    cls: 'scrollTopTopBtn',
    top: 0,
    left: 60,
    width: Ext.Viewport.getSize().width - 120,
    height: 43
    }

    Then I listened for the 'scrollToTop' action in a controller

  3. #2
    Sencha - Community Support Team sword-it's Avatar
    Join Date
    May 2012
    Location
    Istanbul
    Posts
    1,332
    Answers
    124
    Vote Rating
    83
    sword-it is a jewel in the rough sword-it is a jewel in the rough sword-it is a jewel in the rough sword-it is a jewel in the rough

      0  

    Default


    Hi deliriousrhino,

    You can do this to add item (like button) into your top toolbar, for example
    Code:
    {
                xtype : 'toolbar',
                docked: 'top',
                items:[{
                    text:'Return Top',
                    handler:function(){
                        alert('Scrolling top');
                    }
                }]
            }
    sword-it.com, Sencha Developer House in Turkey - Istanbul University Technopark Suite 204.

  4. #3
    Sencha User
    Join Date
    Jun 2012
    Posts
    33
    Answers
    3
    Vote Rating
    2
    deliriousrhino is on a distinguished road

      0  

    Default


    Thanks sword-it.

    It see how it could be done in your example.

    However I would much rather listen for an a event in a controller via controls that way I would not need to add the item and handle to every toolbar. Also I use now navigation views which add their own toolbars

  5. #4
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    35,704
    Answers
    3356
    Vote Rating
    750
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default


    The buttons will fire the tap event so you can listen to them in the controller
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

  6. #5
    Sencha User
    Join Date
    Jun 2012
    Posts
    33
    Answers
    3
    Vote Rating
    2
    deliriousrhino is on a distinguished road

      0  

    Default


    I solved this problem by placing a absolutely position button in my base class for all my views

    {
    xtype: 'button',
    action: 'scrollToTop',
    cls: 'scrollTopTopBtn',
    top: 0,
    left: 60,
    width: Ext.Viewport.getSize().width - 120,
    height: 43
    }

    Then I listened for the 'scrollToTop' action in a controller

  7. #6
    Sencha User
    Join Date
    Nov 2013
    Posts
    6
    Vote Rating
    1
    shashi@sencha is on a distinguished road

      0  

    Default


    Go through this, I am able to make toolbar tappable by this -


    var toolbar = {
    xtype: 'toolbar',
    id: 'matters',
    name: 'matters',
    ui: 'plain',
    cls: 'whitebutton',
    margin: '20 0 0 0',
    items:[{
    xtype: 'component',
    html: 'Matters'
    },{
    xtype: 'spacer'
    },{
    xtype: 'component',
    html:'>'
    }],
    listeners:{
    initialize: function(){
    this.element.on({
    tap: function(){
    Ext.Msg.alert('Hi,', 'you tapped me.');
    }
    })
    }
    }


    };


    hope it helps.

  8. #7
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    35,704
    Answers
    3356
    Vote Rating
    750
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default


    Instead of listening to initialize to add another listener, use one listener:

    Code:
    listeners : {
        element : 'element',
        tap : function() {....}
    }
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

film izle

hd film izle

film sitesi

takipci kazanma sitesi

takipci kazanma sitesi

güzel olan herşey

takipci alma sitesi

komik eğlenceli videolar