RadTileList using UploadAsync

[Wiliam]

Hello, I'm doing a system using UploadAsync and RadTilesList where images loaded the Upload will be generated in Tiles to be able to track which images the User uploaded, but I am facing a problem, I'm not managing to catch the Tiles after they are generated, the GetAllTiles is coming empty and visual images are there, another question is how to add the new images within the same group of Tiles? The following is a piece of code. Thank you

 

<telerik:RadTileList runat="server" ID="RadTileList1" Width="634px" TileRows="1" EnableDragAndDrop="true" CssClass="CustomSizeTiles"
      ScrollingMode="Auto" AutoPostBack="false" RenderMode="Mobile" >
</telerik:RadTileList>

 

 

Private Sub GeraTileBtn_Click(sender As Object, e As System.EventArgs) Handles GeraTileBtn.Click

        Dim Idx As Integer = 0
        Dim Fator As Double
        Dim Largura As Short
        Dim Altura As Short
        Dim g As System.Drawing.Image
        Dim tileGroup As New TileGroup

        'If RadTileList1.Groups.Count = 0 Then
        RadTileList1.Groups.Add(tileGroup)
        'End If
        'ImageTile
        Dim dirs As String() = Directory.GetFiles(Server.MapPath("~\" & Session("cache" & HiddenID.Value.ToString)) & "\Upload", "*.JPG")
        Dim dir As String
        For Each dir In dirs
            g = System.Drawing.Image.FromFile(dir)

            ' Calcula o melhor fator
            Fator = 100 / g.Height
            Largura = Int(g.Width * Fator)
            Altura = Int(g.Height * Fator)
            If Largura > 100 Then
                Fator = 100 / Largura
                Largura = Int(Largura * Fator)
                Altura = Int(Altura * Fator)
            End If

            g.GetThumbnailImage(Largura, Altura, Nothing, Nothing).Save(dir & "_Thumbs.JPG", System.Drawing.Imaging.ImageFormat.Jpeg)


            'RadTileList1.Groups(0).Tiles
            Dim ImageTile As New RadImageTile
            ImageTile.ImageUrl = "~\cache\" & dir.Substring(Server.MapPath("").Length) & "_Thumbs.JPG"
            'ImageTile.Title.Text = "Docpro"
            ImageTile.Shape = TileShape.Square
            tileGroup.Tiles.Add(ImageTile)
            Idx += 1
        Next
    End Sub
  
      Protected Sub CopiaImgBtn_Click(sender As Object, e As EventArgs) Handles CopiaImgBtn.Click
        Count += 1
        For Each Group As TileGroup In RadTileList1.Groups
            For Each tile As RadBaseTile In Group.GetAllTiles()
               'Code image imports 
            Next
        Next
        ' For i = 0 To RadTileList1.Groups(0).Tiles.Count
        ' ImportaImagens(DirectCast(e.File.InputStream, System.IO.FileStream).Name, 0)
        ' Next

    End Sub

 

 

 

[Marin Bratanov]

Hello William,

I advise you start by examining the following article on creating tiles programmatically: http://docs.telerik.com/devtools/aspnet-ajax/controls/tilelist/server-side-programming/programmatic-creation. The important bit is that you should use the Page_Init event for creating tiles.

What I suggest you look into is building a data source (e.g., a List of custom objects, a data table, whatever fits your needs) and data bind the tile list to it, because this will let you easily control the group a tile belongs to: http://docs.telerik.com/devtools/aspnet-ajax/controls/tilelist/data-binding/defining-structure.

Regards,

Marin Bratanov
Telerik by Progress

[Wiliam]

Hello, so I would get the ImageUrl of ImageTile who are within the RadTileList will be that this would be possible? Thank you

[Marin Bratanov]

Hi Wiliam,

Yes, you can get the ImageUrl of a RadImageTile:

protected void RadTileList1_TileClick(object sender, TileListEventArgs e)
{
    foreach (RadBaseTile tile in RadTileList1.GetAllTiles())
    {
        RadImageTile theImageTile = tile as RadImageTile;
        if (theImageTile != null)
        {
            Response.Write(theImageTile.ImageUrl + "<br />");
        }
    }
}

<telerik:RadTileList runat="server" ID="RadTileList1" OnTileClick="RadTileList1_TileClick" AutoPostBack="true">
    <Groups>
        <telerik:TileGroup>
            <telerik:RadTextTile runat="server" ID="rtt1" Text="text tile"></telerik:RadTextTile>
            <telerik:RadImageTile runat="server" ID="rit1" ImageUrl="~/my-images/Tile_Account.png"></telerik:RadImageTile>
        </telerik:TileGroup>
        <telerik:TileGroup>
            <telerik:RadImageTile runat="server" ID="rit2" ImageUrl="~/my-images/Tile_Flows.png"></telerik:RadImageTile>
        </telerik:TileGroup>
    </Groups>
</telerik:RadTileList>

Regards,

Marin Bratanov
Telerik by Progress

[Wiliam]

Thank you for your attention and for explanations, other doubts arise, which way to take the DisplayIndex through javascript or the code behind?

 

Regards,

Wiliam Bonetti

Developer Company Docpro

[Marin Bratanov]

Hi Wiliam,

You can find the full client-side API of the control in the documentation, and you can start with the following articles and their siblings:

• http://docs.telerik.com/devtools/aspnet-ajax/controls/tilelist/client-side-programming/tilelist-object
• http://docs.telerik.com/devtools/aspnet-ajax/controls/tilelist/tiles/client-side-programming/basetile-object
• http://docs.telerik.com/devtools/aspnet-ajax/controls/tilelist/tiles/server-side-programming/tile-object
• http://docs.telerik.com/devtools/aspnet-ajax/controls/tilelist/server-side-programming/tilelist-object

RadTileList does not have a property DisplayIndex, either on the client-side, or on the server-side.

Regards,

Marin Bratanov
Telerik by Progress

[Wiliam]

there is a javascript in order to sweep the TileList and take the number of tiles to be able to get their name? Thank you

[Marin Bratanov]

Hi William,

As listed in the articles above, you can do this:

• on the client: call the get_allTiles() method of the tile list, loop through the array and use the get_name() method of each tile
• on the server: call the GetAllTiles() method of the tile list, loop through the List and use the Name property of each tile.

Regards,

Marin Bratanov
Telerik by Progress