DevExpress Asp.net(5) ASPxCloudControl的基本使用

ASPxCloudControl控件最大的特点就是外观，如图：主要用于导航连接、标签等功能。可使用数据绑定、自定义项等方式展现数据。

其实ASPxCloudPanel的使用非常简单，可以通过数据绑定、自定义等方式来显示数据。
自定义显示:

        CloudControlItem Item1 = new CloudControlItem("Home", 5, "../default.aspx", "default");
        CloudControlItem Item2 = new CloudControlItem("Products", 10, "/products");
        CloudControlItem Item3 = new CloudControlItem("Contacts", 20, "/contacts");
        CloudControlItem Item5 = new CloudControlItem("News", 30, "/news");
        CloudControlItem Item4 = new CloudControlItem("About", 40);
        ASPxCloudControl1.Items.Add(Item1);
        ASPxCloudControl1.Items.Add(Item2);
        ASPxCloudControl1.Items.Add(Item3);
        ASPxCloudControl1.Items.Add(Item4);
        ASPxCloudControl1.Items.Add(Item5);

        ASPxCloudControl1.ItemBeginText = "{";
        ASPxCloudControl1.ItemEndText = "}";
        ASPxCloudControl1.ItemBeginEndTextColor = System.Drawing.Color.Brown;


        ASPxCloudControl1.MaxColor = System.Drawing.Color.Red;
        ASPxCloudControl1.MinColor = System.Drawing.Color.Green;
        ASPxCloudControl1.LinkStyle.HoverColor = System.Drawing.Color.Pink;

数据绑定：

<dxcc:ASPxCloudControl ID="ASPxCloudControl2" runat="server" OnItemDataBound="ASPxCloudControl2_ItemDataBound"
         DataSourceID="AccessDataSource1"     
         NameField="Capital"
         NavigateUrlField="Capital"
         NavigateUrlFormatString="default.aspx?id={0}"       
         TextField="Capital">
        <RankProperties>
            <dxcc:RankProperties></dxcc:RankProperties>
            <dxcc:RankProperties></dxcc:RankProperties>
            <dxcc:RankProperties></dxcc:RankProperties>
            <dxcc:RankProperties></dxcc:RankProperties>
            <dxcc:RankProperties></dxcc:RankProperties>
            <dxcc:RankProperties></dxcc:RankProperties>
            <dxcc:RankProperties></dxcc:RankProperties>
        </RankProperties>
    </dxcc:ASPxCloudControl>

我们还可以通过ItemDataBound事件随机设置每个的大小

 Random random = new Random(10);
    protected void ASPxCloudControl2_ItemDataBound(object source, CloudControlItemEventArgs e)
    {
        e.Item.Value = random.NextDouble() * 10;     //设置大小
    }