I want to change the position of title to the middle or right side of the screen. I used the following code:
<Shell
x:Class="CostManagement.AppShell"
xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:local="clr-namespace:CostManagement"
Shell.FlyoutBehavior="Disabled"
FlowDirection="RightToLeft">
<ShellContent
Title="Main Page"
ContentTemplate="{DataTemplate local:MainPage}"
Route="MainPage" />
</Shell>
How can I change its position?
This can be customized by setting the Shell.FlyoutContent and use the CollectionView to define the appearance of the menu item like the title as you said. You can refer to the code sample below:
<?xml version="1.0" encoding="UTF-8" ?>
<Shell
x:Class="CostManagement.AppShell"
xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:local="clr-namespace:CostManagement"
FlyoutBackgroundColor="LightGray"
FlyoutBehavior="Flyout"
FlyoutWidth="400"
FlyoutHeight="400">
<Shell.FlyoutContent>
<CollectionView BindingContext="{x:Reference shell}" ItemsSource="{Binding FlyoutItems}" IsGrouped="True">
<CollectionView.ItemTemplate>
<DataTemplate>
<Grid ColumnDefinitions="40,*" Padding="10">
<Image Source="{Binding Icon}"></Image>
<Label Grid.Column="1" Text="{Binding Title}" TextColor="Black"></Label>
</Grid>
</DataTemplate>
</CollectionView.ItemTemplate>
</CollectionView>
</Shell.FlyoutContent>
</Shell>
I have declared some Datatemplates for my Collectionviews Header to use as an Template.
<ResourceDictionary>
<!--#region HeaderTemplates-->
<DataTemplate x:Key="translationHeaderTemplate">
<Frame x:Name="translationDropTarget" Margin="5">
<Label Style="{x:StaticResource boldLabelStyle}" Text="{Binding SolutionDisplay}" FontSize="Medium" HorizontalOptions="Center" HeightRequest="50" VerticalOptions="Center" x:Name="FrameLabel"></Label>
<Frame.GestureRecognizers>
<DropGestureRecognizer AllowDrop="True" DropCommand="{Binding DropOverCommand}">
</DropGestureRecognizer>
</Frame.GestureRecognizers>
</Frame>
</DataTemplate>
<DataTemplate x:Key="pictureHeaderTemplate">
<Frame x:Name="pictureDropTarget" Margin="5">
<Image Source="{Binding SolutionIconString}" HorizontalOptions="FillAndExpand" MinimumWidthRequest="50" HeightRequest="100" VerticalOptions="CenterAndExpand" x:Name="FrameImage"></Image>
<Frame.GestureRecognizers>
<DropGestureRecognizer AllowDrop="True" DropCommand="{Binding DropOverCommand}">
</DropGestureRecognizer>
</Frame.GestureRecognizers>
</Frame>
</DataTemplate>
<DataTemplate x:Key="ttsHeaderTemplate">
<Frame x:Name="ttsDropTarget" Margin="5">
<forms:AnimationView x:Name="XAnim" AutoPlay="true" VerticalOptions="CenterAndExpand" RepeatMode="Infinite" HorizontalOptions="CenterAndExpand" Animation="soundIcon.json"
Clicked="XAnim_Clicked" ></forms:AnimationView>
<Frame.GestureRecognizers>
<DropGestureRecognizer AllowDrop="True" DropCommand="{Binding DropOverCommand}">
</DropGestureRecognizer>
</Frame.GestureRecognizers>
</Frame>
</DataTemplate>
<!--#endregion-->
<DataTemplate x:Key="translationTemplate">
<Frame HasShadow="True" CornerRadius="15" VerticalOptions="Start" HeightRequest="70">
<StackLayout>
<Label
Text="{Binding DisplayString}"
Style="{x:StaticResource mediumlabelStyle}"
VerticalOptions="CenterAndExpand"
HorizontalOptions="Center"
FontSize="Small">
</Label>
</StackLayout>
<Frame.GestureRecognizers>
<DragGestureRecognizer
DragStartingCommand="{Binding Path=BindingContext.DragStartingCommand, Source={x:Reference ViewCollection}}"
DragStartingCommandParameter="{Binding .}"/>
</Frame.GestureRecognizers>
</Frame>
</DataTemplate>
<vokabelmodul:VocabularyViewTemplateSelector
x:Key="vocViewTemplateSelector"
TranslationTemplate="{StaticResource translationHeaderTemplate}"
PictureTemplate="{StaticResource pictureHeaderTemplate}"
TTSTemplate="{StaticResource ttsHeaderTemplate}"/>
</ResourceDictionary>
</ContentPage.Resources>
And I'm trying to consume it within my CollectionView with the templateselector :
<ContentPage.Content>
<AbsoluteLayout>
<StackLayout
AbsoluteLayout.LayoutBounds="0,0,1,1"
AbsoluteLayout.LayoutFlags="All">
<Frame>
<StackLayout>
<Label Style="{x:StaticResource labelStyle}" FontSize="Small" x:Name="TimerLabel" Text="{Binding Remaining}"></Label>
<ProgressBar x:Name="Progress" Progress="{Binding Progress}" ProgressColor="Blue"></ProgressBar>
</StackLayout>
</Frame>
<StackLayout x:Name="InnerStack">
<CollectionView
x:Name="ViewCollection"
ItemsSource="{Binding ViewObjects}"
VerticalOptions="Center"
Margin="5"
ItemTemplate="{StaticResource translationTemplate}"
HeaderTemplate="{StaticResource vocViewTemplateSelector}"
Header="{Binding .}"
>
<CollectionView.EmptyView>
<Label Text="No VocabularyItems!" Style="{x:StaticResource boldLabelStyle}"></Label>
</CollectionView.EmptyView>
<CollectionView.ItemsLayout>
<GridItemsLayout
Orientation="Vertical"
HorizontalItemSpacing="5"
VerticalItemSpacing="5"
Span="2"/>
</CollectionView.ItemsLayout>
</CollectionView>
</StackLayout>
</StackLayout>
</AbsoluteLayout>
</ContentPage.Content>
But when I run the Programm I'm always getting "System.InvalidOperationException: 'LoadTemplate should not be null'".
When I'm binding my HeaderTemplate directly like this:
HeaderTemplate="{StaticResource someHeaderTemplate}"
it works just fine.
I've added a log and breakpoint to my TemplateSelector Class but OnSelectTemplate doesn't even get called.
I've also used another Templateselector for my ItemTemplate and that one worked just fine.
Any Help would be appreciated.
In your xaml page, your DataTemplate tag does not add any data or styles, you need to add styles to each DataTemplate tag.
You have not bound the Header data of the CollectionView. You need to add Header="{Binding ViewObjects}" to your CollectionView tag.
This is my xaml code for your reference, I hope it can solve your problem:
<ContentPage.Resources>
<ResourceDictionary>
<DataTemplate x:Key="someHeaderTemplate">
<Label Text="aaa" BackgroundColor="LightPink"></Label>
</DataTemplate>
<DataTemplate x:Key="someOtherHeaderTemplate">
<Label Text="bbb" BackgroundColor="Green"></Label>
</DataTemplate>
<DataTemplate x:Key="someThirdHeaderTemplate">
<Label Text="ccc" BackgroundColor="Yellow"></Label>
</DataTemplate>
<nameSpace:templateSelector x:Key="templateSelector"
first="{StaticResource someHeaderTemplate}"
second="{StaticResource someOtherHeaderTemplate}"
third="{StaticResource someThirdHeaderTemplate}"/>
</ResourceDictionary>
</ContentPage.Resources>
<StackLayout>
<CollectionView
x:Name="ViewCollection"
Header="{Binding ViewObjects}"
ItemsSource="{Binding ViewObjects}"
VerticalOptions="Center"
Margin="5"
HeaderTemplate="{StaticResource templateSelector}">
<CollectionView.ItemTemplate>
<DataTemplate>
<Label></Label>
</DataTemplate>
</CollectionView.ItemTemplate>
</CollectionView>
</StackLayout>
I need to use a TemplateSelector for the ControlTemplate in TemplatedView. Is there any way to handle ControlTemplateSelector, similar to how DataTemplateSelector is done?
<ContentPage.Resources>
<ResourceDictionary>
<data:MediaTemplateSelector x:Key="headerTemplateSelector"
VideoTemplate="{StaticResource VideoHeaderTemplate}"
ImageTemplate="{StaticResource ImageHeaderTemplate}" />
</ResourceDictionary>
</ContentPage.Resources>
<ContentPage.Content>
<TemplatedView ControlTemplate="{StaticResource headerTemplateSelector}"/>
</ContentPage.Content>
ControlTemplate and DataTemplate works in a different manner.
I started with ControlTemplates trying to do something similar to DataTemplateSelector but defining an item appearance at page level instead at item in a collection like a ListView or CollectionView. So confusing at the beginning because it works totally different... first: forget the concept of DataTempateSelector, has nothing to do with ControlTemplates.
The code i will present has some properties/class names in spanish, hope you understand the idea anyway. First, suppose you have a property on your ViewModel that needs to be presented in a different manner depending on the same or other ViewModel property.
First, define a ContentView class that later you will put as a part of your page (could be a TemplatedView, but, i'm getting an exception when i try to put the templatedView directly on a page, so, i use a ContentView):
<?xml version="1.0" encoding="UTF-8"?>
<ContentView xmlns="http://xamarin.com/schemas/2014/forms"
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"
mc:Ignorable="d"
xmlns:local1="clr-namespace:MrWaiter.Resources;assembly=MrWaiter"
x:Class="MrWaiter.Views.ComandaControlTemplate"
ControlTemplate="{StaticResource ComandaPropia}">
<ContentView.Resources>
<ResourceDictionary>
<ControlTemplate x:Key="ComandaPropia">
<Frame BackgroundColor="{x:StaticResource Key=pLight}" CornerRadius="10" HasShadow="True" HeightRequest="32"
Padding="0" Margin="0">
<StackLayout Orientation="Horizontal" HorizontalOptions="FillAndExpand">
<Label FontSize="Large"
HorizontalOptions="StartAndExpand"
TextColor="White"
Margin="5,0,0,0"
BindingContext="{TemplateBinding BindingContext}"
Text="{TemplateBinding Parent.BindingContext.Comanda.Numero, StringFormat='Comanda {0}'}">
<Label.GestureRecognizers>
<TapGestureRecognizer NumberOfTapsRequired="2"
BindingContext="{TemplateBinding BindingContext}"
Command="{TemplateBinding Parent.BindingContext.MostrarComandasCommand}" >
</TapGestureRecognizer>
</Label.GestureRecognizers>
</Label>
<Button FontFamily="{StaticResource MaterialFontFamily}"
HorizontalOptions="End" x:Name="botonExpandir"
Text="{x:Static local1:IconFont.Play}" BackgroundColor="Transparent"
Rotation="-90" FontSize="32" TextColor="White"
WidthRequest="55"
Margin="0,0,0,0"
Padding="0,0,0,0"
Command="{TemplateBinding MaximizeCommand}"
VerticalOptions="CenterAndExpand"
>
</Button>
</StackLayout>
</Frame>
</ControlTemplate>
<ControlTemplate x:Key="ComandaInvitaA" >
<Frame BackgroundColor="DarkGray" CornerRadius="10" HasShadow="True" HeightRequest="32"
Padding="0" Margin="0">
<StackLayout Orientation="Horizontal" HorizontalOptions="FillAndExpand">
<Label FontSize="Large"
HorizontalOptions="StartAndExpand"
TextColor="White"
Margin="5,0,0,0"
BindingContext="{TemplateBinding BindingContext}"
Text="{TemplateBinding Parent.BindingContext.Comanda.Numero, StringFormat='Comanda {0}'}">
<Label.GestureRecognizers>
<TapGestureRecognizer NumberOfTapsRequired="2"
BindingContext="{TemplateBinding BindingContext}"
Command="{TemplateBinding Parent.BindingContext.MostrarComandasCommand}" >
</TapGestureRecognizer>
</Label.GestureRecognizers>
</Label>
<Button FontFamily="{StaticResource MaterialFontFamily}"
HorizontalOptions="End" x:Name="botonExpandir" x:FieldModifier="Public"
Text="{x:Static local1:IconFont.Play}" BackgroundColor="Transparent"
Rotation="-90" FontSize="32" TextColor="White"
WidthRequest="55"
Margin="0,0,0,0"
Padding="0,0,0,0"
BindingContext="{TemplateBinding BindingContext}"
Command="{TemplateBinding Parent.BindingContext.MaximizeCommand}"
VerticalOptions="CenterAndExpand"
>
</Button>
</StackLayout>
</Frame>
</ControlTemplate>
<ControlTemplate x:Key="ComandaInvitadaPor">
<Frame BackgroundColor="{x:StaticResource Key=sColor}" CornerRadius="10" HasShadow="True" HeightRequest="32"
Padding="0" Margin="0">
<StackLayout Orientation="Horizontal" HorizontalOptions="FillAndExpand">
<Label FontSize="Large"
HorizontalOptions="StartAndExpand"
TextColor="White"
Margin="5,0,0,0"
BindingContext="{TemplateBinding BindingContext}"
Text="{TemplateBinding Parent.BindingContext.Comanda.Numero, StringFormat='Comanda {0}'}">
<Label.GestureRecognizers>
<TapGestureRecognizer NumberOfTapsRequired="2"
BindingContext="{TemplateBinding BindingContext}"
Command="{TemplateBinding Parent.BindingContext.MostrarComandasCommand}" >
</TapGestureRecognizer>
</Label.GestureRecognizers>
</Label>
<Switch IsToggled="{Binding MostrarDetallado}"
IsVisible="False"
OnColor="{StaticResource Key=sLight}"
ThumbColor="{StaticResource Key=sDark}"
></Switch>
<Button FontFamily="{StaticResource MaterialFontFamily}"
HorizontalOptions="End" x:Name="botonExpandir"
Text="{x:Static local1:IconFont.Play}" BackgroundColor="Transparent"
Rotation="-90" FontSize="32" TextColor="White"
WidthRequest="55"
Margin="0,0,0,0"
Padding="0,0,0,0"
Command="{TemplateBinding MaximizeCommand}"
VerticalOptions="CenterAndExpand"
>
</Button>
</StackLayout>
</Frame>
</ControlTemplate>
</ResourceDictionary>
</ContentView.Resources>
</ContentView>
The important stuff is this property of contentView, that defines a kind of ControlTemplate default value:
ControlTemplate="{StaticResource ComandaPropia}"
And pay attention on how the Data Binding is defined inside the ControlTemplates, using TemplatedBindings instead Bindings:
<Label FontSize="Large"
HorizontalOptions="StartAndExpand"
TextColor="White"
Margin="5,0,0,0"
BindingContext="{TemplateBinding BindingContext}"
Text="{TemplateBinding Parent.BindingContext.Comanda.Numero, StringFormat='Comanda {0}'}">
On the ContentView Code Behind you must create a BindableProperty to allow DataBinding between a property on View and a property on ViewModel (maybe it could be done with DataTriggers, but im's learning Xamaring and i want to practice with BindableProperties). That Property, will be responsible to select the ControlTemplate, pay attention to Method HandleTipoComandaPropertyChanged, its where we select the ControlTemplate on propertyChanged:
public partial class ComandaControlTemplate : ContentView
{
public static BindableProperty TipoComandaProperty = BindableProperty.Create(
propertyName: "TipoComanda",
returnType: typeof(Controls.TipoComandaEnum),
declaringType: typeof(ComandaControlTemplate),
defaultValue: Controls.TipoComandaEnum.Propia,
defaultBindingMode: BindingMode.TwoWay,
propertyChanged: HandleTipoComandaPropertyChanged);
private static void HandleTipoComandaPropertyChanged(BindableObject bindable, object oldValue, object newValue)
{
var targetView = (ComandaControlTemplate)bindable;
if (targetView != null)
{
if ((Controls.TipoComandaEnum)newValue != (Controls.TipoComandaEnum)oldValue)
{
if ((Controls.TipoComandaEnum)newValue== Controls.TipoComandaEnum.Propia)
targetView.ControlTemplate =(ControlTemplate)targetView.Resources["ComandaPropia"];
else if ((Controls.TipoComandaEnum)newValue == Controls.TipoComandaEnum.Invitada)
targetView.ControlTemplate = (ControlTemplate)targetView.Resources["ComandaInvitadaPor"];
else if ((Controls.TipoComandaEnum)newValue == Controls.TipoComandaEnum.Invitacion)
}
}
}
public Controls.TipoComandaEnum TipoComanda
{
get
{
return Controls.TipoComandaEnum)base.GetValue(TipoComandaProperty);
}
set
{
base.SetValue(TipoComandaProperty, value);
}
}
public ComandaControlTemplate()
{
InitializeComponent();
}
}
Finally, in your page, place your templated ContentView whenever you need and bind the BindableProperty we created in View to the property on ViewModel that will determine the ControlTemplate presented:
<views:ComandaControlTemplate TipoComanda="{Binding BindingContext.TipoComanda}"></views:ComandaControlTemplate>
Note that TipoComanda is the BindableProperty we created on templatedView, and it as an equivalent property on ViewModel.
Note: that's a general idea on how can we use ControlTemplates, it works, but maybe there are better ways to acomplish.
I'm new to MVVM and xamarin forms. I want to implement custom popup in mvvm and following is my code
My Viewmodel is:
public class PopupVM
{
public ICommand CancelCommand => new Command(async () =>{await
Application.Current.MainPage.Navigation.PopModalAsync();});
}
My Popuppage Xaml:`
<pages:PopupPage.Animation>
<animations:ScaleAnimation DurationIn="400"
DurationOut="300"
EasingIn="SinOut"
EasingOut="SinIn"
HasBackgroundAnimation="True"
PositionIn="Center"
PositionOut="Center"
ScaleIn="1.2"
ScaleOut="0.8" />
</pages:PopupPage.Animation>
<Grid Margin="12"
Padding="24"
BackgroundColor="White"
HorizontalOptions="Center"
VerticalOptions="Center">
<Grid.RowDefinitions>
<RowDefinition Height="*"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"/>
</Grid.ColumnDefinitions>
<StackLayout Orientation="Vertical">
<Picker Grid.Row="0" Grid.Column="0">
<Picker.Items>
<x:String>....</x:String>
</Picker.Items>
</Picker>
<StackLayout Orientation="Vertical" Grid.Column="0" Grid.Row="1">
<StackLayout Orientation="Horizontal" >
<Label Text="A"/>**strong text**
<Picker>
<Picker.Items>
<x:String>Item1</x:String>
<x:String>Item2</x:String>
<x:String>Item3</x:String>
</Picker.Items>
</Picker>
</StackLayout>
<StackLayout Orientation="Horizontal" >
<Label Text="B"/>
<Picker>
<Picker.Items>
<x:String>....</x:String>
</Picker.Items>
</Picker>
</StackLayout>
<StackLayout Orientation="Horizontal" >
<Label Text="C"/>
<Picker>
<Picker.Items>
<x:String>....</x:String>
</Picker.Items>
</Picker>
</StackLayout>
</StackLayout>
<Button Text="Ok"/>
<Button Text="Cancel" x:Name="cnclBtn" />
</StackLayout>
</Grid>
My Popupxaml.cs page is:
public partial class MyPopupPage
{
static PopupVM vm;
public MyPopupPage ()
{
InitializeComponent ();
if (vm==null)
{ vm = new PopupVM(); }
BindingContext = vm;
}
}
I'm not getting where im making mistake. and also i need custom popup not the default display alert
<Button Text="Cancel" x:Name="cnclBtn" Command="{binding CancelCommand}" />
For more info with commands and binding go to this
In Xamarin Forms (Portable) project when I place RadlistView in first page I got binded list which not render template in Android. I not checked other platforms. In this case the RadListView in second page is rendered ok.
First page with RadListView
Second page with RadListView
But if I replace radlistview in first page with Xamarin.Forms.ListView, it showed normal but in the second page RadListView showed without template.
The first page with Xamarin ListView
Second page with RadListView losted template
First page code below :
<?xml version="1.0" encoding="utf-8" ?>
<ContentPage x:Name="Page"
xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:telerikPrimitives="clr-namespace:Telerik.XamarinForms.Primitives;assembly=Telerik.XamarinForms.Primitives"
xmlns:telerikListView="clr-namespace:Telerik.XamarinForms.DataControls.ListView;assembly=Telerik.XamarinForms.DataControls"
xmlns:telerikDataControls="clr-namespace:Telerik.XamarinForms.DataControls;assembly=Telerik.XamarinForms.DataControls"
xmlns:viewmodels="clr-namespace:InRestoApp.ViewModels"
xmlns:behaviors="clr-namespace:InRestoApp.Behaviors"
xmlns:helpers="clr-namespace:InRestoApp.Helpers"
x:Class="InRestoApp.Views.HallsPage">
<ContentPage.Padding>
<OnPlatform x:TypeArguments="Thickness">
<On Platform="iOS" Value="10, 20, 10, 0" />
<On Platform="Android, UWP" Value="10, 0" />
</OnPlatform>
</ContentPage.Padding>
<ContentPage.Resources>
<helpers:InvertBoolConverter x:Key="invertBoolConverter"/>
</ContentPage.Resources>
<Grid HeightRequest="800">
<Grid.RowDefinitions>
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<telerikDataControls:RadListView x:Name="ItemsListView" SelectionMode="Single" HeightRequest="800"
ItemsSource="{Binding Halls}"
ItemTapped="ListView_OnItemTapped">
<telerikDataControls:RadListView.LayoutDefinition>
<telerikListView:ListViewLinearLayout VerticalItemSpacing="0" />
</telerikDataControls:RadListView.LayoutDefinition>
<telerikDataControls:RadListView.ItemTemplate>
<DataTemplate>
<telerikListView:ListViewTemplateCell>
<telerikListView:ListViewTemplateCell.View>
<Frame CornerRadius="5" HasShadow="True" OutlineColor="#4488F6" Padding="10" Margin="10">
<StackLayout Orientation="Horizontal">
<Label Text="{Binding HallCode}" FontSize="Large" VerticalOptions="StartAndExpand" />
<Label Text="{Binding HallName}" FontSize="Medium" VerticalOptions="CenterAndExpand" />
</StackLayout>
</Frame>
</telerikListView:ListViewTemplateCell.View>
</telerikListView:ListViewTemplateCell>
</DataTemplate>
</telerikDataControls:RadListView.ItemTemplate>
</telerikDataControls:RadListView>
</Grid>
</ContentPage>
Second view XAML below (Used ContentView because it is openening as slide drawer)
<?xml version="1.0" encoding="UTF-8"?>
<ContentView xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:flv="clr-namespace:DLToolkit.Forms.Controls;assembly=DLToolkit.Forms.Controls.FlowListView"
xmlns:telerikListView="clr-namespace:Telerik.XamarinForms.DataControls.ListView;assembly=Telerik.XamarinForms.DataControls"
xmlns:helpers="clr-namespace:InRestoApp.Helpers"
xmlns:telerikDataControls="clr-namespace:Telerik.XamarinForms.DataControls;assembly=Telerik.XamarinForms.DataControls"
xmlns:ffimageloading="clr-namespace:FFImageLoading.Forms;assembly=FFImageLoading.Forms"
xmlns:telerikInput="clr-namespace:Telerik.XamarinForms.Input;assembly=Telerik.XamarinForms.Input"
x:Name="productView"
x:Class="InRestoApp.Views.ProductsView">
<ContentView.Resources>
<helpers:ImageBytesConverter x:Key="imageBytesConverter"/>
<helpers:TempConverter x:Key="tempConverter"/>
<helpers:ImageFileToImageSourceConverter x:Key="imageFileToImageSourceConverter"/>
</ContentView.Resources>
<ContentView.Content>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="4*"/>
<ColumnDefinition Width="6*"/>
</Grid.ColumnDefinitions>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="40"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Frame CornerRadius="2" HasShadow="True" OutlineColor="Aquamarine" Padding="10" Margin="2">
<Image x:Name="btnClear" Source="clear_icon.png" HeightRequest="50" WidthRequest="50" >
<Image.GestureRecognizers>
<TapGestureRecognizer Command="{Binding Path=BindingContext.ClearProductsFilterCommand, Source={x:Reference productView}}" CommandParameter="{Binding .}" />
</Image.GestureRecognizers>
</Image>
</Frame>
<telerikDataControls:RadListView x:Name="CategoriesListView" Grid.Row="1" SelectedItem="{Binding SelectedProductCategory, Mode=TwoWay}" SelectionMode="Single"
ItemsSource="{Binding ProductCategories}">
<telerikDataControls:RadListView.LayoutDefinition>
<telerikListView:ListViewLinearLayout VerticalItemSpacing="0" />
</telerikDataControls:RadListView.LayoutDefinition>
<!--<telerikDataControls:RadListView.ItemStyle>
<telerikListView:ListViewItemStyle BackgroundColor="Transparent" BorderLocation="None"/>
</telerikDataControls:RadListView.ItemStyle>-->
<telerikDataControls:RadListView.ItemTemplate>
<DataTemplate>
<telerikListView:ListViewTemplateCell>
<telerikListView:ListViewTemplateCell.View>
<Frame CornerRadius="10" HasShadow="True" OutlineColor="#4488F6" Padding="10" Margin="10" >
<StackLayout Orientation="Horizontal">
<StackLayout>
<ffimageloading:CachedImage HeightRequest="70" Aspect="AspectFill" WidthRequest="70" Margin="5"
DownsampleHeight="70" DownsampleUseDipUnits="false"
LoadingPlaceholder="image_loading.png" ErrorPlaceholder="image_error.png"
Source="{Binding FileName, Converter={StaticResource imageFileToImageSourceConverter}}"/>
<Label Text="{Binding ProductCategoryName}" FontSize="Medium" VerticalOptions="CenterAndExpand" />
</StackLayout>
</StackLayout>
</Frame>
</telerikListView:ListViewTemplateCell.View>
</telerikListView:ListViewTemplateCell>
</DataTemplate>
</telerikDataControls:RadListView.ItemTemplate>
</telerikDataControls:RadListView>
</Grid>
<telerikDataControls:RadListView x:Name="ProductsListView" Grid.Column="1" SelectedItem="{Binding SelectedProduct, Mode=TwoWay}" SelectionMode="Single"
ItemsSource="{Binding Products}">
<telerikDataControls:RadListView.LayoutDefinition>
<telerikListView:ListViewLinearLayout VerticalItemSpacing="0" />
</telerikDataControls:RadListView.LayoutDefinition>
<telerikDataControls:RadListView.ItemTemplate>
<DataTemplate>
<telerikListView:ListViewTemplateCell>
<telerikListView:ListViewTemplateCell.View>
<Frame CornerRadius="10" HasShadow="True" OutlineColor="#4488F6" Margin="5" HeightRequest="110" >
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="70"/>
<RowDefinition Height="20"/>
<RowDefinition Height="20"/>
</Grid.RowDefinitions>
<ffimageloading:CachedImage HeightRequest="70" Aspect="AspectFit" WidthRequest="70" Margin="2"
DownsampleHeight="50" DownsampleUseDipUnits="false"
LoadingPlaceholder="image_loading.png" ErrorPlaceholder="image_error.png"
Source="{Binding FileName, Converter={StaticResource imageFileToImageSourceConverter}}"/>
<Label Text="{Binding RestProductNameEntity.ProductName}" FontSize="Medium" VerticalOptions="CenterAndExpand" Grid.Row="1" />
<telerikInput:RadNumericInput Value="{Binding Quantity, Mode=TwoWay}" Grid.Row="2" HeightRequest="20" />
</Grid>
</Frame>
</telerikListView:ListViewTemplateCell.View>
</telerikListView:ListViewTemplateCell>
</DataTemplate>
</telerikDataControls:RadListView.ItemTemplate>
</telerikDataControls:RadListView>
</Grid>
</ContentView.Content>
</ContentView>
c# file not providing because it used web api from another project, also using dummy source has same effect. As source used
ObservableCollection
I forgot add that before issue I updated Telerik Xamarin platform. After clean solution, deleting bin and obj folders and rebild project it solved.