ASPxClientImageSlider.GetItemCount Method
Gets the number of items contained in the control’s item collection.
Declaration
GetItemCount(): number
Returns
| Type |
Description |
| number |
The number of items.
|
The image slider’s client-side functionality allows items to be accessed programmatically. The GetItemCount method is used to determine the number of items which are maintained by the item collection. This method can be used together with the ASPxClientImageSlider.GetItem method when iterating through the item list of the control.
Example
This example demonstrates how to implement custom SlideShow functionality by using the ASPxImageSlider's client-side API.
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using DevExpress.Web.ASPxHiddenField;
namespace E4913 {
public partial class Default : System.Web.UI.Page {
protected void Page_Load(object sender, EventArgs e) {
}
protected void hfCustomIntervals_Init(object sender, EventArgs e) {
ASPxHiddenField hiddenField = sender as ASPxHiddenField;
hiddenField["Cherries"] = 2000;
hiddenField["Raspberry"] = 5000;
hiddenField["Strawberry"] = 1000;
hiddenField["Tomatoes"] = 4000;
}
}
}
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="E4913.Default" %>
<%@ Register Assembly="DevExpress.Web.v13.1, Version=13.1.7.0, Culture=neutral, PublicKeyToken=b88d1754d700e49a"
Namespace="DevExpress.Web.ASPxEditors" TagPrefix="dx" %>
<%@ Register Assembly="DevExpress.Web.v13.1, Version=13.1.7.0, Culture=neutral, PublicKeyToken=b88d1754d700e49a"
Namespace="DevExpress.Web.ASPxHiddenField" TagPrefix="dx" %>
<%@ Register Assembly="DevExpress.Web.v13.1, Version=13.1.7.0, Culture=neutral, PublicKeyToken=b88d1754d700e49a"
Namespace="DevExpress.Web.ASPxImageSlider" TagPrefix="dx" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script type="text/javascript">
var isPlayed = false;
var timer;
function GetTimeout(itemName) {
var defaultTimeout = 1000;
return hiddenField.Contains(itemName) ? hiddenField.Get(itemName) : defaultTimeout;
}
function Play() {
if (!isPlayed) {
var item = imageSlider.GetActiveItem();
timer = setTimeout(function () {
var nextItemIndex = (item.index + 1) % imageSlider.GetItemCount();
imageSlider.SetActiveItemIndex(nextItemIndex);
}, GetTimeout(item.name));
isPlayed = true;
}
}
function Pause() {
if (isPlayed) {
clearTimeout(timer);
isPlayed = false;
}
}
function ItemChanged() {
if (isPlayed) {
clearTimeout(timer);
isPlayed = false;
Play();
}
}
// Handlers
function imageSlider_Init(s, e) {
Play();
}
function imageSlider_ActiveItemChanged(s, e) {
ItemChanged();
}
function btPlay_Click(s, e) {
if (isPlayed) {
Pause();
s.SetText("Play");
}
else {
Play();
s.SetText("Pause");
}
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<dx:ASPxHiddenField ID="hfCustomIntervals" runat="server" ClientInstanceName="hiddenField"
OnInit="hfCustomIntervals_Init">
</dx:ASPxHiddenField>
<dx:ASPxButton ID="btPlay" runat="server" Text="Pause" AutoPostBack="false">
<ClientSideEvents Click="btPlay_Click" />
</dx:ASPxButton>
<dx:ASPxImageSlider ID="imageSlider" runat="server" ClientInstanceName="imageSlider" Width="600px">
<ClientSideEvents Init="imageSlider_Init" ActiveItemChanged="imageSlider_ActiveItemChanged" />
<SettingsImageArea ItemTextVisibility="Always"
NavigationButtonVisibility="None" />
<SettingsNavigationBar Mode="Dots" />
<Items>
<dx:ImageSliderItem ImageUrl="~/Images/cherries.jpg" Name="Cherries" Text="Cherries (Timeout: 2 sec)">
</dx:ImageSliderItem>
<dx:ImageSliderItem ImageUrl="~/Images/raspberry.jpg" Name="Raspberry" Text="Raspberry (Timeout: 5 sec)">
</dx:ImageSliderItem>
<dx:ImageSliderItem ImageUrl="~/Images/strawberry.jpg" Name="Strawberry" Text="Strawberry (Timeout: 1 sec)">
</dx:ImageSliderItem>
<dx:ImageSliderItem ImageUrl="~/Images/tomatoes.jpg" Name="Tomatoes" Text="Tomatoes (Timeout: 4 sec)">
</dx:ImageSliderItem>
</Items>
</dx:ASPxImageSlider>
</div>
</form>
</body>
</html>
Imports Microsoft.VisualBasic
Imports System
Imports System.Collections.Generic
Imports System.Linq
Imports System.Web
Imports System.Web.UI
Imports System.Web.UI.WebControls
Imports DevExpress.Web.ASPxHiddenField
Namespace E4913
Partial Public Class [Default]
Inherits System.Web.UI.Page
Protected Sub Page_Load(ByVal sender As Object, ByVal e As EventArgs)
End Sub
Protected Sub hfCustomIntervals_Init(ByVal sender As Object, ByVal e As EventArgs)
Dim hiddenField As ASPxHiddenField = TryCast(sender, ASPxHiddenField)
hiddenField("Cherries") = 2000
hiddenField("Raspberry") = 5000
hiddenField("Strawberry") = 1000
hiddenField("Tomatoes") = 4000
End Sub
End Class
End Namespace
<%@ Page Language="vb" AutoEventWireup="true" CodeBehind="Default.aspx.vb" Inherits="E4913.Default" %>
<%@ Register Assembly="DevExpress.Web.v13.1, Version=13.1.7.0, Culture=neutral, PublicKeyToken=b88d1754d700e49a"
Namespace="DevExpress.Web.ASPxEditors" TagPrefix="dx" %>
<%@ Register Assembly="DevExpress.Web.v13.1, Version=13.1.7.0, Culture=neutral, PublicKeyToken=b88d1754d700e49a"
Namespace="DevExpress.Web.ASPxHiddenField" TagPrefix="dx" %>
<%@ Register Assembly="DevExpress.Web.v13.1, Version=13.1.7.0, Culture=neutral, PublicKeyToken=b88d1754d700e49a"
Namespace="DevExpress.Web.ASPxImageSlider" TagPrefix="dx" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script type="text/javascript">
var isPlayed = false;
var timer;
function GetTimeout(itemName) {
var defaultTimeout = 1000;
return hiddenField.Contains(itemName) ? hiddenField.Get(itemName) : defaultTimeout;
}
function Play() {
if (!isPlayed) {
var item = imageSlider.GetActiveItem();
timer = setTimeout(function () {
var nextItemIndex = (item.index + 1) % imageSlider.GetItemCount();
imageSlider.SetActiveItemIndex(nextItemIndex);
}, GetTimeout(item.name));
isPlayed = true;
}
}
function Pause() {
if (isPlayed) {
clearTimeout(timer);
isPlayed = false;
}
}
function ItemChanged() {
if (isPlayed) {
clearTimeout(timer);
isPlayed = false;
Play();
}
}
// Handlers
function imageSlider_Init(s, e) {
Play();
}
function imageSlider_ActiveItemChanged(s, e) {
ItemChanged();
}
function btPlay_Click(s, e) {
if (isPlayed) {
Pause();
s.SetText("Play");
}
else {
Play();
s.SetText("Pause");
}
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<dx:ASPxHiddenField ID="hfCustomIntervals" runat="server" ClientInstanceName="hiddenField"
OnInit="hfCustomIntervals_Init">
</dx:ASPxHiddenField>
<dx:ASPxButton ID="btPlay" runat="server" Text="Pause" AutoPostBack="false">
<ClientSideEvents Click="btPlay_Click" />
</dx:ASPxButton>
<dx:ASPxImageSlider ID="imageSlider" runat="server" ClientInstanceName="imageSlider" Width="600px">
<ClientSideEvents Init="imageSlider_Init" ActiveItemChanged="imageSlider_ActiveItemChanged" />
<SettingsImageArea ItemTextVisibility="Always"
NavigationButtonVisibility="None" />
<SettingsNavigationBar Mode="Dots" />
<Items>
<dx:ImageSliderItem ImageUrl="~/Images/cherries.jpg" Name="Cherries" Text="Cherries (Timeout: 2 sec)">
</dx:ImageSliderItem>
<dx:ImageSliderItem ImageUrl="~/Images/raspberry.jpg" Name="Raspberry" Text="Raspberry (Timeout: 5 sec)">
</dx:ImageSliderItem>
<dx:ImageSliderItem ImageUrl="~/Images/strawberry.jpg" Name="Strawberry" Text="Strawberry (Timeout: 1 sec)">
</dx:ImageSliderItem>
<dx:ImageSliderItem ImageUrl="~/Images/tomatoes.jpg" Name="Tomatoes" Text="Tomatoes (Timeout: 4 sec)">
</dx:ImageSliderItem>
</Items>
</dx:ASPxImageSlider>
</div>
</form>
</body>
</html>
See Also