diff --git a/examples/替换loading动画.html b/examples/替换loading动画.html
new file mode 100644
index 000000000..9ae3707d4
--- /dev/null
+++ b/examples/替换loading动画.html
@@ -0,0 +1,104 @@
+
+
+
+
+
+
+
+ Document
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/src/base/1.pane.js b/src/base/1.pane.js
index 8df568ead..0a4c93a96 100644
--- a/src/base/1.pane.js
+++ b/src/base/1.pane.js
@@ -40,30 +40,9 @@ BI.Pane = BI.inherit(BI.Widget, {
loading: function () {
var self = this, o = this.options;
- var isIE = BI.isIE();
- var loadingAnimation = BI.createWidget({
- type: "bi.horizontal",
- cls: "bi-loading-widget" + (isIE ? " wave-loading hack" : ""),
- height: this._getSize(60),
- width: this._getSize(60),
- hgap: this._getSize(10),
- vgap: 2.5,
- items: isIE ? [] : [{
- type: "bi.layout",
- cls: "animate-rect rect1",
- height: this._getSize(50),
- width: this._getSize(5)
- }, {
- type: "bi.layout",
- cls: "animate-rect rect2",
- height: this._getSize(50),
- width: this._getSize(5)
- }, {
- type: "bi.layout",
- cls: "animate-rect rect3",
- height: this._getSize(50),
- width: this._getSize(5)
- }]
+ var loadingAnimation = BI.Providers.getProvider("bi.provider.system").getLoading({
+ loadingSize: o.loadingSize,
+ context: this
});
// pane在同步方式下由items决定tipText的显示与否
// loading的异步情况下由loaded后对面板的populate的时机决定
diff --git a/src/core/system.js b/src/core/system.js
index 652a9c256..545057e49 100644
--- a/src/core/system.js
+++ b/src/core/system.js
@@ -19,6 +19,40 @@
TOAST_TOP: 10,
H_GAP_SIZE: "M",
V_GAP_SIZE: "S"
+ },
+ loadingCreator: function(config) {
+ var loadingSize = (config ? config.loadingSize : "small") || "small";
+
+ var isIE = BI.isIE();
+
+ function getSize(v) {
+ return Math.ceil(v / (loadingSize === "small" ? 2 : 1));
+ }
+
+ return {
+ type: "bi.horizontal",
+ cls: "bi-loading-widget" + (isIE ? " wave-loading hack" : ""),
+ height: getSize(60),
+ width: getSize(60),
+ hgap: getSize(10),
+ vgap: 2.5,
+ items: isIE ? [] : [{
+ type: "bi.layout",
+ cls: "animate-rect rect1",
+ height: getSize(50),
+ width: getSize(5)
+ }, {
+ type: "bi.layout",
+ cls: "animate-rect rect2",
+ height: getSize(50),
+ width: getSize(5)
+ }, {
+ type: "bi.layout",
+ cls: "animate-rect rect3",
+ height: getSize(50),
+ width: getSize(5)
+ }]
+ };
}
};
@@ -29,12 +63,11 @@
"L": 24
};
- var provider = function () {
-
+ function provider () {
this.SYSTEM = system;
this.setSize = function (opt) {
- BI.deepExtend(system, {size: opt});
+ BI.deepExtend(system, { size: opt });
};
this.setResponsiveMode = function (mode) {
@@ -60,6 +93,10 @@
BI.extend(system.dependencies, moduleConfig);
};
+ this.setLoadingCreator = function(creator) {
+ system.loadingCreator = creator;
+ };
+
this.$get = function () {
return BI.inherit(BI.OB, {
@@ -88,13 +125,17 @@
getDependencies: function () {
return system.dependencies;
+ },
+
+ getLoading: function(config) {
+ return system.loadingCreator(config);
}
});
};
- };
+ }
BI.provider("bi.provider.system", provider);
-})();
+}());
BI.prepares.push(function () {
BI.SIZE_CONSANTS = BI.Providers.getProvider("bi.provider.system").getSize();