Pragmatically TileType problem, and Tile Reorder problem.

[Sam]

I'm facing problems with TileList, I want to allow the user to change the tile size at runtime. When you change the tile size (tiletype) pragmatically, in a random manner the tile size and UI got corrupted.

To reproduce the problem:

XAML CODE:

<Window x:Class="MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation"
        Title="MainWindow" Height="625" Width="1300" WindowState="Maximized">
    <Grid>
        <Grid.Resources>
            <Style TargetType="TextBlock" x:Key="TileLabelStyle">
                <Setter Property="FontSize" Value="14" />
                <Setter Property="FontFamily" Value="Segoe UI" />
                <Setter Property="Margin" Value="0" />
                <Setter Property="VerticalAlignment" Value="Top"/>
            </Style>
        </Grid.Resources>
        <Grid.RowDefinitions>
            <RowDefinition Height="35"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>
        <Button Content="All Small" Grid.Row="0" Click="Button_Click" HorizontalAlignment="Left" Width="96" />
        <Button Content="All Double" Grid.Row="0" Margin="101,0,0,0" Click="Button_Click_1" HorizontalAlignment="Left" Width="96" />
        <Button Content="All Quadruple" Grid.Row="0" Margin="202,0,0,0" Click="Button_Click_2" HorizontalAlignment="Left" Width="96" />
        <telerik:RadTileList IsManipulationEnabled="True" TilePlaceHolderSide="150" ScrollViewer.HorizontalScrollBarVisibility="Visible" CanUserSelect="False" x:Name="MainTileList" Grid.Row ="1">
            <telerik:Tile TileType="Single" Background="Bisque">
                <Grid >
                    <TextBlock Text="Single" Style="{StaticResource TileLabelStyle}"/>
                </Grid>
            </telerik:Tile>

            <telerik:Tile TileType="Single">
                <Grid >
                    <TextBlock Text="Single" Style="{StaticResource TileLabelStyle}"/>
                </Grid>
            </telerik:Tile>

            <telerik:Tile TileType="Single">
                <Grid >
                    <TextBlock Text="Single" Style="{StaticResource TileLabelStyle}"/>
                </Grid>
            </telerik:Tile>

            <telerik:Tile TileType="Double"  Background="DarkRed">
                <Grid >
                    <TextBlock Text="Double" Style="{StaticResource TileLabelStyle}"/>
                </Grid>
            </telerik:Tile>

            <telerik:Tile TileType="Double">
                <Grid >
                    <TextBlock Text="Double" Style="{StaticResource TileLabelStyle}"/>
                </Grid>
            </telerik:Tile>

            <telerik:Tile TileType="Quadruple">
                <Grid >
                    <TextBlock Text="Quadruple" Style="{StaticResource TileLabelStyle}"/>
                </Grid>
            </telerik:Tile>

            <telerik:Tile TileType="Double"  Background="Coral">
                <Grid >
                    <TextBlock Text="Double" Style="{StaticResource TileLabelStyle}"/>
                </Grid>
            </telerik:Tile>

            <telerik:Tile TileType="Double">
                <Grid >
                    <TextBlock Text="Double" Style="{StaticResource TileLabelStyle}"/>
                </Grid>
            </telerik:Tile>

            <telerik:Tile TileType="Single">
                <Grid >
                    <TextBlock Text="Single" Style="{StaticResource TileLabelStyle}"/>
                </Grid>
            </telerik:Tile>

            <telerik:Tile TileType="Double"  Background="DeepPink">
                <Grid >
                    <TextBlock Text="Double" Style="{StaticResource TileLabelStyle}"/>
                </Grid>
            </telerik:Tile>

            <telerik:Tile TileType="Double">
                <Grid >
                    <TextBlock Text="Double" Style="{StaticResource TileLabelStyle}"/>
                </Grid>
            </telerik:Tile>

            <telerik:Tile TileType="Single"  Background="DarkViolet">
                <Grid >
                    <TextBlock Text="Single" Style="{StaticResource TileLabelStyle}"/>
                </Grid>
            </telerik:Tile>

            <telerik:Tile TileType="Quadruple" Background="Green">
                <Grid >
                    <TextBlock Text="Quadruple" Style="{StaticResource TileLabelStyle}"/>
                </Grid>
            </telerik:Tile>

            <telerik:Tile TileType="Single"   Background="DarkSalmon">
                <Grid >
                    <TextBlock Text="Single" Style="{StaticResource TileLabelStyle}"/>
                </Grid>
            </telerik:Tile>

            <telerik:Tile TileType="Quadruple"  Background="MidnightBlue">
                <Grid >
                    <TextBlock Text="Quadruple" Style="{StaticResource TileLabelStyle}"/>
                </Grid>
            </telerik:Tile>
        </telerik:RadTileList>
    </Grid>
</Window>

VB Code:

Imports Telerik.Windows.Controls

Class MainWindow

    Private Sub MainWindow_Loaded(sender As Object, e As RoutedEventArgs) Handles Me.Loaded

        Dim MainContextMenu As New ContextMenu

        Dim smallMenuItem As New MenuItem With {.Header = "Small"}
        Dim wideMenuItem As New MenuItem With {.Header = "Wide"}
        Dim largeMenuItem As New MenuItem With {.Header = "Large"}

        MainContextMenu.Items.Add(smallMenuItem)
        MainContextMenu.Items.Add(wideMenuItem)
        MainContextMenu.Items.Add(largeMenuItem)

        AddHandler smallMenuItem.Click, AddressOf SmallSizeClick
        AddHandler wideMenuItem.Click, AddressOf WideSizeClick
        AddHandler largeMenuItem.Click, AddressOf LargeSizeClick

        For Each c As Tile In MainTileList.Items
            c.ContextMenu = MainContextMenu
        Next
    End Sub

    Private Sub SmallSizeClick(sender As Object, e As RoutedEventArgs)
        Dim tile = DirectCast(DirectCast(DirectCast(sender, MenuItem).Parent, ContextMenu).PlacementTarget, Tile)
        tile.TileType = TileType.Single
    End Sub

    Private Sub WideSizeClick(sender As Object, e As RoutedEventArgs)
        Dim tile = DirectCast(DirectCast(DirectCast(sender, MenuItem).Parent, ContextMenu).PlacementTarget, Tile)
        tile.TileType = TileType.Double
    End Sub

    Private Sub LargeSizeClick(sender As Object, e As RoutedEventArgs)
        Dim tile = DirectCast(DirectCast(DirectCast(sender, MenuItem).Parent, ContextMenu).PlacementTarget, Tile)
        tile.TileType = TileType.Quadruple
    End Sub

    Private Sub Button_Click(sender As Object, e As RoutedEventArgs)
        For Each t As Tile In MainTileList.Items
            t.TileType = TileType.Single
        Next
    End Sub

    Private Sub Button_Click_1(sender As Object, e As RoutedEventArgs)
        For Each t As Tile In MainTileList.Items
            t.TileType = TileType.Double
        Next
    End Sub

    Private Sub Button_Click_2(sender As Object, e As RoutedEventArgs)
        For Each t As Tile In MainTileList.Items
            t.TileType = TileType.Quadruple
        Next
    End Sub
End Class

Run the application:

1- Click on "All SMALL" button to set all tile to single
2- Try to reorder some tiles
3- Click on "All Quadruple"

You may notice that some tiles size looks like single while it is Quadruple. (see the attached images)

Also another problem, I'm not able to figure out how the tile reorder is working, sometime I drag drop a tile it does not move, sometime it works! if I drag over another tile sometimes work some time not, Very inconsistent not similar to the windows 8 tiles, I don't think I can use it with production environment. Please advise.

[Sam]

Day 2

[Maya]

Hello Sam,

Thanks for reporting the issue. I logged it in our system and you can track its progress here. 
I also updated your Telerik points.
Considering the reordering, tiles are moved once a certain point on the underlying tile is passed.


Regards,
Maya
Telerik

 

 

[Sam]

I didn't find any solution to solve TileList bugs in WPF or WinForms, TileList for WPF and Panorama for WinForms are not ready for production! contains major issues and can't be used in production system, actually we purchased Telerik for TileList controls or panorama, unfortunately I can't use them in my application.
(Panorama Question: http://www.telerik.com/forums/tile-reposition-and-resizing-(rearrange-needed) )

[Maya]

Hello Sam,

I resolved the issue with RadTileList for WPF and the fix will be available with the internal build coming next Monday. Please give a try then and let me know if you have any feedback on it.  

Regards,
Maya
Telerik