TileView loses selection on Touch

[Sebastian]

Hi,

 

we are in the process of creating an app meant for touch input using the RadTileView. We have Selection enabled (Mode=Single) and bound the SelectedItem and the MaximizedItem to their corresponding properties. The SelectedItem gets maximized and its template applied. The template contains a text box and a button. The problem occurs when we try to select the textbox or click the button using touch. The SelectedItem gets deselected and is being minimized again, which makes it impossible to enter something into the textbox.

When using the mouse everythings working fine.  

 

Any advice on how to properly deal with touch input?

 

Regards Sebastian 

[Petar Mladenov]

Hello Sebastian,

The single selection mode of the RadTileView acts similar to multiple in other controls - clicking a selected item will deselect it. Also, we use TouchManager.Tap event of the RadTileViewItem to toggle the selection of the item. By default, the MS controls like TextBox and buttons do not handle the Tap event and it is reported to the RadTileViewItem, when you tap them with touch. To prevent these two controls from reporting the Tap event you can either set to them separately (or only to their parent panel/usercontrol) the attached TouchManager.TouchMode property to None.

  <telerik:RadTileView SelectionMode="Single" DisplayMemberPath="Name" x:Name="tileView" Grid.Row="2" IsSelectionEnabled="True" >
            <telerik:RadTileView.ContentTemplate>
                <DataTemplate>
                    <local:UserControl1 />
                </DataTemplate>
            </telerik:RadTileView.ContentTemplate>
        </telerik:RadTileView>

<UserControl x:Class="TileViewTest.UserControl1"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             xmlns:local="clr-namespace:TileViewTest"
             mc:Ignorable="d" 
             xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation"
             d:DesignHeight="300" d:DesignWidth="300" Background="Blue"
             telerik:TouchManager.TouchMode="None">

Here you can find how the TouchMode works:

TouchManager Touch Mode

Regards,
Petar Mladenov
Progress Telerik

[Sebastian]

That did it!

 

Thanks Petar.

 

Regards Sebastian