I'm using using Extjs 4.0.7 version.
Html editor icon images, grid refresh and paging button images are not displaying.
I checked another working setup, there i found x-tbar-loading class for grid refresh icon
but in the setup i'm using on my system, the above calss is not found. But the css and js files are same as the working setup.
Check to make sure you included the resources shipped with the distribution.
Also there is really no need to hang back to 4.0.7 - lots of issues have been fixed in 4.1.1
I was having the same issue using Ext JS 4.2.1. My application skeleton was created using Sencha CMD. In order to get things working again, I need to rebuild the application using the following commands. It seemed to need both:
sencha app build
sencha app refresh
Not sure of the exact order, but after doing that, I was able to get things working properly.
You need add
Ext.tip.QuickTipManager.init();
Related
I'm creating a gallery of images in ReactJs. There are a lot of examples online, but i didn't find anything that is perfectly responsive on desktop browsers and also completely mobile friendly.
In particular, when an image is opened on the mobile browser, i need to be able to zoom the photo with a double tap, and close the photo when i drag it to the bottom
I already tried all the principal solution that i found online.
For example, i tried all of these https://reactjsexample.com/tag/lightbox/
and much much more.
I also tried different approaches like CSS rules, Viewport rules, create a simple zoomable html div, etc... But nothing worked.
Basically, what i what to achieve is exactly something like this: https://www.lucapetruzzi.com/gallery/1
Created thanks to this library: https://photoswipe.com/ that unfortunately i can't use in React.
(I also tried the react-photoswipe and react-photoswipe-2 libraries but it seems not maintained and not working with new versions of React)
Thank you for any help
So for previous comments, I wrote a snippet for you, check here
Here are the mainly steps:
use npm install photoswipe so DON'T need to include builded js but NEED to include css in index.html (or you can import in App.css)
write the markup in js component
init it by click button or in useEffect
I need my own splash screen when starting up my app.
I use SenCha Touch + Cordova.
Searched and found several ways to do splash screens, however I do not think they are up-to-date.
I saw some code which tried to add a few lines of code into launch function, but the latest Sencha Touch does not do it in the app.js any more instead, it add the Main view to its viewport.
Also, I checked Sencha Touch doc and found
Class currently only works with Cordova and does not have a simulated
HTML counter part. Please see notes on Cordova Docs for proper Native
project code changes that will need to be made to use this plugin.
But it provides some methods after that statement :
newExt.device.Splashscreen( ) : Ext.device.Splashscreen
So I feel confused and don't know which one should I follow.
What is the latest approach to do the splash screen in Sencha Touch?
I currently have the exact same problem as you. Here is information I got from Sencha:
All splashscreen functionality is provided by the Cordova/Phonegap plugin. Our class methods are just convenience methods to the cordova native API and will provide a 'stub' for you if Cordova is not available so that your application does not bomb upon startup (no splashscreen shows, it's just that your app will not crash when trying to access an API that is not there).
In theory, if your application is built with Cordova/Phonegap and your splashscreen images are provided with the application build as specified by Cordova/Phonegap you would initiate a call to Ext.device.Splashscreen.show() after the device is ready (as demonstrated in the example found in http://docs.phonegap.com/en/2.6.0/cordova_splashscreen_splashscreen.md.html#Splashscreen)
The splashscreen feature is a native API, not one that is provided by Touch. You can, should you wish, provide your own coding in your index.html file of your native application which will manually display an image (much the same way we do the initial CSS flashing load indicator), but ultimately that would be up to you to implement manually.
I would suggest that you follow the Cordova guidelines, place your images in the res/drawable directory of your android project and let Cordova do all the hard work for you by just making a single call to Ext.device.Splashscreen.show() when the device is ready and then calling Ext.device.Splashscreen.hide() in the launch area of your application to hide it when your app has rendered its view.
To include Cordova in your application, we now provide you with sencha cmd switches to enable Cordova. You can find more information here
http://docs.sencha.com/touch/2.3.1/#!/guide/cordova
Please note that you will have to download all required components of Cordova, modify the Cordova configuration files as outlined in the Cordova docs, and build the application using either the Cordova command line interface (CLI) or your favourite Android build IDE (Eclipse, IntelliJ, etc).
Use this plugin https://build.phonegap.com/plugins/620
When you use this plugin and build locallym you have to place the icons and splashscreen in the res/ folder manually.
I already have an ExtJS app but now I'm trying to build a mobile version with Sencha Touch. I want the browser to detect if it's running on mobile or not. That works fine, but what is my next step?
I have it redirected to a /mobile folder with a new index.html and that works fine until I try to reach classes from a parent class.
Is it possible to load the mobile app.js instead of the extjs app.js in the primary index.html?
I don't think you will be able to get away with having just one application. Ultimately you would need to create two different apps - one using ExtJs framework, another using Sencha Touch.
Whether you will be able to share some code is a good question. I think you should be able to share models, but that's about it. And even though - I would not recommend doing that either. Because even if show similar information from the same back end in both full and mobile version of your application, you might not need all of it in the mobile application. And if you don't need all of it - your models will be different.
I am new to Ext JS. I am trying to develop with Ext JS 2.3.0. I downloaded the BoxSelect extension from http://www.sencha.com/forum/showthre...acebook-s-one) but it doesn't seem to work on my pc. I also realised that the Ext.app.SearchField class does not work on my pc as well. Does any one have any ideas as to why this is happening?
Thanks.
Try with download of the whole set up so that no need of different js file for different activity in ExtJs. http://www.sencha.com/products/extjs/download/ . Even I am new to all this and i am accessing through apache server. Also check with declaration of same files. Please also see version of JS.
I'm developing a Firefox extension, and need to work with an ExtJS component on a page. Has anyone been able to do this? I've loaded the ExtJS Javascript files in my XUL, but doing something like Ext.getCmp('my-button').disable() has no effect. Do I need to somehow configure the Ext object with the document object? Any other suggestions?
Just a shot in the dark but I know when I wrote Selenium testing a while back I had to use window.Ext.getCmp('my-button'). maybe that will work.