Results 1 to 7 of 7

Thread: Dynamically Changing Theme

  1. #1
    Sencha User
    Join Date
    Dec 2016
    Posts
    2

    Default Answered: Dynamically Changing Theme

    Hey guys,
    I would like to switch between themes during runtime. I have made my custom theme using ExtJS theming methods and it is working. (I can manually put the name of my theme under app.json/builds/classic/theme)

    I tried many things but I cloud not find do it. I also tried to it like in the kitchen sink but I didn't work either. Anyone cloud help me, please?

    Thanks for the ones who are gonna help

  2. An Ext JS theme is a Cmd package, it lives outside of the application and when a Cmd build occurs, Cmd builds everything together. For that, each theme is a different package so you'd have to define multiple builds in your app.json to specify which theme for each build to use; this is what KitchenSink does. Then to switch themes, you'd define which theme in the url param so that Ext JS' microloader can load the correct build. This also means to switch themes you would have to reload the page. To have it happen at runtime, you would have to skip what Ext JS prescribes and handle this yourself by sandboxing your themes by adding a CSS class to the <body> and your CSS would then be under that top level class.

  3. #2
    Sencha Premium User mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    40,379
    Answers
    3997

    Default

    An Ext JS theme is a Cmd package, it lives outside of the application and when a Cmd build occurs, Cmd builds everything together. For that, each theme is a different package so you'd have to define multiple builds in your app.json to specify which theme for each build to use; this is what KitchenSink does. Then to switch themes, you'd define which theme in the url param so that Ext JS' microloader can load the correct build. This also means to switch themes you would have to reload the page. To have it happen at runtime, you would have to skip what Ext JS prescribes and handle this yourself by sandboxing your themes by adding a CSS class to the <body> and your CSS would then be under that top level class.
    Mitchell Simoens @LikelyMitch

    Check out my GitHub:
    https://github.com/mitchellsimoens

    Posts are my own, not any current, past or future employer's.

  4. #3
    Sencha User
    Join Date
    Dec 2016
    Posts
    2

    Default

    SS1.jpg

    Finally i went one step further but now i am getting even stranger error. Can you check and give me an idea about what is this about? Thanks for your time. Have a good day.

  5. #4
    Sencha Premium Member volkans80's Avatar
    Join Date
    Mar 2012
    Location
    Ankara, Turkey
    Posts
    92
    Answers
    2

    Default

    Hi Mitchell,

    I want to ask a question related to your answer. Can i add multiple theme for single build?

    Thanks,

  6. #5
    Sencha Premium User mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    40,379
    Answers
    3997

    Default

    Quote Originally Posted by cnktrms View Post
    Finally i went one step further but now i am getting even stranger error. Can you check and give me an idea about what is this about? Thanks for your time. Have a good day.
    That seems like a class is being required that isn't recognized. You'd have to look at the stack and try to trace down what is requiring it.
    Mitchell Simoens @LikelyMitch

    Check out my GitHub:
    https://github.com/mitchellsimoens

    Posts are my own, not any current, past or future employer's.

  7. #6
    Sencha Premium User mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    40,379
    Answers
    3997

    Default

    Quote Originally Posted by volkans80 View Post
    Hi Mitchell,

    I want to ask a question related to your answer. Can i add multiple theme for single build?

    Thanks,
    No, one theme per build.
    Mitchell Simoens @LikelyMitch

    Check out my GitHub:
    https://github.com/mitchellsimoens

    Posts are my own, not any current, past or future employer's.

  8. #7

    Default

    Hi Mitchell,

    Lets say we have a dozen of themes as a separated packages
    Can we:
    1. Build the application with one of the themes;
    2. Build the other theme packages with the Cmd command "sencha package build";
    3. Include all the build theme packages in the used:[ ] array in the app.json file;
    4. Use the package-loader to dynamically load another theme (with all its resources) (just like you load code packages), and finally reload the app with the new theme ?

    Is that posible ?

Similar Threads

  1. Replies: 2
    Last Post: 30 Jun 2014, 6:51 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
  •