RadAjaxLoadingPanel概述

这篇帮助文章描述了如何RadAjaxLoadingPanel是，描述如何将其放置在web表单上，以及如何设置时间、透明度和蒙皮等属性。的RadAjaxLoadingPanel控件显示一个加载图标，指示控件正在更新。

RadAjax支持在执行回调请求时作为进度指示器显示的模板，即当页面以静默方式加载时。使用显示进度指示器图形RadAjaxLoadingPanel将改善用户对页面的整体感觉，因为不会有突然的变化和不必要的闪烁。

AjaxLoadingPanel是Telerik UI for ASP。净AJAX，一个具有 120+ 组件的专业级UI库，用于构建现代和功能丰富的 应用程序。想要试用它，可以注册一个30天的免费试用期。

下载免费试用

位置

在设计视图中，您需要拖动web表单RadAjaxLoadingPanel从工具箱到web表单，就像任何控件一样。控件仍在设计视图中时，可以在web窗体上设置其他控件以使用RadAjaxLoadingPanel．的IsSticky的属性RadAjaxLoadingPanel定义面板将出现的位置。默认情况下，当IsSticky是假,RadAjaxLoadingPanel将出现在更新后的控件上。如果你设置IsSticky来真正的，该面板将出现在您在web表单上设置的位置。

如果你有很多控件添加到AjaxSettings并且想要使用IsSticky="true"，那么你需要使用这样的标记为RadAjaxLoadingPanel控件设置绝对位置:

您可以修改RadAjaxLoadingPanel控件显示您自己的内容，就像使用普通模板一样。类的开始和结束标记之间只需添加内容RadAjaxLoadingPanel．示例1显示如何设置an图像和一个标签在RadAjaxLoadingPanel．

示例1:设置标签和一个图像在一个RadAjaxLoadingPanel．

 Loading…   

时机

很多时候AJAX请求执行得非常快，没有足够的时间显示加载面板。当控件更新时，用户可能会看到一个短暂的闪烁，这可能看起来很烦人，可能会使用户感到困惑。对于这些场景RadAjaxLoadingPanel提供两个属性:InitialDelayTime而且MinDisplayTime．

的InitialDelayTime属性指定以毫秒为单位的延迟，在此之后RadAjaxLoadingPanel将显示。如果AJAX请求在此之前返回，则RadAjaxLoadingPanel将不会显示。

使用InitialDelayTime，但是不能解决AJAX请求在初始延迟时间过后不久返回的情况。如果一个页面必须显示加载面板，然后几乎立即必须再次隐藏它，结果是恼人的闪烁。对于这些情况RadAjaxLoadingPanel也有一个MinDisplayTime财产。它指定加载面板将在屏幕上显示的最小时间(以毫秒为单位)。即使请求返回，加载指示器也不会在此期间之前被隐藏。这将确保您的页面界面更加流畅。

的InitialDelayTime而且MinDisplayTime属性只能在加载面板由RadAjaxManager/RadAjaxManagerProxy或RadAjaxPanel控制。当手动显示或隐藏加载面板时，它们无效。方法可以实现相同的功能setTimeout ()而且setInterval ()JavaScript方法。

透明度

默认情况下，加载面板不会“替换”AJAX请求正在更新的控件。相反，它显示在控件的“上方”。的RadAjaxLoadingPanel有一个透明度属性值，应以百分比-值(0-100)设置。的默认值透明度属性为0，这意味着加载面板是绝对可见的。

看到RadAjaxLoadingPanel在线演示，并尝试修改透明度值，以查看加载面板的外观如何变化。

剥皮

RadAjaxLoadingPanel支持蒙皮，您可以通过设置皮肤属性设置为相应皮肤的名称。的默认值皮肤属性为“”(无皮肤)。

如果皮肤属性时，透明度默认从外观应用。但是，您可以通过设置更改此行为EnableSkinTransparency = " false "．

一个BackgroundPosition属性允许您在加载面板中定位加载图像(顶部，TopRight, TopLeft, CenterLeft，中心，CenterRight, Bottom left, Bottom, Bottom right, None)。默认值为“中心”。

你可以找到更多关于RadAjaxLoadingPanel皮在这里．

显式显示和隐藏加载面板

您可以显式调用加载面板的显示而且隐藏方法。这允许您根据某些条件更新控件，并在将被更新的控件上显示加载面板(使用OnRequestStart的客户端事件处理程序来显示面板，隐藏面板OnResponseEnd客户端事件处理程序)。你可以复习一下这个话题更多信息。

模态叠加

RadAjaxLoadingPanel暴露Modal属性，该属性提供了强制面板跨越页面的整个可见区域的功能，从而防止用户单击页面上可能触发postback或AJAX请求的其他元素。

您还可以使用set_modal()方法在客户端设置Modal属性，或者使用get_modal()方法检查它是否启用。

函数pageLoad(app, args) {var loadingPanel = $find('<%= RadAjaxLoadingPanel1. var = $find('<%= RadAjaxLoadingPanel1. var = $ClientID % > ');loadingPanel.set_modal(真正的);｝

另请参阅

• 动画

• 显式显示和隐藏AjaxLoadingPanel

• 演示:AJAX加载面板

• 演示:加载面板模板和透明度