Gelmiş geçmiş en büyük porno sitemiz olan 2pe de her zaman en kaliteli pornoları sunmayı hedefledik. Diğer video sitemiz olan vuam da ise hd porno ağırlıklı çalışmalara başladık.

Hybrid View

  1. #1
    Sencha User
    Join Date
    Feb 2012
    Location
    New York, NY
    Posts
    52
    Vote Rating
    3
    roycyang is on a distinguished road

      2  

    Default Extending Ext.Button for better UX and responsive tap

    Extending Ext.Button for better UX and responsive tap


    GT.FixedButton
    ==============

    This extends the Ext.Button in Sencha Touch 2.0 for a different, more iOS like user experience. As the name suggests this works well for buttons that are fixed and not in a scrollable container. It might also work with buttons in a scrollable container but haven't tested yet.

    Code and Example
    ===============
    The code is here: https://github.com/roycyang/sencha-touch-extensions
    An example is here: http://roycyang.github.com/sencha-touch-extensions/example

    Screen Shot 2012-04-24 at 10.17.49 AM.png

    The Problem
    ===============

    Currently, Ext.Button has the following rules:

    1. The button fires on the tap event. This is not optimal because the user needs to tap the button and release it exactly on the same pixel, or else the tap event doesn't fire. There is a thread about using moveThrottle (http://www.sencha.com/forum/showthre...t=movethrottle) to give the tap event a tolerance:

    Code:
        Ext.application({
            eventPublishers: {
                touchGesture: {
                    moveThrottle: 3
                }
            },
            // ...
        });
    But this code messes with the other touch events, making the carousel and all scrolling look choppy. Even if that choppiness was acceptable, a 3px or 5px tolerance still isn't good enough. Some users are "sloppy" tappers.

    2. When you touch a button, the press state is added. Only when you let go (touchend), does the press state disappear. Even if you touch the button and drag your finger off, the press state remains. There is a fundamental flaw in the logic in that when the user sees the "press state" activated, they would expect the button to be "tapped" when they let go.

    The Alternative
    ===============

    This attempts to solve the issues by doing the following:

    1. The tap zone is now larger than the button itself. This is done using a tapmask and is inspired by SunboX and Lim Chee Aun's post: http://cheeaun.com/blog/2012/03/how-...b-app#the-feel
    2. Upon press, the tap zone is doubled.
    3. The tap event is tied to touchstart and touchend. If you touch the button and then release and are still on tap zone, it will fire the tap event. The user can now be as "sloppy" as they want and there is a now a buffer zone around the button.
    4. The press state is also tied to touchmove. If you activate the button press and then move your finger off the button, the press state disappears and the tap event won't fire.

    Getting Started
    ===============

    To use this, add the following to your app.js:

    Code:
    Ext.Loader.setPath({
        'GT': 'GT'
    });
    From there, you will have access to the fixed button by using:

    Code:
    requires: ['GT.FixedButton']
    
    
    //...
    xtype: 'fixedbutton'
    // these are default, only add if you are changing
    tapMask: null, // change to true to see the zone, good for debugging
    tapOverflowTop: 10, // in pixels
    tapOverflowBottom: 10, // in pixels
    tapOverflowLeft: 10, // in pixels
    tapOverflowRight: 10 // in pixels

  2. #2
    Sencha User
    Join Date
    Mar 2012
    Posts
    28
    Vote Rating
    0
    gcw07 is on a distinguished road

      0  

    Default


    Looks very interesting. I'm building an app that uses several fixed buttons so this would fit in great. However, I don't see a download link anywhere for the package.

  3. #3
    Sencha User
    Join Date
    Feb 2012
    Location
    New York, NY
    Posts
    52
    Vote Rating
    3
    roycyang is on a distinguished road

      0  

    Default


    Quote Originally Posted by gcw07 View Post
    Looks very interesting. I'm building an app that uses several fixed buttons so this would fit in great. However, I don't see a download link anywhere for the package.
    Oops, added the github repo and some example code to the top post.

  4. #4
    Sencha User
    Join Date
    Sep 2011
    Posts
    46
    Vote Rating
    0
    Zyphrax is on a distinguished road

      0  

    Default


    Nice work!

    Sencha should change this in the framework.

  5. #5
    Sencha User
    Join Date
    Feb 2012
    Location
    New York, NY
    Posts
    52
    Vote Rating
    3
    roycyang is on a distinguished road

      0  

    Default


    After testing in iOS, it appears that there is a bug in the touch targets, which I've submitted here: http://www.sencha.com/forum/showthre...s-wrong-in-iOS

    The jist is that when you listen to the touchmove event:

    Code:
    touchmove: function(event, target){
    console.log('target should be: ' + target.id)
    }
    What is returned should be what you're currently "touching" but always returns the first thing you touched which means there is no information on what you touched when you release.

    In Chrome/Safari, it displays the correct behavior hence the example works in chrome but isn't 100% in iOS yet.

  6. #6
    Sencha User SunboX's Avatar
    Join Date
    Mar 2010
    Posts
    238
    Vote Rating
    28
    SunboX has a spectacular aura about SunboX has a spectacular aura about

      0  

    Default


    Really nice, would be cool if this worked as overwrite of default Sencha Buttons.

    Who is interested in the iOS Button behavior, Lim Chee Aun did a really nice write on this:
    http://cheeaun.com/blog/2012/03/how-...b-app#the-feel

    greetings Sunny