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

Thread: newby Question, what component to use (see enclosed a sketch)

  1. #1
    Sencha User chris_nl's Avatar
    Join Date
    Nov 2011
    Location
    Amstedam
    Posts
    34
    Answers
    1
    Vote Rating
    0
      0  

    Question Answered: newby Question, what component to use (see enclosed a sketch)

    Hello, I am new to the Sencha touch framework. And I have been reading a lot of documentation.
    I finally got a Ext.dataview.List working, but I really don't know where to go from here (phase 1 to phase 2) in my Sketch. It will be a simple webapp for learning purpurse and to make my father in law happy.

    Could someone please help me out how to connect the ontap click to show the page content with a bar above it and a back button? I can't find it in the documention or a sample of how it is done.

    And am I using the right Sencha components in my sketch? Any tips are welcome!

    Kind regards, Chris.
    sketch2.jpg
    Attached Images Attached Images

  2. Usually don't do this but since I have seen others asking for a simple MVC example using Sencha Touch 2 I have decided to create a simple MVC app based on your needs. This is using PR3 but later versions I will try to update this example. See attached zip file and of course change the path to your PR3 in index.html

  3. #2
    Sencha - Sr Software Engineer mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    39,317
    Answers
    3883
    Vote Rating
    1291
      0  

    Default

    Usually don't do this but since I have seen others asking for a simple MVC example using Sencha Touch 2 I have decided to create a simple MVC app based on your needs. This is using PR3 but later versions I will try to update this example. See attached zip file and of course change the path to your PR3 in index.html
    Attached Files Attached Files
    Mitchell Simoens @LikelyMitch
    Sencha Inc, Senior Software Engineer
    ________________
    Learn BBCode and use it!

    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.

  4. #3
    Sencha User chris_nl's Avatar
    Join Date
    Nov 2011
    Location
    Amstedam
    Posts
    34
    Answers
    1
    Vote Rating
    0
      0  

    Default Thanks :)

    Thank you for providing a Example Mitchel!
    I will look at it tomorrow and give it a try.
    Thanks in advance! I will reply on the form if I got it working
    Kind regards from Holland!
    Chris.

  5. #4
    Sencha User chris_nl's Avatar
    Join Date
    Nov 2011
    Location
    Amstedam
    Posts
    34
    Answers
    1
    Vote Rating
    0
      0  

    Default

    Hello Mitchel, Thank you for your time and providing a excellent example!
    To be honest, I am not sure if I can fully understand of what happens as I am not familiar with
    the Sencha framework. I hope I can wrap my head around it in Time. But it's a good example to start
    learning it.

    Is there an option to make the content slide in like in the example of the nestedList? I tried searching for what property or settings that made the nestedList animate, but I could not find it. Is it because the content is a Panel?

    Did I also had to do something with the read-me file? Because I could not find the .js files in your description
    And I am working from a Windows platform, so it's different I guess.

    Thanks for your effort so far!

  6. #5
    Sencha - Sr Software Engineer mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    39,317
    Answers
    3883
    Vote Rating
    1291
      0  

    Default

    The animations aren't 100% quite yet. You can use it but you may run into errors. If you open app/view/Viewport.js and on line 7 your should see this:

    Code:
            layout : 'card'
    Replace that line with this:

    Code:
            layout     : {
                type      : 'card',
                animation : {
                    type : 'slide'
                }
            },
    The animation Object is a config where you can define the duration, directions and such.
    Mitchell Simoens @LikelyMitch
    Sencha Inc, Senior Software Engineer
    ________________
    Learn BBCode and use it!

    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.

  7. #6
    Sencha User
    Join Date
    Sep 2011
    Posts
    22
    Vote Rating
    0
      0  

    Default Sub-directories and MVC

    Mitchell,

    Thanks for the great example, it was a great help and much needed. One question I have is I would like to organize my views, controllers, stores, and models script files into sub-directories based on function. Is there something special we need to do so that the application can find all the script files in the correct sub-directories?

    Thanks
    Ron

  8. #7
    Sencha User
    Join Date
    Oct 2011
    Posts
    127
    Answers
    4
    Vote Rating
    0
      0  

    Default

    Thank you Mitchell!!! This was sorely needed.

  9. #8
    Sencha Premium Member
    Join Date
    Nov 2011
    Posts
    162
    Answers
    7
    Vote Rating
    2
      0  

    Default

    Thanks again Mitchell. Since the demise of Flex was announced by Adobe, there are alot of "Flexfugees" branching out into the JS world. APIs are nice, but it always helps to see how exactly an application should be put together, and how those pieces and parts interact.

  10. #9
    Sencha - Sr Software Engineer mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    39,317
    Answers
    3883
    Vote Rating
    1291
      0  

    Default

    Quote Originally Posted by ron_stahl View Post
    Mitchell,

    Thanks for the great example, it was a great help and much needed. One question I have is I would like to organize my views, controllers, stores, and models script files into sub-directories based on function. Is there something special we need to do so that the application can find all the script files in the correct sub-directories?

    Thanks
    Ron
    So using Ext.Loader, the filesystem has to match the class name (case sensitive)... Here are some class names and filesystem pairs...

    MyApp.view.users.List
    /app/view/users/List.js

    MyApp.controller.Main
    /app/view/controller/Main.js

    MyApp.util.Locale
    /app/util/Locale.js

    Override.app.Application
    /overrides/app/Application.js

    You can see a trend. This example is using MVC so the name config of the Ext.application call is 'MyApp' and the default path setup is MyApp is resolved to the 'app' directory. This is the default so the path is already setup for us. The 4th example uses the namespace root of 'Override' and we need to have it resolve to the 'overrides' directory. To do that, we need to setup a path for it:

    Code:
    Ext.Loader.setConfig({
        enabled : true,
        paths   : {
            Override : 'overrides'
        }
    });
    Hope this helps.
    Mitchell Simoens @LikelyMitch
    Sencha Inc, Senior Software Engineer
    ________________
    Learn BBCode and use it!

    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.

  11. #10
    Sencha User
    Join Date
    Oct 2011
    Posts
    29
    Answers
    1
    Vote Rating
    0
      0  

    Default

    That one was really help full.

    How can we add a manifest file for application caching in the above given mvc example.
    I tried it but it is showing some errors..!
    can any one help me to understand how this application can be made working when device is offline...

Page 1 of 2 12 LastLast

Posting Permissions

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