1. #1
    Sencha User
    Join Date
    Oct 2010
    Posts
    80
    Vote Rating
    0
    linuxyf is on a distinguished road

      0  

    Default How to implement flip (turn page not slide page) effects like jpageflipper??

    How to implement flip (turn page not slide page) effects like jpageflipper??


    How to implement flip (turn page) effects like jpageflipper (http://jpageflipper.codeplex.com/)

  2. #2
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    37,017
    Vote Rating
    849
    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


    There is quite a bit of CSS that goes into that.
    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.

  3. #3
    Sencha User
    Join Date
    Oct 2010
    Posts
    80
    Vote Rating
    0
    linuxyf is on a distinguished road

      0  

    Default


    mitchellsimoens , can you give me a css reference link?

  4. #4
    Sencha User
    Join Date
    Aug 2011
    Location
    London
    Posts
    393
    Vote Rating
    16
    digeridoopoo will become famous soon enough

      0  

    Default Digeridoopoo

    Digeridoopoo


    Have you seen wink toolkit? Similar to sencha touch but with some extra effects...like page flip.
    Not sure how well they will play together though as I haven't tried it...

  5. #5
    Sencha User
    Join Date
    Mar 2007
    Location
    Haarlem, Netherlands
    Posts
    1,243
    Vote Rating
    10
    TommyMaintz will become famous soon enough TommyMaintz will become famous soon enough

      0  

    Default


    The reason why we haven't implemented these flip like transitions yet is because they won't work on anything other then iOS. Android has some serious issues with css transforms, causing the whole page to flicker and form fields to randomly break. We wanted to provide transitions out of the box that work across all devices. We might add some iOS only plugins later with support for 3d transitions.

  6. #6
    Sencha User
    Join Date
    Feb 2012
    Posts
    1
    Vote Rating
    0
    Stan W. is on a distinguished road

      0  

    Default


    you can use some special services or software that creates these flippingbooks.
    they usually work not only on ios

  7. #7
    Sencha User
    Join Date
    Mar 2012
    Posts
    1
    Vote Rating
    0
    zambadu is on a distinguished road

      0  

    Default


    I have the same demand.
    And found this JQuery-driven flipper: http://builtbywill.com/code/booklet/, it works fine on Android (Gingerbread & Ice-Cream-Sandwich) and iOS5.

    But how can I put this together with Sencha? As custom animation? No Idea...

  8. #8
    Sencha User
    Join Date
    May 2012
    Posts
    2
    Vote Rating
    0
    flipbook is on a distinguished road

      0  

    Default Re: How to implement flip effects

    Re: How to implement flip effects


    I know the page flip effect can be made via freeware like Codebox, Flipsnack, flip page software(http://bit.ly/ymDrhl ) etc from PDF files.