I would like to bind my list view with string variable and image in my classe.
Here is my Xalm code :
<ListView x:Name="ListViewWordDescriptionOnline"
HasUnevenRows="True"
VerticalOptions="Fill">
<ListView.ItemTemplate >
<DataTemplate>
<ViewCell IsEnabled="False" >
<ViewCell.View>
<Label Text="{Binding .}" TextColor="#7D7D7D" FontSize="14" Grid.Column="0"/>
<Label Text="BIND WITH VARIABLE BingStringValue IN PUBLIC CLASS" />
<Image Source=" BIND WITH IMAGE BingImageValue IN PUBLIC CLASS" />
</Grid>
</ViewCell.View>
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
Here is my C# code :
public partial class MainPage : ContentPage
{
public MainPage()
{
List<string> animals= new List<string> { "bird", "dog" };
ListViewWordDescriptionOnline.ItemsSource=animals;
string BingStringValue ="This is type 1"
var BingImageValue= ImageSource.FromResource("MyImages.WordsPage.AddWords.png");
}
}
Thanks for your help
You alse could define a Name to the root contentpage,then use Binding Path to bind the BingStringValue and BingImageValue.
the page.xaml.cs:
public partial class MainPage : ContentPage
{
public string BingStringValue { get; set; }
public ImageSource BingImageValue { get; set; }
public MainPage()
{
InitializeComponent();
List<string> animals = new List<string> { "bird", "dog" };
ListViewWordDescriptionOnline.ItemsSource = animals;
BingStringValue = "This is type 1";
BingImageValue = ImageSource.FromResource("NewerForms.fivePlus.png");
BindingContext = this;
}
}
then in the xaml:
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="NewerForms.Page3"
x:Name="root"
>
<ContentPage.Content>
<StackLayout>
<ListView x:Name="ListViewWordDescriptionOnline" HasUnevenRows="True" VerticalOptions="Fill">
<ListView.ItemTemplate >
<DataTemplate>
<ViewCell>
<ViewCell.View>
<Grid>
<Label Text="{Binding .}" TextColor="#7D7D7D" FontSize="14" Grid.Column="0"/>
<Label Text="{Binding Source={x:Reference root},
Path=BingStringValue}" />
<Image Source="{Binding Source={x:Reference root},
Path=BingImageValue}" />
</Grid>
</ViewCell.View>
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
</StackLayout>
</ContentPage.Content>
</ContentPage>
Related
I am using ToolKits Expander and I am trying to bind a command, this is what I got so far:
public partial class AssignTaskPage : ContentPage
{
public AssignTaskPage()
{
InitializeComponent();
GetMathSubCatgories = new Command(() => MathSubCatgoriesCommand());
}
public ICommand GetMathSubCatgories { get; private set; }
void MathSubCatgoriesCommand()
{
Console.Write("Here");
}
}
And in my view
<xct:Expander Command="{Binding GetMathSubCatgories}">
<xct:Expander.Header>
<Frame Padding="10" Margin="10" HasShadow="False" BorderColor="LightGray" VerticalOptions="CenterAndExpand">
<StackLayout Orientation="Horizontal">
<Image Source="{Binding icon}" WidthRequest="25" HeightRequest="25"></Image>
<Label Text="{Binding name}" TextColor="{Binding textColor}" FontSize="Large" FontAttributes="Bold" HeightRequest="35" VerticalOptions="CenterAndExpand"></Label>
</StackLayout>
</Frame>
</xct:Expander.Header>
<Grid Padding="10">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" />
</Grid.ColumnDefinitions>
<ListView x:Name="SubCategories" ItemsSource="{Binding subCategories}" ItemSelected="SubCategories_ItemSelected">
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell>
<StackLayout>
<Label Text="{Binding name}" TextColor="#02cc9d" FontAttributes="Bold" HeightRequest="35" VerticalOptions="CenterAndExpand"></Label>
</StackLayout>
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
</Grid>
</xct:Expander>
This does not work at all, (I put a break point on Console.Write("Here"); and its not hitting it)
So I did some digging and found this tutorial:
https://www.syncfusion.com/kb/12154/how-to-bind-command-to-expander-in-itemtemplate-of-xamarin-forms-listview-sflistview
and here is the sample in git.
https://github.com/SyncfusionExamples/command-to-expander-in-itemtemplate-listview-xamarin
I understand what I have to do here, the problem I am facing is when this Command is called, I was looking to get a value and use it in my AssignTaskPage, but what the tutorial is saying to have a ViewModel which is in a separate file. So should I setup a MessagingCenter in my AssignTaskPage and call it in the ViewModel to get the value I want and pass it to AssignTaskPage?
Because your command isn't defined in the ViewModel that you're binding to.You could bind the command which is defined in your AssignTaskPage,and then bind the viewmodel for the parent element of the expander.
For example :
public partial class AssignTaskPage : ContentPage
{
public AssignTaskPage()
{
InitializeComponent();
GetMathSubCatgories = new Command(() => MathSubCatgoriesCommand());
BindingContext = this;
}
public ICommand GetMathSubCatgories { get; private set; }
void MathSubCatgoriesCommand(object obj)
{
DisplayAlert("Alert!", "" + (obj as Contact).ContactName + "expanded", "Ok");
}
}
the xaml (here use the xaml codes of the above sample),the grid bind the viewmodel,and your expander bind the command of the root (your page):
<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:local="clr-namespace:ExpanderXamarin"
x:Class="ExpanderXamarin.ExpandableListView"
x:Name="root"
xmlns:sflistview="clr-namespace:Syncfusion.ListView.XForms;assembly=Syncfusion.SfListView.XForms"
xmlns:expander="clr-namespace:Syncfusion.XForms.Expander;assembly=Syncfusion.Expander.XForms">
<ContentPage.Content>
<Grid x:Name="mainGrid" BackgroundColor="#F0F0F0" Padding="4">
<Grid.BindingContext>
<local:ViewModel />
</Grid.BindingContext>
<sflistview:SfListView x:Name="listView" AutoFitMode="DynamicHeight" ItemsSource="{Binding ContactsInfo}">
<sflistview:SfListView.ItemTemplate>
<DataTemplate>
<Frame x:Name="frame" CornerRadius="2" Padding="{OnPlatform Android=1, iOS=1, UWP=0}" Margin="{OnPlatform Android=1, iOS=1, UWP=0}" OutlineColor="White" HasShadow="{OnPlatform Android=true, iOS=false, UWP=true}">
<Grid Padding="{OnPlatform Android=2, iOS=2, UWP=0}" Margin="{OnPlatform Android=1, iOS=1, UWP=0}" BackgroundColor="White" >
<expander:SfExpander x:Name="expander" HeaderIconPosition="None">
<expander:SfExpander.Behaviors>
<local:EventToCommandBehavior Command="{Binding Path=BindingContext.GetMathSubCatgories, Source={x:Reference root}}" EventName="Expanding" CommandParameter="{Binding .}"/>
</expander:SfExpander.Behaviors>
<expander:SfExpander.Header>
...
</expander:SfExpander.Header>
<expander:SfExpander.Content>
..
</expander:SfExpander.Content>
</expander:SfExpander>
</Grid>
</Frame>
</DataTemplate>
</sflistview:SfListView.ItemTemplate>
</sflistview:SfListView>
</Grid>
</ContentPage.Content>
</ContentPage>
if you want get the parameters you could bind the CommandParameter like above.
I have a CollectionView with a few items in it. I'm trying to adjust the size of the CollectionView to be just big enough to fit all of its children. Right now, it's much larger than the amount of children it has.
The Blue color represents the size of the CollectionView. As you can see, it's well beyond the size of it's children. I'd like it to fit them perfectly, or at the very least be closer to the same size.
I don't have any height requests on any of the elements on the page, including the CollectionView.
Here's my code. It's not particularly pretty at the moment, but it's a work in progress.
<StackLayout>
<CollectionView x:Name="assessmentsCollectionView"
BackgroundColor="Blue">
<CollectionView.ItemTemplate>
<DataTemplate>
<StackLayout Spacing="10"
Padding="5">
<Frame CornerRadius="5"
Padding="0"
HorizontalOptions="FillAndExpand"
VerticalOptions="FillAndExpand">
<StackLayout Orientation="Horizontal">
<Frame Padding="5"
CornerRadius="0"
WidthRequest="50">
<Label Text="{Binding TypeLetter}"
TextColor="#37474f"
FontSize="24"
VerticalTextAlignment="Center"
HorizontalTextAlignment="Center"/>
</Frame>
<StackLayout Padding="10">
<Label Text="{Binding Name}"
TextColor="Black"
FontSize="24"/>
<StackLayout Orientation="Horizontal">
<Image Source="calendarIcon.png"
WidthRequest="12"
HeightRequest="12"/>
<Label Text="{Binding Date}"
FontSize="12"
TextColor="Gray"/>
</StackLayout>
</StackLayout>
</StackLayout>
</Frame>
</StackLayout>
</DataTemplate>
</CollectionView.ItemTemplate>
</CollectionView>
</StackLayout>
I changed CollectionView to FlexLayout with BindableLayout.ItemsSource and BindableLayout.ItemTemplate
What was previously
<CollectionView.ItemTemplate>
<DataTemplate>
...
</DataTemplate>
</CollectionView.ItemTemplate>
</CollectionView>
What was done
<FlexLayout Direction="Column"
x:Name="MessagesList"
AutomationId="MessagesList"
BindableLayout.ItemsSource="{Binding Messages}" >
<BindableLayout.ItemTemplate>
<DataTemplate>
...
</DataTemplate>
</BindableLayout.ItemTemplate>
</FlexLayout>
For me works well, no need to set Height for item or FlexLayout, all are dynamic
If you have little rows in Collectionview, you can set a value to collectionView.HeightRequest. when item increase, the height will increase as well.
I create a property called.RowHeigth. If I add item in the CollectionView(with AddCommand), RowHeigth will increase.
<StackLayout>
<CollectionView
x:Name="assessmentsCollectionView"
BackgroundColor="Blue"
HeightRequest="{Binding rowHeigth}"
ItemsSource="{Binding letters}">
<CollectionView.ItemTemplate>
<DataTemplate>
<StackLayout Padding="5" Spacing="10">
<Frame
Padding="0"
CornerRadius="5"
HorizontalOptions="FillAndExpand"
VerticalOptions="FillAndExpand">
<StackLayout Orientation="Horizontal">
<Frame
Padding="5"
CornerRadius="0"
WidthRequest="50">
<Label
FontSize="24"
HorizontalTextAlignment="Center"
Text="{Binding TypeLetter}"
TextColor="#37474f"
VerticalTextAlignment="Center" />
</Frame>
<StackLayout Padding="10">
<Label
FontSize="24"
Text="{Binding Name}"
TextColor="Black" />
<StackLayout Orientation="Horizontal">
<Image
HeightRequest="12"
Source="c1.png"
WidthRequest="12" />
<Label
FontSize="12"
Text="{Binding Date}"
TextColor="Gray" />
</StackLayout>
</StackLayout>
</StackLayout>
</Frame>
</StackLayout>
</DataTemplate>
</CollectionView.ItemTemplate>
</CollectionView>
<Button
x:Name="btn1"
Command="{Binding AddCommand}"
Text="btn1" />
</StackLayout>
public partial class Page4 : ContentPage
{
public Page4()
{
InitializeComponent();
this.BindingContext = new letterviewmodel(); ;
}
}
public class letterviewmodel: INotifyPropertyChanged
{
public ObservableCollection<lettermodel> letters { get; set; }
private int _rowHeigth;
public int rowHeigth
{
get { return _rowHeigth; }
set
{
_rowHeigth = value;
RaisePropertyChanged("rowHeigth");
}
}
public ICommand AddCommand { protected set; get; }
public letterviewmodel()
{
letters = new ObservableCollection<lettermodel>()
{
new lettermodel(){TypeLetter="A",Name="letter 1",Date="2021-01-01"},
new lettermodel(){TypeLetter="B",Name="letter 2",Date="2021-01-01"},
new lettermodel(){TypeLetter="C",Name="letter 3",Date="2021-01-01"}
};
rowHeigth = letters.Count * 100 ;
AddCommand = new Command<lettermodel>(async (key) => {
letters.Add(new lettermodel() { TypeLetter = "D", Name = "test letter ", Date = "2021-01-01" });
rowHeigth = letters.Count * 100 ;
});
}
public event PropertyChangedEventHandler PropertyChanged;
public void RaisePropertyChanged(string propertyName)
{
PropertyChangedEventHandler handler = PropertyChanged;
if (handler != null)
{
handler(this, new PropertyChangedEventArgs(propertyName));
}
}
}
public class lettermodel
{
public string TypeLetter { get; set; }
public string Name { get; set; }
public string Date { get; set; }
}
Don't forget toimplement INotifyPropertyChanged interface, to inotify data update.
i need your help i'm trying to make the following UI in xamarin forms.i want the Upload button or image at the end of list . i tried to use collection view with grid item layout .i'm able to show images like this but i can't add upload image at the end like the following . i tried to put upload image/button in the footer of collection view but it appears in bottom of the list not in next to last image . So is there any body who can help me or guide me to achieve this?
Sample UI
<CollectionView x:Name="imgcollection" Margin="5"
BackgroundColor="Transparent" MinimumHeightRequest="15" HeightRequest="150"
ItemsSource="{Binding ItemImages}"
>
<CollectionView.ItemsLayout>
<GridItemsLayout Orientation="Vertical"
Span="{OnIdiom Tablet='6',Phone='4'}" HorizontalItemSpacing="1"
VerticalItemSpacing="2" >
</GridItemsLayout>
</CollectionView.ItemsLayout>
<CollectionView.EmptyView>
<StackLayout >
<Image Source="picturemessage_2.png" Aspect="AspectFill"
HeightRequest="150" WidthRequest="150" HorizontalOptions="Start">
</Image>
</StackLayout>
</CollectionView.EmptyView>
<CollectionView.ItemTemplate>
<DataTemplate>
<ContentView Padding="5" Margin="30" HeightRequest="100" WidthRequest="150">
<AbsoluteLayout HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand">
<Image x:Name="imgview" Source="{Binding .}" HorizontalOptions="FillAndExpand"
VerticalOptions="FillAndExpand" Aspect="AspectFill"
AbsoluteLayout.LayoutBounds="0,0,1,1"
AbsoluteLayout.LayoutFlags="All"/>
<Image Source="moreoptionbtn.png" Aspect="AspectFill" IsVisible="{OnIdiom Tablet='True',Phone='False'}"
AbsoluteLayout.LayoutBounds="1,0.1,30,30"
AbsoluteLayout.LayoutFlags="PositionProportional"/>
</AbsoluteLayout>
</ContentView>
</DataTemplate>
</CollectionView.ItemTemplate>
</CollectionView>
C#
private List<ImageSource> itemImages;
public List<ImageSource> ItemImages
{
get { return itemImages; }
set { itemImages = value;
OnPropertyChanged("ItemImages");
}
}
public ImageSource defultImage { get; set; } = "picturemessage_2.png";
public bool Isadd { get; set; } = false;
//
void somefunction()
{
DetailPageViewModel.ItemImages.Add(picture);
DetailPageViewModel.ItemImages.OrderByDescending(s=>s);
var i = DetailPageViewModel.Isadd;
if (!i)
{
DetailPageViewModel.ItemImages.Add(defultImage);
DetailPageViewModel..Isadd = true;
}
}
output
According to your description, you want to click the Collectionview Item image to add image, but making the Upload image always stay on the last item, am I right?
If yes, I do one sample that you can take a look:
<CollectionView ItemsSource="{Binding ItemImages}" SelectionMode="Single">
<CollectionView.ItemsLayout>
<GridItemsLayout Orientation="Vertical" Span="4" />
</CollectionView.ItemsLayout>
<CollectionView.EmptyView>
<StackLayout>
<Image
Aspect="AspectFill"
HeightRequest="150"
Source="image3.png"
WidthRequest="150" />
</StackLayout>
</CollectionView.EmptyView>
<CollectionView.ItemTemplate>
<DataTemplate>
<StackLayout>
<Image Margin="5" Source="{Binding .}">
<Image.GestureRecognizers>
<TapGestureRecognizer Tapped="TapGestureRecognizer_Tapped" />
</Image.GestureRecognizers>
</Image>
</StackLayout>
</DataTemplate>
</CollectionView.ItemTemplate>
</CollectionView>
Adding GestureRecognizers for Image control, then detecting if the last item image is clicked.
public partial class Page6 : ContentPage
{
public ObservableCollection<ImageSource> ItemImages { get; set; }
public Page6()
{
InitializeComponent();
ItemImages = new ObservableCollection<ImageSource>()
{
"a5.jpg","a6.jpg","a7.jpg","a8.jpg","a9.jpg","upload2.jpg"
};
this.BindingContext = this;
}
private void TapGestureRecognizer_Tapped(object sender, EventArgs e)
{
Image image = (Image)sender;
if (getimagesource(image.Source)!=null && getimagesource(image.Source) == "upload2.jpg")
{
int count = ItemImages.Count;
ItemImages.Insert(count - 1, "a11.jpg");
}
}
private string getimagesource(ImageSource img)
{
string path;
if (img is Xamarin.Forms.FileImageSource)
{
Xamarin.Forms.FileImageSource objFileImageSource = (Xamarin.Forms.FileImageSource)img;
//
// Access the file that was specified:-
path = objFileImageSource.File;
return path;
}
return null;
}
}
The screenshot:
You can make use of DataTemplateSelector and map the last item to upload image or button
public class MyTemplateSelector : DataTemplateSelector
{
public DataTemplate DefaultTemplate { get; set; }
public DataTemplate UploadTemplate { get; set; }
protected override DataTemplate OnSelectTemplate(object item, BindableObject container)
{
var currentItem = ((BindingItemType)item);
var template = currentItem.Equals((container as CollectionView).ItemsSource.Cast<BindingItemType>().LastOrDefault()) ? DefaultTemplate : UploadTemplate;
return template;
}
}
<ContentPage.Resources>
<DataTemplate x:Name="default">
<ContentView Padding="5" Margin="30" HeightRequest="100" WidthRequest="150">
<AbsoluteLayout HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand">
<Image x:Name="imgview" Source="{Binding .}" HorizontalOptions="FillAndExpand"
VerticalOptions="FillAndExpand" Aspect="AspectFill"
AbsoluteLayout.LayoutBounds="0,0,1,1"
AbsoluteLayout.LayoutFlags="All"/>
<Image Source="moreoptionbtn.png" Aspect="AspectFill" IsVisible="{OnIdiom Tablet='True',Phone='False'}"
AbsoluteLayout.LayoutBounds="1,0.1,30,30"
AbsoluteLayout.LayoutFlags="PositionProportional"/>
</AbsoluteLayout>
</ContentView>
</DataTemplate>
<DataTemplate x:Name="uploadtemplate" >
<Button Text="Upload" Clicked="UploadClicked"/>
</DataTemplate>
<local:MyTemplateSelector DefaultTemplate="{StaticResource default}"
UploadTemplate="{StaticResource uploadtemplate}"
x:Name="templateselector" />
</ContentPage.Resources>
<CollectionView ItemsSource="{Binding ItemImages}" SelectionMode="Single" ItemTemplate="{StaticResource templateselector}">
<CollectionView.ItemsLayout>
<GridItemsLayout Orientation="Vertical" Span="4" />
</CollectionView.ItemsLayout>
<CollectionView.EmptyView>
<StackLayout>
<Image
Aspect="AspectFill"
HeightRequest="150"
Source="image3.png"
WidthRequest="150" />
</StackLayout>
</CollectionView.EmptyView>
</CollectionView>
private void UploadClicked(object sender, EventArgs args)
{
//handle image upload and update the ItemsSource count.
}
So, I have trouble binding data to my MasterDetailView. I'm getting no errors, and my code seems to be correct, based on sources that I have found online. However, nothing populates my MasterDetailView..
<MasterDetailPage.Master>
<ContentPage Title="Menu" BackgroundColor="#9BD2AD" x:Name="test">
<StackLayout Orientation="Vertical">
<Label Text="MENU" TextColor="#106073" HorizontalOptions="Center" FontAttributes="Bold" Margin="0,20,0,0" FontSize="Large"/>
<ListView ItemsSource="{Binding listOfItems}" x:Name="navigationDrawerList" RowHeight="55" SeparatorVisibility="None"> <!--ItemSelected="NavigationDrawerList_ItemSelected"-->
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell>
<StackLayout VerticalOptions="FillAndExpand" Orientation="Vertical" Padding="20,10,0,0">
<Label Text="{Binding Title}" TextColor="#106073" HorizontalTextAlignment="Start" FontSize="Medium"/>
<BoxView WidthRequest="2" HeightRequest="1" BackgroundColor="Beige"/>
</StackLayout>
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
</StackLayout>
</ContentPage>
</MasterDetailPage.Master>
Cs
private List<MasterPageItem> listOfItems = new List<MasterPageItem>();
MasterPageItem pages = new MasterPageItem();
public SlideMenu()
{
InitializeComponent();
test.BindingContext = getPages();
}
public List<MasterPageItem> getPages()
{
listOfItems.Add(new MasterPageItem("TEST1", typeof(Test1)));
listOfItems.Add(new MasterPageItem("TEST2", typeof(Test2)));
return listOfItems;
}
MasterPageItem class
public class MasterPageItem
{
public string Title { get; set; }
public Type TargetType { get; set; }
public MasterPageItem()
{
}
public MasterPageItem(string Title, Type TargetType)
{
this.Title = Title;
this.TargetType = TargetType;
}
}
i'm trying to bind a command to a button inside a listView, but without success. I follow all other answers posted here, like this one:
Xamarin Forms Button Command binding inside a ListView
The actual result is that nothing happens. A thing that i notice is that visual studio, when i type after x:Reference suggests me just GridWebcam, like if it doesn't see other reference elements. What can i do?
Here my code:
<ContentPage
...
x:Name="WebcamList">
<ContentPage.Resources>
...
<ContentPage.Content>
<ListView ItemsSource="{Binding ListOfWebcam}"
SeparatorVisibility="None"
CachingStrategy="RecycleElement"
RowHeight="250"
VerticalOptions="FillAndExpand"
x:Name="ListWebcam">
<ListView.Header>
<StackLayout x:Name="HeaderStackLayout"
Padding="5,25,0,30"
Orientation="Horizontal"
HorizontalOptions="FillAndExpand">
<Label x:Name="LabelHeader"
Text="Webcam:"
FontSize="Large"
FontAttributes="Bold"
TextColor="{x:Static statics:Palette.PrimaryColor}"
VerticalOptions="Center"
HorizontalOptions="Start" Margin="10,0,0,0"/>
</StackLayout>
</ListView.Header>
<ListView.ItemTemplate>
<DataTemplate>
<controls:ExtendedViewCell IsEnabled="False">
<controls:ExtendedViewCell.View>
<Grid x:Name="GridWebcam">
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<Frame Grid.Column="1"
Grid.RowSpan="2"
CornerRadius="20"
BackgroundColor="{x:Static statics:Palette.PrimaryColor}"
VerticalOptions="FillAndExpand"
HorizontalOptions="FillAndExpand"
HasShadow="True"
Margin="5,10">
<StackLayout>
<Label Text="{Binding t_str_vid,Converter={StaticResource WebcamNameConverter}}"
FontSize="Medium"
TextColor="White"
FontAttributes="Bold"
HorizontalOptions="FillAndExpand"
VerticalOptions="FillAndExpand">
</Label>
<Label TextColor="White"
FontSize="Medium"
Text="{Binding direzione,Converter={StaticResource DirectionToStringConverter}}"/>
<StackLayout Orientation="Horizontal">
<ffimageloading:CachedImage LoadingPlaceholder="Rolling.gif"
DownsampleToViewSize="False"
VerticalOptions="FillAndExpand"
HorizontalOptions="StartAndExpand"
Source="{Binding image1}"/>
<iconize:IconButton Text="fas-play-circle"
FontSize="50"
HorizontalOptions="EndAndExpand"
VerticalOptions="EndAndExpand"
TextColor="White"
Command="{Binding BindingContext.OpenVideoWebcamCommand, Source={x:Reference WebcamList}}"
CommandParameter="{Binding .}"
BackgroundColor="Transparent"/>
</StackLayout>
</StackLayout>
</Frame>
</Grid>
</controls:ExtendedViewCell.View>
</controls:ExtendedViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
</ContentPage.Content>
</ContentPage>
```
public class WebcamListViewModel : BaseViewModel
{
public ICommand OpenVideoWebcamCommand { set; get; }
private List<Webcam> _ListOfWebcam { get; set; }
public List<Webcam> ListOfWebcam
{
get { return _ListOfWebcam; }
set
{
_ListOfWebcam = value;
OnPropertyChanged();
}
}
private Task DownloadFramesTask;
CancellationTokenSource tokenSourceDownloadFrames = new CancellationTokenSource();
CancellationToken cancellationTokenDownloadFrames;
public WebcamListViewModel(INavigationService navigationService, IApiAutostradeManagerFactory apiAutostradeManagerFactory) : base(navigationService,apiAutostradeManagerFactory)
{
OpenVideoWebcamCommand = new Command<Webcam>(async (webcam) => {
await navigationService.NavigateAsync(Locator.WebcamVideoPopUpPage);
Messenger.Default.Send(new InfoWebcamVideoMessage(webcam.c_mpr, webcam.c_uuid, webcam.t_str_vid));
});
}
Well it could be related to this mysterious controls:ExtendedViewCell of yours :)
Also did you disable the ListView selection: <ListView ... SelectionMode="None" /> ?
As Roubachof said that I don't know if it is related to controls:ExtendedViewCell,please check if you have binding BindingContext, then you can take a look the following code:
<StackLayout>
<ListView x:Name="listview1" ItemsSource="{Binding persons}">
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell>
<StackLayout Orientation="Horizontal">
<Label Text="{Binding Id}" />
<Label Text="{Binding name}" />
<Button
Command="{Binding BindingContext.command, Source={x:Reference listview1}}"
CommandParameter="{Binding Id}"
Text="Delete item" />
</StackLayout>
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
</StackLayout>
public partial class Page1 : ContentPage
{
public ObservableCollection<person> persons { get; set; }
public RelayCommand1 command { get; set; }
public Page1 ()
{
InitializeComponent ();
persons = new ObservableCollection<person>();
for(int i =0;i<20;i++)
{
person p = new person()
{
Id = i,
name = "cherry" + i
};
persons.Add(p);
command = new RelayCommand1(obj => method1((int)obj));
}
this.BindingContext = this;
}
public void method1(int Id)
{
persons.RemoveAt(Id);
//IEnumerable<person> list = persons.Where(x => x.Id == Id);
//foreach (person m in list)
//{
//}
}
}
public class person
{
public int Id { get; set; }
public string name { get; set; }
}