javascript sencha touch2 中的负载掩码
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/11189135/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
loadmask in sencha touch2
提问by Ramesh Lamani
I want apply load-mask in view page. while launching the application, some view pages are taking time to load data later it will display, so if its taking time to load in that time i want show load-mask to users with some messages like "loading....". from some sample i have applied load-mask, but it is shows that message every time whenever i hit that page. this is bad way because here setting time. i need apply load-mask like this if don't have data it should show the load-mask to the user, until page getting the data. please any one help me. how to achieve this one
我想在视图页面中应用加载掩码。在启动应用程序时，一些视图页面需要时间来加载稍后会显示的数据，所以如果在那个时间加载需要时间，我想向用户显示加载掩码，并显示一些诸如“正在加载....”之类的消息。从一些示例中，我应用了加载掩码，但每次点击该页面时都会显示该消息。这是不好的方式，因为这里设置时间。如果没有数据，我需要像这样应用加载掩码，它应该向用户显示加载掩码，直到页面获取数据。请任何人帮助我。如何实现这一目标
My code is here:at controller level i am taking the id of load-mask and setting the property as shown below code
我的代码在这里：在控制器级别，我采用加载掩码的 id 并设置属性，如下代码所示
onCompanyPageLoad: function () {
var loader = Ext.getCmp('mask');
loader.setMessage("Loading...");
loader.setIndicator(true);
loader.setTransparent(false);
loader.show();
setTimeout(function () {
loader.hide();
}, 1000);
}
回答by Thiem Nguyen
The answer of user978790is formal way to show and hide a loading mask in Sencha Touch 2.
user978790的答案是在 Sencha Touch 2 中显示和隐藏加载掩码的正式方式。
If you can't make it work, it's very likely that you're doing something like:
如果你不能让它工作，很可能你正在做这样的事情：
Ext.Viewport.setMasked({xtype:'loadmask',message:'your custom loadmask'});
... then do something here
Ext.Viewport.setMasked(false);
Note that Javascript is asynchronous, so it does NOT make sure that the code lines are run in above order. Then there is a possibily that Sencha Touch initializes your loading mask and destroys it right then. In order to use loading mask correctly:
请注意，Javascript 是异步的，因此它不能确保代码行按上述顺序运行。然后 Sencha Touch 可能会初始化您的加载掩码并立即销毁它。为了正确使用加载掩码：
- Initialize a loading mask as above.
- Put the
Ext.Viewport.setMasked(false);in specialfunctions which are ensured to be launched after loading mask initialization, eg. event handler, or success function of your JSONP/AJAX request.
- 如上所述初始化加载掩码。
- 把
Ext.Viewport.setMasked(false);在特殊的被装保障面具初始化后，例如即将推出的功能。事件处理程序，或 JSONP/AJAX 请求的成功函数。
回答by Rickert
I do it the following way:
我这样做：
Ext.Viewport.setMasked({xtype:'loadmask',message:'your custom loadmask'});
Then you can use
然后你可以使用
Ext.Viewport.setMasked(false);
To stop showing a loading mask This also works on components if you only want to show a mask on part of a view
停止显示加载遮罩 如果您只想在视图的一部分上显示遮罩，这也适用于组件
回答by Arpit Srivastava
Just remove all this.I have nice idea how to use loader.First on main page html just add loader
只需删除所有这些。我有很好的想法如何使用加载器。首先在主页 html 上添加加载器
<div id="loader"></div>//add id#loader with background loading image
after your page loads just add on contoller Ext.get('loader').destroy();//when you page full load then it will load your loading div
在您的页面加载后，只需添加控制器Ext.get('loader').destroy();// 当您页面完全加载时，它将加载您的加载 div
