1. #1
    Ext User
    Join Date
    May 2010
    Posts
    12
    Vote Rating
    0
    dcoan is on a distinguished road

      0  

    Default Noob Ext Designer question : building an app with Ext.windows

    Noob Ext Designer question : building an app with Ext.windows


    I'm very new at this...and am using the trial version (wish I had more time with it).

    As part of my testing, I'm trying to create a basic little application.
    For now, I'm just trying to have a full screen panel, with a toolbar. On the toolbar, I want to have some buttons that will open up windows (with grid panels, etc)

    What I have done so far:

    1. created a viewport
    2. dropped a panel into the viewport
    3. dropped a toolbar into the panel....and added a button to the toolbar
    4. dropped a Window container onto the viewport
    5. dropped a grid panel into the Window...with a datastore (set to autoload)
    6. set the Window's hidden property to true

    I've managed to create a handler in the viewport js file, which SHOWS the window when the button (in the panel's toolbar) is clicked.

    And, the window displays data from a datastore (php outputting json)

    Questions:

    If I don't set the window to "hidden" it shows as soon as the viewport is loaded. Even if the window is set to "hidden" the datastore loads its data as soon as the viewport is loaded. I can show and hide the window...but I'm assuming that the data is always in memory, even if I can't see it.
    I'm imagining an app with dozens of windows. I don't want to have all that data in memory all the time...do I?
    How do I create and define windows for my application, within designer...and not have them get created within the browser until I click a button (etc)??

    Is my general concept correct?: Create a viewport as the "main" component of the application, to handle events, etc? Help and examples would be greatly appreciated.

  2. #2
    Sencha - Desktop Packager Dev Team jarrednicholls's Avatar
    Join Date
    Mar 2007
    Location
    Baltimore, MD.
    Posts
    1,745
    Vote Rating
    7
    jarrednicholls will become famous soon enough jarrednicholls will become famous soon enough

      0  

    Default


    Hi dcoan,

    A data store will automatically load its data if its "autoLoad" property is set to true (checked). So any data store, no matter where it's being "used", will manage whether it loads its data immediately or whether it waits for you to manually invoke a load (using the "load" method).

    Your approach sounds fine. I don't typically add a Window inside of anything as they are basically a standalone component. We don't restrict adding Windows to Viewports (although maybe we should), but my approach is that Windows are standalone components that are created on-demand, i.e., inside of a button click handler/action. That way, the Window and its memory/DOM/etc. is not created until it is absolutely necessary. So, my only suggestion would be to move the Window out to be a top-level component in the Designer, just like the Viewport is. It will export with your project as a separate .js file, and you can instantiate and use the custom Window class within your implementation code.

    Hope that makes sense. More examples has been requested before and we're looking into providing more examples. We'll also be integrating the Ext JS API Documentation in with the Designer in the near future, but in the meantime you can always check it out if you have questions on the configuration options or classes.

  3. #3
    Ext User
    Join Date
    May 2010
    Posts
    12
    Vote Rating
    0
    dcoan is on a distinguished road

      0  

    Default


    Thanks for the reply.

    How would I go about moving the window(s) outside of the viewport (to the "root" of the project). This doesn't seem to be possible. Once I have a viewport as my "main" element... everything I drop on the page seems to go "within" the viewport. I've tried moving the Window using the COMPONENTS tree as well... it won't let me drag and drop it outside of the viewport.

    Originally, I had started with a single panel as my main element (instead of the viewport)

    I could then place the windows outside of the Panel (in the root of the project). However, the windows would then get automatically loaded by the xds_index.js file which is marked as:
    * This file will be auto-generated each and everytime you export.
    *
    * Do NOT hand edit this file.
    */

    If there is anyway you could send me an example project file (with all related / exported .html and .js files) that shows an example of :

    1. A main application component (ie panel or viewport), with a toolbar
    2. One or more windows, which can be opened using buttons in the toolbar of the main component

    I would be very happy.

    PS. Could I possibly get an extension on my trail period?

  4. #4
    Sencha - Desktop Packager Dev Team jarrednicholls's Avatar
    Join Date
    Mar 2007
    Location
    Baltimore, MD.
    Posts
    1,745
    Vote Rating
    7
    jarrednicholls will become famous soon enough jarrednicholls will become famous soon enough

      0  

    Default


    Hey dcoan,

    You can drag from the Component Tree on the right-side onto the canvas, just around the edge of the canvas (where the Viewport isn't at) and that will move the component out to be a "root" node. Ditto from the Toolbox. You can also de-select the Viewport by clicking around the edge of the canvas, and double-click a component from the Toolbox to add it as a "root" node.

    At this time, you are spot on regarding Windows and editing the xds_index.js file directly. I would make a copy of xds_index.html and xds_index.js and use those to preview your changes after exports. We're considering this flaw and are thinking of ways to work around it (e.g., mark certain classes as "non-instantiated", and thus aren't created and called with ".show()" in the xds_index.js file).

  5. #5
    Sencha User
    Join Date
    Sep 2009
    Posts
    15
    Vote Rating
    0
    marcusboos is on a distinguished road

      0  

    Default


    Hello i was searching for a good way of implementing many Windows and came up with this solution after some Forum search and trial and error: http://www.sencha.com/forum/showthre...-dynamicly-loa

  6. #6
    Ext User
    Join Date
    Aug 2010
    Posts
    1
    Vote Rating
    0
    kocsisgabor is on a distinguished road

      0  

    Default


    Hi Jarren!

    I am very new in Ext Designer. And I wanted to do you suggested: I have added my Window as a root object. I want to display it when the user clicks a button.
    And I have set its hidden and initHidden to true. But it always shown, because all my root level objects are instantiated. I have checked the generated files, and I see the reason, but I can not fix the problem. The generated xds_index.js file contains this:


    Ext.onReady(function() {
    var cmp1 = new MyViewport({
    renderTo: Ext.getBody()
    });
    cmp1.show();
    var cmp2 = new EditPanel({
    renderTo: Ext.getBody()
    });
    cmp2.show();
    var cmp3 = new HitlistPanel({
    renderTo: Ext.getBody()
    });
    cmp3.show();
    var cmp4 = new GetIdDialog({
    renderTo: Ext.getBody()
    });
    cmp4.show();
    var cmp5 = new MyWindow1({
    renderTo: Ext.getBody()
    });
    cmp5.show();
    });

    So when I start my application, all the dialogs are displayed. How can I switch off this behavior?


    Regards, Gabor

  7. #7
    Sencha - Desktop Packager Dev Team jarrednicholls's Avatar
    Join Date
    Mar 2007
    Location
    Baltimore, MD.
    Posts
    1,745
    Vote Rating
    7
    jarrednicholls will become famous soon enough jarrednicholls will become famous soon enough

      0  

    Default


    Hi Gabor,

    At this time you cannot turn off the auto instantiation, rendering, and showing of any component that is exported by the Designer within the xds_index* files. With that said, the xds_index.js and xds_index.html files are really *not* meant for actual use in a project, but are ways to quickly preview and see your exported components in an actual web browser. You should copy and paste the code to your real project index file(s) and then you can instantiate and use your exported components as you wish.

    Nevertheless, we plan to add configuration options to toggle on and off the generation of this code on a per-component basis - in a near future release.

    I hope that helps! Thanks.

  8. #8
    Ext JS Premium Member
    Join Date
    May 2011
    Posts
    52
    Vote Rating
    1
    h.koch is on a distinguished road

      0  

    Default


    I just read this topic and I'm really interested in this new feature. Is there any new information about it when it will be available?

  9. #9
    Sencha - Architect Dev Team aconran's Avatar
    Join Date
    Mar 2007
    Posts
    8,883
    Vote Rating
    102
    aconran is a splendid one to behold aconran is a splendid one to behold aconran is a splendid one to behold aconran is a splendid one to behold aconran is a splendid one to behold aconran is a splendid one to behold

      0  

    Default


    Quote Originally Posted by h.latzko View Post
    I just read this topic and I'm really interested in this new feature. Is there any new information about it when it will be available?
    Designer 2.0 has morphed this into a feature fit for building full blown applications. Rather than just displaying all visual components which have been created in the designer, you will now be able to mark the specific component you want to use as your entry point to the application.
    Aaron Conran
    @aconran
    Sencha Architect Development Team

  10. #10
    Ext JS Premium Member
    Join Date
    May 2011
    Posts
    52
    Vote Rating
    1
    h.koch is on a distinguished road

      0  

    Default


    Sounds great! Is there any release date planned so far?

Similar Threads

  1. Ext Designer Question
    By imegai in forum Ext Designer: Help & Discussion
    Replies: 2
    Last Post: 12 May 2010, 7:35 AM
  2. [CLOSED] Ext designer - Windows 2000
    By ronbreizh in forum Ext Designer: Bugs
    Replies: 1
    Last Post: 8 Apr 2010, 8:29 AM
  3. [CLOSED] Ext Designer Crashes on Windows XP
    By faycal.inajjarane in forum Ext Designer: Bugs
    Replies: 6
    Last Post: 8 Apr 2010, 3:35 AM
  4. Noob problem - Ultra-wide Ext.Windows in IE7
    By kanthoney in forum Ext 3.x: Help & Discussion
    Replies: 7
    Last Post: 23 Jun 2009, 1:58 PM
  5. Tips from the Trenches: Building a Complex App w/ Ext 2.0 (Plugins, Updates Included)
    By jerrybrown5 in forum Ext 2.x: User Extensions and Plugins
    Replies: 13
    Last Post: 2 Nov 2007, 1:18 PM

Thread Participants: 5

Tags for this Thread

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