I'm currently attempting to implement a Xamarin.Forms application which will be targeting Android TV. I have simplified my application to show the specific issue I'm having.
I have a collection of items which which I am displaying via a CollectionView. I am able to scroll around items inside this CollectionView using the D-Pad controls absolutely fine, as can be seen via this screenshot, where the "focussed"/"selected" item is visible if I make the layout bounds visible.
There is nothing available except the "ItemSelected" event on the CollectionView which only occurs on actually pressing enter. I have tried to add in "Focus" events to all the elements that make up this page and nothing gets triggered. I am unsure what exactly is being "focussed" upon here.
This is my page:
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:viewmodels="clr-namespace:Channels.ViewModels"
x:Class="Channels.MainPage"
x:DataType="viewmodels:ChannelViewModel"
BackgroundColor="{DynamicResource BackgroundColour}">
<StackLayout Orientation="Vertical" Padding="10">
<Label Text="Selected Item" TextColor="White" Margin="0, 0, 10, 10"></Label>
<CollectionView ItemsSource="{Binding Data}">
<CollectionView.ItemsLayout>
<LinearItemsLayout ItemSpacing="5"></LinearItemsLayout>
</CollectionView.ItemsLayout>
<CollectionView.ItemTemplate>
<DataTemplate>
<StackLayout Padding="5" Spacing="5" BackgroundColor="Red">
<Label Text="Test Text" HorizontalTextAlignment="Center" HorizontalOptions="FillAndExpand" TextColor="White"></Label>
</StackLayout>
</DataTemplate>
</CollectionView.ItemTemplate>
</CollectionView>
</StackLayout>
</ContentPage>
I would like to know exactly what is getting focus here and if it is possible to do something like I have stated.
I haven't found many examples of Xamarin being used in terms of Android TV so it might not be possible to do things like this. I have also tried implementing the same code in .NET Maui and cannot find any events that might work here.
You could use the GestureRecognizers in the template to triger what you want to do when you selected the item or click on the item.
<Label>
<Label.GestureRecognizers>
<TapGestureRecognizer Tapped="TapGestureRecognizer_Tapped"/>
</Label.GestureRecognizers>
</Label>
Related
I'm relatively new to Xamarin Forms. I'm trying to have a view that allows me to swipe left/right between different pages with a page indicator at the bottom. I'm using CarouselView, as suggested by the internet, and it seems to work. But, the selected page is very buggy. Sometimes, swiping to the next page causes it to snap back to the previous page. Sometimes, it stays on the current page. Sometimes, it works correctly. I observe the same behavior on both Android and UWP. Although, it appears to be a little worse in UWP than Android.
It seems the index for the current page is getting mixed up somehow. Here is my XAML:
<ContentPage.Content>
<StackLayout>
<CarouselView x:Name="Pages" IndicatorView="{x:Reference ActivePageIndicator}">
<CarouselView.ItemsSource>
<x:Array Type="{x:Type ContentView}">
<views:TroubleshootingPage />
<views:StatusPage />
<views:ContactInfoPage />
</x:Array>
</CarouselView.ItemsSource>
<CarouselView.ItemTemplate>
<DataTemplate>
<ContentView Content="{Binding .}" />
</DataTemplate>
</CarouselView.ItemTemplate>
</CarouselView>
<IndicatorView
x:Name="ActivePageIndicator"
IndicatorColor="LightGray"
SelectedIndicatorColor="Green"
IndicatorSize="16"
IndicatorsShape="Circle"
HorizontalOptions="Center"
Margin="4"
/>
</StackLayout>
</ContentPage.Content>
I've tried using different types of views in the ItemsSource list. But, I still get the same effect.
Is there something I'm doing wrong? Something I'm missing? A bug in CarouselView?
Thanks.
i am Using CardsView plugin 2.8.1 .its Working fine on Emulator and simulator but while check on Deployment it Frame show the wrong value section on carousel and few second after it show properly
Same Issue on While Scroll the Content or Refresh View
<RefreshView>
<CollectionView x:Name="CollView">
<CollectionView.ItemTemplate>
<DataTemplate>
<cards:CarouselView>
<cards:CarouselView.ItemTemplate>
<DataTemplate>
<Frame/>
</DataTemplate>
</cards:CarouselView.ItemTemplate>
</cards:CarouselView>
</DataTemplate>
</CollectionView.ItemTemplate>
</CollectionView>
</RefreshView>
</StackLayout> ```
From our API I am getting objects inside objects:
And I am trying to display it in a list very similar to the one in the screenshot.
<CollectionView
BackgroundColor="Transparent"
x:Name="listview_list">
<CollectionView.ItemTemplate>
<DataTemplate>
<StackLayout Margin="10">
<Label Text="{Binding name}"/>
<StackLayout IsVisible="{Binding layer1Visible}">
<Label Text="{Binding type}"/>
</StackLayout>
<StackLayout.GestureRecognizers>
<TapGestureRecognizer Tapped="TapGestureRecognizer_Tapped"/>
</StackLayout.GestureRecognizers>
</StackLayout>
</DataTemplate>
</CollectionView.ItemTemplate>
</CollectionView>
But here you already see the problem,
when i click on one element and "open" it up, I am binding to type but this is always shown as an empty label. But there is data on my list, it just wont display, as the property is on step further "in" into the model AND it exists multiple times (4 times in this example)
How can I access this data and also show a list of multiple sublayouts that dont themselves scoll but scroll with the parent (exactly how the one from visual studio in the screenshot)
thank you
I'm trying to implement a Xamarin Forms CollectionView using Grouping and GridItemsLayout vertical mode and Span="2". I make the grouping work without problems, but when I add the GridItemsLayout with the Span set to 2 columns, it does not behave as it should. Still showing the collection as 1 column.
<CollectionView
Grid.Row="1"
IsVisible="{Binding VisibleCollection}"
IsGrouped="True"
ItemsSource="{Binding Accounts}">
<CollectionView.GroupHeaderTemplate>
<DataTemplate>
<Label
FontSize="16"
Text="{Binding Name}" />
</DataTemplate>
</CollectionView.GroupHeaderTemplate>
<CollectionView.ItemsLayout>
<GridItemsLayout
Orientation="Vertical"
Span="2"
VerticalItemSpacing="10" />
</CollectionView.ItemsLayout>
<CollectionView.ItemTemplate>
<DataTemplate>
<Label BackgroundColor="Red" Text="TEST" />
</DataTemplate>
</CollectionView.ItemTemplate>
</CollectionView>
Label "TEST" still showing in 1 single column, and I want it to be shown as 2 columns:
TEST TEST
instead of:
TEST
TEST
Anyone knows how I can make it possible with GridItemsLayout? btw, this issue is happenning on UWP
Label "TEST" still showing in 1 single column, and I want it to be shown as 2 columns
Thanks for taking time to report this problem, for my testing the problem occurs in Xamarin Forms earlier version, and it is fixed in current stable version. Please update your Xamarin.Forms Nuget Package version to 4.5.0.530 . And please note CollectionView is available on iOS and Android, but is only partially available on the Universal Windows Platform. For more info please refer this document.
The problem comes when the collection view is initially "hide" and switching visibility.
Xamarin forms issue: https://github.com/xamarin/Xamarin.Forms/issues/9079
Try to set GridItemsLayout from main thread.
Example
Device.BeginInvokeOnMainThread(() =>
{
BannerList.ItemsLayout = new GridItemsLayout(2,ItemsLayoutOrientation.Vertical);
BannerList.ItemsSource = ImageList;
});
This is worked for me.
I'm trying to dabble a bit by moving from WPF to Xamarin using MVVM, and as the title says, I'm having a problem.
I first tried this code in a ContentPage XAML with a ListView, like this:
<ListView ItemsSource="{Binding EmailList}">
<TextCell Text="{Binding .}" />
</ListView>
and the EmailList is just a simple List<string>. I've tested it, and it works. I get a list of strings ("abc#test.com", "john#doe.com", etc)
I then try my luck doing a TableView, with the Intent set at Form in XAML. I did a few TableSelections, like Name, Address, etc, and they seem to work fine. However, when I put this in:
<TableSection Title="Emails">
<ViewCell>
<ListView ItemsSource="{Binding EmailList}">
<TextCell Text="{Binding .}"/>
<ListView>
<ViewCell>
</TableSection>
This is when I get an unhandled exception error and the app drops out.
I then tried this:
<TableSection Title="Emails">
<ViewCell>
<ListView ItemsSource="{Binding EmailList}">
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell>
<Label Text="{Binding .}" />
<ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
</ViewCell>
And I still get the same unhandled exception error.
So what am I doing wrong here?
Seeing that I cannot find the reason for it, and what other guys are saying in the comments, I think I have to take another approach. I'll have to go old school here and use a StackLayout and/or Grids to achieve on what I need the app to do.
Thanks for your input guys!