We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

Problem with SfListView horizontal insde SfListView vertical inside ScrollView on android

<ScrollView> 
 <StackLayout Orientation="Vertical" VerticalOptions="StartAndExpand" HorizontalOptions="FillAndExpand" Padding="15"   >
<listview:SfListView   ItemsSource="{Binding JugadoresHoyo}" SelectionMode="None"  HeightRequest="{Binding ListSizeJugadores}" ItemSize="110"  HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand" >
                        <listview:SfListView.ItemTemplate>
                            <DataTemplate>
                                    <Grid VerticalOptions="FillAndExpand" HorizontalOptions="FillAndExpand">
                                        <Grid.RowDefinitions>
                                            <RowDefinition Height="Auto" />
                                            <RowDefinition Height="Auto" />
                                        </Grid.RowDefinitions>
                                        <Grid.ColumnDefinitions>
                                            <ColumnDefinition Width="2*" />
                                            <ColumnDefinition Width="3*" />
                                            <ColumnDefinition Width="1*" />
                                            <ColumnDefinition Width="2*" />
                                            <ColumnDefinition Width="1*" />
                                        </Grid.ColumnDefinitions>
                                        <controls:CircleImage Grid.Row="0" Grid.Column="0"  Source="{Binding ImageSourceJugador}" Aspect="AspectFit" WidthRequest="60" HeightRequest="60" HorizontalOptions="StartAndExpand" VerticalOptions="CenterAndExpand"></controls:CircleImage>
                                        <Label Text="{Binding Nombre}" TextColor="Black" HorizontalOptions="StartAndExpand" VerticalOptions="CenterAndExpand" Grid.Row="0"  Grid.Column="1" ></Label>
                                        <Button Grid.Row="0" Grid.Column="2"   Text="-" TextColor="Black" CommandParameter="{Binding .}" Command="{Binding Path= BindingContext.DecreaseScore, Source={x:Reference Name=RegistroPageContent}}"   HorizontalOptions="FillAndExpand" FontAttributes="Bold" BorderColor="#c7d8d6" BorderWidth="1" CornerRadius="0" BackgroundColor="White" VerticalOptions="FillAndExpand" ></Button>
                                        <Frame Grid.Row="0" Grid.Column="3" HeightRequest="50" WidthRequest="50"  HorizontalOptions="CenterAndExpand" VerticalOptions="CenterAndExpand"  CornerRadius="{Binding CornerRadius2}" HasShadow="False"  Margin="0" Padding="0" BorderColor="{Binding BorderColor2}"  >
                                            <Frame Grid.Row="0" Grid.Column="3" HeightRequest="40" WidthRequest="40"  HorizontalOptions="CenterAndExpand" VerticalOptions="CenterAndExpand"  CornerRadius="{Binding CornerRadius1}" HasShadow="False"   Margin="0" Padding="0" BorderColor="{Binding BorderColor1}" >
                                                <Label Text="{Binding Golpes}" FontSize="25" TextColor="{Binding ParColor}" FontAttributes="Bold" VerticalTextAlignment="Center" HorizontalTextAlignment="Center" HorizontalOptions="CenterAndExpand"></Label>
                                            </Frame>
                                        </Frame>
                                        <Button Grid.Row="0" Grid.Column="4"  Text="+"  TextColor="Black" CommandParameter="{Binding .}" Command="{Binding Path= BindingContext.IncreaseScore, Source={x:Reference Name=RegistroPageContent}}"  FontAttributes="Bold" BorderColor="#c7d8d6" BorderWidth="1"  CornerRadius="0" BackgroundColor="White" HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand" ></Button>
                                    <listview:SfListView     Orientation="Horizontal" HeightRequest="{Binding AccesoriosListSize}"  AutoFitMode="None"  ItemsSource="{Binding AccesoriosList}"  SelectionMode="None" Grid.Row="1" Grid.Column="0" Grid.ColumnSpan="5" ItemSize="120"  ItemSpacing="0,0,0,0" >
                                            <listview:SfListView.ItemTemplate>
                                                <DataTemplate>
                                                    <Grid>
                                                    <Grid.ColumnDefinitions>
                                                        <ColumnDefinition Width="7*" />
                                                        <ColumnDefinition Width="3*" />
                                                    </Grid.ColumnDefinitions>
                                                        <Label Text="{Binding Nombre}" IsVisible="{Binding IsVisibleAccesorio}"  TextColor="Black" HorizontalOptions="CenterAndExpand" VerticalOptions="CenterAndExpand" Grid.Column="0"></Label>
                                                        <syncfusion:SfCheckBox IsChecked="{Binding Checked}" IsVisible="{Binding IsVisibleAccesorio}"   StateChanged="SfCheckBox_StateChanged" CornerRadius="0" CheckedColor="{Binding ColorAccesorio}" HorizontalOptions="CenterAndExpand" VerticalOptions="CenterAndExpand" Grid.Column="1"></syncfusion:SfCheckBox>
                                                    </Grid>
                                                </DataTemplate>
                                            </listview:SfListView.ItemTemplate>
                                        </listview:SfListView>
                                    </Grid>
                            </DataTemplate>
                        </listview:SfListView.ItemTemplate>
                    </listview:SfListView>
</StackLayout> 
<ScrollView> 

There is more code, but the important thing is this, as you can see I assign size to each SfListView involved, in IOS it works perfectly, the problem is in android, it happens when scrolling, annex photos of what happens. It changes the place items and sometimes disappears them, it should be noted that they are around 20 and it only puts me a few, I handle the sizes of the lists well, so I can't find why it doesn't work


Attachment: Downloads_ced45017.7z

5 Replies

GP Gnana Priya Namasivayam Syncfusion Team January 23, 2020 12:51 PM UTC

Hi Roberto, 

Thank you for using Syncfusion products. 

We have checked the reported query using the given code snippet from our side. We suspect reported issue occurs while handling visibility for the Label & Checkbox for inner listview cause empty space inside Grid. We are not clear about the exact cause for the reported issue. Can you please share your Model, ViewModel related codes along with the Video in order to analyze the reported issue better and provide appropriate solution at our end. 


Regards, 
Gnana Priya N 



RO Roberto January 23, 2020 05:36 PM UTC

As I mentioned this error only happens to me on Android in ios it works perfectly, I will attach a video of what happens, I don't know how useful the ViewModel and the Model would be because the data I get from a ws. Attach screen recordings of android and IOS so you can see the different operation with the same code.


Model:

using Newtonsoft.Json;
using System;
using System.Collections.Generic;
using System.Text;
using Xamarin.Forms;

namespace HandicApp.Models.HandicApp.Responses 
{

    public partial class JugadorScore
    {
        [JsonProperty("jugadorID")]
        public long JugadorId { get; set; }

        [JsonProperty("nombre")]
        public string Nombre { get; set; }

        [JsonProperty("principal")]
        public bool Principal { get; set; }

        [JsonProperty("golpes")]
        private long _golpes;
        public long Golpes
        {
            get { return _golpes; }
            set
            {
                _golpes = value;
               
                
            }
        }

        [JsonProperty("guardado")]
        public bool Guardado { get; set; }

        [JsonProperty("siempreSkill")]
        public bool SiempreSkill { get; set; }

        [JsonProperty("siempreFail")]
        public bool SiempreFail { get; set; }

        [JsonProperty("figura")]
        public string Figura { get; set; }


        [JsonProperty("accesoriosList")]
        public List<AccesoriosList> AccesoriosList { get; set; }

        [JsonProperty("personales")]
        public List<object> Personales { get; set; }

        [JsonIgnore]
        public bool SeMuestra { get; set; } = true;

        public string GolpeLetra { get; set ; }

        public string A1 { get; set; }

        public string A2 { get; set; }

        public string A3 { get; set; }

        public string ParColor { get; set; }

        public string CornerRadius1 { get; set; }

        public string BorderColor1 { get; set; }

        public string CornerRadius2 { get; set; }

        public string BorderColor2 { get; set; }

        public ImageSource ImageSourceJugador { get; set; }

        public long AccesoriosListSize { get; set; }
        
    }
}

using Newtonsoft.Json;
using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Text;

namespace HandicApp.Models.HandicApp.Responses
{
    public partial class AccesoriosList
    {
        [JsonProperty("id")]
        public long Id { get; set; }

        [JsonProperty("nombre")]
        public string Nombre { get; set; }

        [JsonProperty("colorAccesorio")]
        public string ColorAccesorio { get; set; }

        [JsonProperty("factor")]
        public string Factor { get; set; }

        public long JugadorID { get; set; }

        public bool IsVisibleAccesorio { get; set; } = true;

        private bool _checked;
        [JsonProperty("checked")]
        public bool Checked {
            get { return _checked; }
            set {
                _checked = value;
                NotifyPropertyChanged();
            }
        }

        public event PropertyChangedEventHandler PropertyChanged;
        private void NotifyPropertyChanged([System.Runtime.CompilerServices.CallerMemberName] string propertyName = "")
        {
            if (PropertyChanged != null)
            {
                PropertyChanged(this, new PropertyChangedEventArgs(propertyName));
            }
        }
    }
}

ViewModel:

var initInfo = await GetInfoHoyoJugado((long)_loggedUser.JugadorId, SelectedHoyo.Id).ConfigureAwait(false);

                if (initInfo?.Jugadores != null)
                {

                    RecargaJugadoresHoyo(initInfo?.Jugadores);
                    JugadoresHoyo = initInfo?.Jugadores;


              }


 private void RecargaJugadoresHoyo(List<JugadorScore> Jugadores)
        {
            foreach (var item in Jugadores)
            {
                var listAccesorios = new List<Models.HandicApp.Responses.AccesoriosList>();
                foreach (var item2 in item.AccesoriosList)
                {
                    Models.HandicApp.Responses.AccesoriosList accesorio = new Models.HandicApp.Responses.AccesoriosList();
                    accesorio.Checked = item2.Checked;
                    accesorio.ColorAccesorio = item2.ColorAccesorio;
                    accesorio.Factor = item2.Factor;
                    accesorio.Id = item2.Id;
                    accesorio.IsVisibleAccesorio = true;
                    accesorio.JugadorID = item2.JugadorID;
                    accesorio.Nombre = item2.Nombre;

                    if (!item.SiempreSkill && accesorio.Factor == "+")
                    {
                        if (item.Golpes > _partidaHoyosList.Where(x => x.Numero == SelectedHoyo.Numero).ToList().FirstOrDefault().Par)
                        {
                            accesorio.IsVisibleAccesorio = false;
                            accesorio.Checked = false;
                        }
                    }

                    if (!item.SiempreFail && accesorio.Factor == "-")
                    {
                        if (item.Golpes <= _partidaHoyosList.Where(x => x.Numero == SelectedHoyo.Numero).ToList().FirstOrDefault().Par)
                        {
                            accesorio.IsVisibleAccesorio = false;
                            accesorio.Checked = false;
                        }
                    }
                    listAccesorios.Add(accesorio);

                }
                listAccesorios = listAccesorios.OrderByDescending(x => x.IsVisibleAccesorio).ToList();
                item.AccesoriosList = listAccesorios.ToList();
                item.AccesoriosListSize = item.AccesoriosList.Count > 0 ? item.AccesoriosList.Count * 120 : 120;
            }
        }



Attachment: Downloads_22447ae3.7z


GP Gnana Priya Namasivayam Syncfusion Team January 24, 2020 08:32 AM UTC

 
We have tried checked your code snippet and tried to replicate the reported issue in our sample with SfListView 17.2.0.34 & 17.4.0.44 & Xamarin.Forms 4.4.0.991537. But, we couldn’t able to replicate the reported issue. Can you please share your SfListView and Xamari.Forms version & also share device configuration. We have attached the tested sample for your reference, can you please find the sample from below link. 
 
 
Tested Device configuration: Moto G5(7.0) 
 
Can you please check the above sample whether reported issue replicated in our sample also. If not, kindly revert us back with the issue replicated sample or modified sample so that we can replicate the reported issue and analyze to provide you better solution at the earliest. 
 
Regards, 
Gnana Priya N 
 



RO Roberto January 25, 2020 12:20 AM UTC

I am using version 4.2.0.709249 of xamarin and an android with version 9.0, syncfusion 17.3.0.34, I saw the example and it is not exactly the same as I am using it, in this they did something strange to the Horizontal SfListView, if they could try to make an example a bit more similar, without using premises?


GP Gnana Priya Namasivayam Syncfusion Team January 27, 2020 09:25 AM UTC

Hi Roberto, 
 
 
We have checked the reported issue in mentioned version also. But reported issue does not occur in our nested listview sample. We suspect reported issue occurs only at the certain scenario in your sample. Can you please revert us back with modified sample or issue replicated sample so that we can debug and check the exact cause for the reported issue to provide solution at the earliest. 
 
Else can we set up a web meeting with you to look into it directly. Would you please let me know of your availability for this? Our team will make every effort to have this scheduled on a date and time according to your convenience. 
 
Regards, 
Gnana Priya N 


Loader.
Live Chat Icon For mobile
Up arrow icon