loading icon: emoji/URL customization control

Signed-off-by: 林晨 (Leo Cheng) <leo-cheng@vip.qq.com>

Author: Lfan-ke

docs/index.html

@@ -281,7 +281,7 @@ <h1 style="display:none">KuiklyLoadingView</h1>
               </div>
               <!-- Overlay -->
               <div id="loading-overlay" style="display:none;position:absolute;inset:0;background:rgba(0,0,0,.5);display:none;flex-direction:column;align-items:center;justify-content:center;gap:12px;z-index:10">
-                <div class="spinner"></div>
+                <div id="loading-icon-el" class="spinner"></div>
                 <span id="loading-text" style="color:#fff;font-size:13px">加载中...</span>
               </div>
             </div>
@@ -694,6 +694,8 @@ <h1 style="display:none">KuiklyLoadingView</h1>
     ctrl.innerHTML = ctrlHeader('Loading','全屏/局部加载遮罩') +
       ctrlGroup('显示状态', `<label class="ctrl-toggle"><input type="checkbox" id="ld-show" checked onchange="toggleLoading(this.checked)"> 显示遮罩</label>`) +
       ctrlGroup('提示文字', `<input type="text" id="ld-txt" value="加载中..." oninput="updateLoadingText(this.value)">`) +
+      ctrlGroup('图标类型', ctrlBtns('ld-it',['旋转','Emoji','URL'],'旋转','setLoadingIconType')) +
+      ctrlGroup('图标内容', `<input type="text" id="ld-icon-val" placeholder="emoji 如 🚀 / 图片 URL" style="display:none" oninput="updateLoadingIcon()">`) +
       ctrlGroup('遮罩透明度', `<input type="range" min="0.2" max="0.9" step="0.05" value="0.5" id="ld-opacity" oninput="updateLoadingOpacity(this.value)">`) +
       `<hr class="ctrl-divider">` + codeBlock(dsl(`Loading {
   attr {
@@ -1026,6 +1028,38 @@ <h1 style="display:none">KuiklyLoadingView</h1>
   const o = document.getElementById('loading-overlay');
   o.style.background = `rgba(0,0,0,${v})`;
 }
+let _ldIconType = '旋转';
+function setLoadingIconType(v, el) {
+  _ldIconType = v;
+  document.querySelectorAll('[onclick^="setLoadingIconType"]').forEach(b => b.classList.remove('active'));
+  el.classList.add('active');
+  const inp = document.getElementById('ld-icon-val');
+  if (inp) {
+    inp.style.display = v === '旋转' ? 'none' : '';
+    inp.placeholder = v === 'Emoji' ? 'emoji，如 🚀 ⏳ 🔄' : '图片 URL';
+  }
+  updateLoadingIcon();
+}
+function updateLoadingIcon() {
+  const el = document.getElementById('loading-icon-el');
+  if (!el) return;
+  const val = (document.getElementById('ld-icon-val')?.value || '').trim();
+  if (_ldIconType === '旋转') {
+    el.className = 'spinner'; el.textContent = ''; el.style.cssText = '';
+  } else if (_ldIconType === 'Emoji') {
+    el.className = ''; el.textContent = val || '⏳';
+    el.style.cssText = 'font-size:42px;line-height:1;filter:drop-shadow(0 2px 4px rgba(0,0,0,.3))';
+  } else {
+    el.className = ''; el.textContent = '';
+    el.style.cssText = 'width:52px;height:52px';
+    if (val) {
+      const img = document.createElement('img');
+      img.src = val; img.style.cssText = 'width:52px;height:52px;object-fit:contain;border-radius:8px';
+      img.onerror = () => { img.style.display = 'none'; };
+      el.innerHTML = ''; el.appendChild(img);
+    }
+  }
+}
 
 // ─── Toast ────────────────────────────────────────────────────────────────────
 let toastIconSel='无', toastPosSel='中间';