Below ListView not meeting my expectation.

[Saravanan]

give me a working sample of telerikDataControls:RadListView.

 

Below code is not meeting my expectation

 

1) Not able to use headertemplate

2) In item template i want to have my own button and button click event. Tap event is working, but button event not firing.

 

2) Preselection of listview not working. selectedJobList is not reflecting in the UI.  While loading for the firsttime the selectedjoblist items sould be preselected.

JobList==> observablecollection from my viewmodel.

selectedJobList ==> is another observablecollection from my viewmodel.

Please look at my below code

 

<telerikDataControls:RadListView x:Name="listView" 
                                                                ItemsSource="{Binding JobList}"

    SelectedItems="{Binding SelectedJobList, Mode=TwoWay }"
                                                                SelectionMode="Multiple"
                                                                SelectionGesture="Tap"
                                                                GroupHeaderTemplate="">
                                    <telerikDataControls:RadListView.Behaviors>
                                        <b:EventToCommandBehavior EventName="ItemTapped" 
                                    Command="{Binding ItemTappedCommand}"
                                                            EventArgsParameterPath="Item" />
                                    </telerikDataControls:RadListView.Behaviors>
                                    <telerikDataControls:RadListView.ItemStyle>
                                        <telerikListView:ListViewItemStyle BackgroundColor="Transparent"/>
                                    </telerikDataControls:RadListView.ItemStyle>

                                    <telerikDataControls:RadListView.SelectedItemStyle>
                                        <telerikListView:ListViewItemStyle BackgroundColor="#EFEFEF" BorderWidth="3" BorderLocation="Bottom"/>
                                    </telerikDataControls:RadListView.SelectedItemStyle>

                                    <telerikDataControls:RadListView.PressedItemStyle>
                                        <telerikListView:ListViewItemStyle BackgroundColor="#C1C1C1" BorderColor="#FF692F" BorderWidth="3" BorderLocation="Bottom"/>
                                    </telerikDataControls:RadListView.PressedItemStyle>
                                    <telerikDataControls:RadListView.GroupHeaderTemplate>
                                        <DataTemplate>
                                            <telerikListView:ListViewTemplateCell>
                                                <telerikListView:ListViewTemplateCell.View>
                                                    <Grid ColumnSpacing="1" BackgroundColor="Transparent" HeightRequest="35">
                                                        <Grid.ColumnDefinitions>
                                                            <ColumnDefinition Width="180" />
                                                            <ColumnDefinition Width="150"/>
                                                            <ColumnDefinition Width="150"/>
                                                            <ColumnDefinition Width="150"/>
                                                        </Grid.ColumnDefinitions>
                                                        <Grid Grid.Column="0"  Margin="1" >
                                                            <Label Text="Address" Style="{StaticResource GridHeaderStyle}"/>
                                                        </Grid>
                                                        <Grid Grid.Column="1" Margin="1">
                                                            <Label Text="Job Id" Style="{StaticResource GridHeaderStyle}"/>
                                                        </Grid>
                                                        <Grid Grid.Column="2" Margin="1">
                                                            <Label Text="Due Date" Style="{StaticResource GridHeaderStyle}" />
                                                        </Grid>
                                                        <Grid Grid.Column="3" Margin="1">
                                                            <Label Text="Zip Code" Style="{StaticResource GridHeaderStyle}" />
                                                        </Grid>
                                                    </Grid>
                                                </telerikListView:ListViewTemplateCell.View>
                                            </telerikListView:ListViewTemplateCell>
                                        </DataTemplate>
                                    </telerikDataControls:RadListView.GroupHeaderTemplate>
                                    <telerikDataControls:RadListView.ItemTemplate>
                                        <DataTemplate>
                                            <telerikListView:ListViewTemplateCell>
                                                <telerikListView:ListViewTemplateCell.View>
                                                    <Grid ColumnSpacing="1" BackgroundColor="Transparent"  HeightRequest="35">
                                                        <Grid.ColumnDefinitions>
                                                            <ColumnDefinition Width="180" />
                                                            <ColumnDefinition Width="150"/>
                                                            <ColumnDefinition Width="150"/>
                                                            <ColumnDefinition Width="150"/>
                                                        </Grid.ColumnDefinitions>
                                                        <Grid Grid.Column="0" Margin="1" >
                                                            <Label Text="{Binding FullAddress}" Style="{StaticResource GridItemStyle}"/>
                                                        </Grid>
                                                        <Grid Grid.Column="1" Margin="1">
                                                            <Label Text="{Binding JobNo}" Style="{StaticResource GridItemStyle}" />
                                                        </Grid>
                                                        <Grid Grid.Column="2" Margin="1">
                                                            <Label Text="{Binding DueDateStr}" Style="{StaticResource GridItemStyle}" />
                                                        </Grid>
                                                        <Grid Grid.Column="3" Margin="1">
                                                            <Label Text="{Binding AddrZip}" Style="{StaticResource GridItemStyle}" />
                                                        </Grid>
                                                    </Grid>
                                                </telerikListView:ListViewTemplateCell.View>
                                            </telerikListView:ListViewTemplateCell>
                                        </DataTemplate>
                                    </telerikDataControls:RadListView.ItemTemplate>
                                </telerikDataControls:RadListView>

[Yana]

Hi Saravanan,

I am sorry to hear you've had difficulties with the ListView control.

1. Header and footer feature is currently not available, we have it logged in our Feedback Portal - you can vote for it and subscribe for status changes here: ListView: Add support for header and footer

I can see in the provided code that you're using GroupHeaderTemplate, however it's applied when there are groups in the ListView, so you will need to set groups through PropertyGroupDescriptor, here is a sample snippet:

<telerikDataControls:RadListView.GroupDescriptors>
    <telerikListView:PropertyGroupDescriptor PropertyName="Field"/>
</telerikDataControls:RadListView.GroupDescriptors>

Please take a look at the Grouping topic for more details on this functionality.  I've also attached a sample project based on your code to demonstrate how it works.

2. I will need more details on this one, could you send me the EventToCommandBehavior implementation you have?  I will need it in order to test the exact scenario you have locally and provide proper assistance.

3.  Preselection of ListView  - indeed, currently setting SelectedItems through binding is not possible, the reason is that SelectedItems collection is read-only and you can only add items to it.  When using binding the framework tries to entirely set the respective property instead of adding or removing specific items.  We have this logged in our Feedback Portal,  you can track its progress at the following link:  ListView: SelectedItems two way binding
​
In the meantime, you could set preselected items in the code-behind like this:

foreach (var item in (listView.BindingContext as ViewModel).SelectedJobList)
    listView.SelectedItems.Add(item);

I'm looking forward to your reply .

Regards,
Yana
Progress Telerik