With iOS 16 some changes are introduced to the UICollectionView. This breaks the layout of the ListView with dynamically sized items.
when we try to add a dynamic AutomationId in each item of the list (something like AutomationId="{Binding Id}"), the AutomationId is not provided to the elements we see in the appium inspector.
Works with fixed values
When adding swipe content, it block the button to be clicked when the items in the cell matches the swipe offset value,
a. reduce the swipe offset.
b. place the minus button further to the left, so the button width to match the ListView swipe offset
Sample setup:
<telerikDataControls:RadListView x:Name="listView"
IsItemSwipeEnabled="True"
SwipeOffset="90, 0, 0, 0"
SwipeThreshold="20"
ItemsSource="{Binding Source}"
SelectionMode="None">
<telerikDataControls:RadListView.ItemTemplate>
<DataTemplate>
<listView:ListViewTemplateCell>
<listView:ListViewTemplateCell.View>
<Grid ColumnDefinitions="*,90">
<!-- >> changed second row to 90 pixels, which is swipe offset -->
<Label
FontAttributes="Bold"
FontSize="16"
Text="{Binding Sender}"
TextColor="Black" />
<StackLayout Grid.Column="1"
Orientation="Horizontal">
<Button
Clicked="Button_Clicked_1"
Text="+++"
TextColor="Gray" />
<Button
Clicked="Button_Clicked"
Text="---" />
</StackLayout>
</Grid>
</listView:ListViewTemplateCell.View>
</listView:ListViewTemplateCell>
</DataTemplate>
</telerikDataControls:RadListView.ItemTemplate>
<telerikDataControls:RadListView.ItemSwipeContentTemplate>
<DataTemplate>
<Grid
Margin="0"
Padding="0"
ColumnSpacing="0"
RowSpacing="0">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="90" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<telerikInput:RadButton
Grid.Column="0"
Margin="0"
BackgroundColor="Red"
Clicked="RadButton_Clicked"
FontFamily="FontAwesomeSolid"
FontSize="Medium"
Text=""
WidthRequest="90" />
</Grid>
</DataTemplate>
</telerikDataControls:RadListView.ItemSwipeContentTemplate>
</telerikDataControls:RadListView>
is thrown when navigating to another view using ListView SelectedItem and removing the view where the ListView is placed.
Workaround:
Instead of removing the view, change the view visibility.
On Android when adding new item to the ListView which is RadExpander with RadListView inside it, and when removing and adding item with different length the cell is not measured correctly.
On iOS the ListView cell are not automatically sized. one height for cell is used
On UWP when adding the second item the app crashes with "System.ArgumentException: An item with the same key has already been added. Key: SDKBrowser.Examples.ListViewControl.GettingStartedCategory.GettingStartedExample.Product\r\n at System.ThrowHelper.ThrowAddingDuplicateWithKeyArgumentException(Object key)\r\n at System.Collections.Generic.Dictionary`2.TryInsert(TKey key, TValue value, InsertionBehavior behavior)\r\n at Telerik.UI.Xaml.Controls.Data.ListView.Model.BaseLayoutStrategy.RecycleLocally()\r\n at Telerik.UI.Xaml.Controls.Data.ListView.Model.BaseLayout"
When applying multi-level grouping, then change the items group keys, the new groups are added but the old ones are still visible in the list view, and from child group they become parent group.
Workaround:
clear the group descriptors before changing the items and then re-add the group descriptors again
When using a RadListview with a Grid or a Stack Layout in iOS I get the following exception. I haven't tested using the stacklayout outside of the RadListView nor have I tested it outside of the ItemTemplateSelector
Telerik.XamarinForms.Common.NotRegisteredRendererException: There is no renderer registered for the specified type: Xamarin.Forms.Grid
<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:telerikDataControls="clr-namespace:Telerik.XamarinForms.DataControls;assembly=Telerik.XamarinForms.DataControls"
xmlns:telerikListView="clr-namespace:Telerik.XamarinForms.DataControls.ListView;assembly=Telerik.XamarinForms.DataControls"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:d="http://xamarin.com/schemas/2014/forms/design"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:models="clr-namespace:AlertTest.Models"
mc:Ignorable="d"
xmlns:views="clr-namespace:AlertTest.Views"
x:Class="AlertTest.Views.MainPage">
<ContentPage.Resources>
<ResourceDictionary>
<DataTemplate x:Key="NonDivisibleTemplate">
<Grid>
<StackLayout Orientation="Vertical" Padding="10" Spacing="0" BackgroundColor="Yellow" InputTransparent="True" Unfocused="StackLayout_Unfocused">
<Label Text="{Binding ItemText}"/>
</StackLayout>
</DataTemplate>
<DataTemplate x:Key="DivisibleTemplate">
<Grid>
<StackLayout Orientation="Vertical" Padding="15" Spacing="0" BackgroundColor="White" Unfocused="StackLayout_Unfocused">
<Label Text="{Binding ItemText}" FontSize="Large" HorizontalTextAlignment="Center"/>
<Label Text="{Binding ItemText}" FontSize="Small" FontAttributes="Italic" TextColor="Gray"/>
</StackLayout>
</Grid>
</DataTemplate>
<models:MyDataTemplateSelector
x:Key="MyTemplateSelector"
NonDivisibleTemplate="{StaticResource NonDivisibleTemplate}"
DivisibleTemplate="{StaticResource DivisibleTemplate}" />
</ResourceDictionary>
</ContentPage.Resources>
<StackLayout VerticalOptions="StartAndExpand">
<!-- Place new controls here -->
<views:FloatingLabelEntry EntryText="{Binding EntryText}" Margin="20" BackgroundColor="Yellow" PlaceholderText="{Binding PlaceholderText}"/>
<Entry TextChanged="Entry_TextChanged" BackgroundColor="AliceBlue" Margin="20"/>
<telerikDataControls:RadListView x:Name="listView" ItemsSource="{Binding ListItems}" ItemTemplateSelector="{StaticResource MyTemplateSelector}" SelectionMode="Single" IsItemSwipeEnabled="False" >
<!--<telerikDataControls:RadListView.ItemSwipeContentTemplate>
<DataTemplate>
-->
<!--<Grid Margin="0"
Padding="0"
ColumnSpacing="0"
RowSpacing="0">-->
<!--<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>-->
<!--
<StackLayout Orientation="Horizontal" HorizontalOptions="FillAndExpand">
<Label BackgroundColor="#2474d2"
HorizontalTextAlignment="Start"
HorizontalOptions="StartAndExpand"
Text="Mark as read"
TextColor="White"
VerticalTextAlignment="Center" />
<Label Grid.Column="2"
BackgroundColor="Red"
HorizontalTextAlignment="End"
HorizontalOptions="EndAndExpand"
Text="delete"
TextColor="White"
VerticalTextAlignment="Center"/>
</StackLayout>
-->
<!--</Grid>-->
<!--
</DataTemplate>
</telerikDataControls:RadListView.ItemSwipeContentTemplate>-->
</telerikDataControls:RadListView>
</StackLayout>
</ContentPage>
Telerik RadListView with two Columns - they are Thumbnails with a tap gesture. When we change the Spancount to 1 there is no right border line but when set back to 2 it shows as the screenshot on IOS,
The issue happens on iPhone 11, XR, devices with a notch, and when ListViewGridLayout is with SpanCount="2".
Workaround: Set the background color of the ListViewItemStyle to Transparent
<telerikDataControls:RadListView.ItemStyle>
<telerikListView:ListViewItemStyle BorderWidth="0"
BackgroundColor="Transparent"/>
</telerikDataControls:RadListView.ItemStyle>
Hello, could you provide some guidance about the following situation....
I have a scenario using the RadListView that implements a PropertyGroupDescriptor for a property attached to my ObservableCollection<T>, where the property that it is monitoring is string value. The dataset is designed that it may have only one grouping before an item is selected them the dataset will have two different groupings. One the data changes, the ListView updates to show that there are two different groups but the group header doesn't change and neither does the cell content. If I click on the GroupHeader of the new section, then it updates to reflect the change in data. Is there a way to get the data to change in the Listview with some kind of Refresh so it stays up to date with the data.
Seeing it on iOS right now.
Thanks