Results 1 to 8 of 8

Thread: How to create & use custom components in Sencha Architect?

  1. #1
    Sencha Premium User
    Join Date
    Sep 2011
    Location
    Tamworth, NSW, Australia
    Posts
    1,353
    Answers
    13

    Question How to create & use custom components in Sencha Architect?

    I have a system that I developed five years ago (recently upgraded to Ext JS 6.0.2) which has a fairly complex form with related combo boxes and grids on it, much of which now needs to be shown in another system. Rather than re-creating that form in the other system, I would like (if at all possible) to separate it from both and turn it into a reusable component.

    Are there any guides for doing this, especially with Sencha Architect?

    Thanks.

    PS, I've just come across this, which looks like it might be promising. I don't imagine it'll be a walk in the park, however.

  2. #2
    Sencha Premium User
    Join Date
    Sep 2011
    Location
    Tamworth, NSW, Australia
    Posts
    1,353
    Answers
    13

    Default

    I think it'll be quicker to just recreate the components in the other app than try to create a user extension. I'll kick this can down the road and try again another day when I have the time to piece together the various bits of documentation.

    A decent example of how to create an AUX in Sencha Architect 3.5 for Ext JS 6 would be fantastic. I need to either stop recreating things all over the place and use extensions or find a framework+IDE that lets me easily share stuff between projects.

    Sencha Architect has helped me to create some great apps but I feel that Sencha doesn't really think that we should be using it for anything other than some basic stuff. I feel like the unwanted stepchild whenever I want to do something outside the box or try to do things more efficiently within this "IDE". I wish Sencha ate its own dog food and treated Architect as a first-class citizen.

  3. #3
    Sencha User
    Join Date
    Sep 2014
    Location
    Central Europe
    Posts
    795
    Answers
    103

    Default

    What about the functionality "save to toolbox", I think that could help you? When you right click on your view. Save to toolbox. Than in a new project, you can use that view from the toolbox again.

    Although it has to be same framework version. (not Ext 5 -> Ext 6).

    Regards
    Petr

  4. #4
    Sencha Premium User
    Join Date
    Sep 2011
    Location
    Tamworth, NSW, Australia
    Posts
    1,353
    Answers
    13

    Default

    Quote Originally Posted by petr.vecera View Post
    What about the functionality "save to toolbox", I think that could help you? When you right click on your view. Save to toolbox. Than in a new project, you can use that view from the toolbox again.
    Luckily these two systems are using Ext JS 6.0.2, so I guess this will have to do for now. But it would be nice if there was a better way to share common components between different projects (which are not in the same workspace). Even if they're not actually shared - live - between two projects, being able to create a user extension in Architect and install/use that elsewhere in a well defined manner would be nice.

  5. #5

    Join Date
    Nov 2012
    Location
    Cheshire
    Posts
    45
    Answers
    2

    Default

    I tend to create a package for the component, added this to app.json & require under Ext.application and then use the createAlias to override.
    I have tried to use the Architect extension code in the package but I struggled to get it to go. I may have missed something in the documentation.
    The GUI in Architect then displays a rough cut version (using base components) and on the server/preview the actual component is displayed, which is enough for me.

  6. #6
    Sencha Premium User
    Join Date
    Sep 2011
    Location
    Tamworth, NSW, Australia
    Posts
    1,353
    Answers
    13

    Default

    If I get the time one day I'll try writing a component, Richard, but I can't see me getting the time to figure out all the pieces and come up with something that's best practise, or indeed even works. Sencha really need to write a good guide for using Architect more effectively, IMHO.

  7. #7

    Join Date
    Nov 2012
    Location
    Cheshire
    Posts
    45
    Answers
    2

    Default

    I have a couple of components on my GitHub which you can use for a reference example.
    • create a new workspace for your package. Don't do this in your application workspace.
    • create package using cmd.
    • move your Class.js to the SRC directory,
    • update the package.json namespace to what the namespace of your class is.
    • Build using the cmd package build from the package directory.
    • Then the .pkg file if there is not any errors will be placed in the workspace build directory. I lost hours on that one.
    • Install the pkg file to your application workspace using the package add cmd
    • Add the package name to your app.json
    • run app refresh.
    I do agree that Architect has a long way to go before external components are quickly and easily integrated. Before 3.5 came out I thought it was dead, but from reading various Sencha QA posts, it does finally seem like they are working through the issues. It crashes less for a start.

    As for a good guide I agree, there should be a example of I have this "component" or theme etc and a step by step with good descriptions on each step so you can learn what each piece/command does.

    let me know if you do try and build your own component, and if you get stuck I'll help where I can. As I've seen a fair few of errors myself.

  8. #8
    Sencha Premium User
    Join Date
    Sep 2011
    Location
    Tamworth, NSW, Australia
    Posts
    1,353
    Answers
    13

    Cool

    Thanks for that run-down. I'm definitely going to give this a shot in my next project. First I just need to see the current one off into the world :-)

Similar Threads

  1. Create Custom Widget using Sencha Architect
    By PradeepGS in forum Sencha Architect 3.x: Q&A
    Replies: 1
    Last Post: 30 Aug 2015, 4:10 AM
  2. How to create custom components?
    By johannes.klauss in forum Sencha Touch 2.x: Q&A
    Replies: 1
    Last Post: 20 Dec 2013, 7:13 AM
  3. Secha Architect Restricting Addition of Custom Events on Certain Components
    By shikharm in forum Sencha Architect 2.x: Help & Discussions
    Replies: 0
    Last Post: 12 Jun 2012, 7:12 AM
  4. patterns to create reusable custom components
    By [email protected] in forum Ext 2.x: Help & Discussion
    Replies: 1
    Last Post: 12 Sep 2008, 1:15 AM

Tags for this Thread

Posting Permissions

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