ListView не обновляет высоту ячейки в Android и iOS - PullRequest
Новая
       50

ListView не обновляет высоту ячейки в Android и iOS

0 голосов
/ 17 января 2020

Я пытаюсь создать расширяемый ListView, но сталкиваюсь с проблемами (не работает) в Android и iOS (работает в UWP). Пробовал много разметок, а также пытался составить список внутри списка и столкнулся с тем же результатом. Android и iOS отказываются обновлять высоту ячейки.

My Xaml 

                    <ListView ItemsSource="{Binding groups}"
                          IsGroupingEnabled="true"
                          HasUnevenRows="False"
                          SelectionMode="None"
                          VerticalScrollBarVisibility="Never"  

                           >
                        <ListView.GroupHeaderTemplate>
                            <DataTemplate>
                                <ViewCell>
                                    <StackLayout  Padding="5" VerticalOptions="FillAndExpand">
                                        <StackLayout.GestureRecognizers>
                                            <TapGestureRecognizer Command="{Binding HideShowItems}" CommandParameter="{Binding .}" />
                                        </StackLayout.GestureRecognizers>
                                        <Label  Text="{Binding GroupKey}" HorizontalOptions="Center" HorizontalTextAlignment="Center" VerticalTextAlignment="Center" VerticalOptions="FillAndExpand"/>
                                    </StackLayout>
                                </ViewCell>
                            </DataTemplate>      
                        </ListView.GroupHeaderTemplate>
                    <ListView.ItemTemplate>
                        <DataTemplate>
                                <ViewCell>
                                    <ViewCell.View>
                                        <Grid Padding="0" HeightRequest="{Binding rowHeight}" HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand">
                                            <Grid.RowDefinitions>
                                                <RowDefinition Height="*"/>
                                            </Grid.RowDefinitions>
                                            <BoxView Grid.Row="0" HorizontalOptions="FillAndExpand" 
                                                     BackgroundColor="{Binding BtnColour}"  />
                                        </Grid>
                                    </ViewCell.View>
                                </ViewCell>

                            </DataTemplate>
                    </ListView.ItemTemplate>
                </ListView>

Команда для обработки изменения 

        public Command HideShowItems => new Command(async (sender) =>
        {            
            var dropDown = sender as DropDownMenu;

            foreach(DropDownButton dr in dropDown)
            {
                if (dr.rowHeight > 0)
                {
                    while(dr.rowHeight > 0)
                    {
                        dr.rowHeight = dr.rowHeight - 5;
                        await Task.Delay(5);
                    }

                }
                else
                {
                    while(dr.rowHeight < 40)
                    {
                        dr.rowHeight = dr.rowHeight + 5;
                        await Task.Delay(5);
                    }

                }
            }
        });

Пробовал довольно в Интернете найдено несколько примеров, и ни один из них, похоже, не делает этого.

Все еще находясь на стадии изучения, было бы полезно, если бы вы дали отзыв, когда увидите в коде что-нибудь, что можно сделать лучше.

Большое спасибо!

Ответы [ 3 ]

0 голосов
/ 18 января 2020

  1. Убедитесь, что свойство HasUnevenRows="true" для вашего listview.HasUnevenRows будет использоваться для увеличения высоты ячейки на основе содержимого, присутствующего в ячейке.

  2. Применить заполнение к сетке. Пример: <Grid Padding="5">

0 голосов
/ 21 января 2020

Я создал необходимые логи c, используя другие формы Xamarin. Это не значит, что я ответил на вопрос о ListView, и команда Xamarin, вероятно, должна будет внести изменения, но это то, с чем я пришел, чтобы создать расширяемый список.

XAML 

        <ScrollView x:Name="ScrollActivity"  VerticalScrollBarVisibility="Never" >
            <Grid x:Name="GridContent" >
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="20*"/>
                <ColumnDefinition Width="80*"/>

            </Grid.ColumnDefinitions>

            <StackLayout BackgroundColor="#f0dfe2" x:Name="buttonHolder" BindableLayout.ItemsSource="{Binding sideMenu}" >
                    <BindableLayout.ItemTemplate>
                        <DataTemplate>
                            <StackLayout BackgroundColor="#f0dfe2">
                                <StackLayout HeightRequest="50" BackgroundColor="#38292c">
                                    <StackLayout.GestureRecognizers>
                                        <TapGestureRecognizer Command="{Binding Source={x:Reference buttonHolder}, Path=BindingContext.ShowHideCommand}"  
                                                              CommandParameter="{Binding .}"/>


                                    </StackLayout.GestureRecognizers>
                                    <Label FontSize="Medium" HorizontalOptions="Center" VerticalOptions="Center" HorizontalTextAlignment="Center" VerticalTextAlignment="Center"  TextColor="White" Text="{Binding title}"/>
                                </StackLayout>


                                    <StackLayout HeightRequest="{Binding rowHeight}" 

                                                 BindableLayout.ItemsSource="{Binding device}" >
                                        <BindableLayout.ItemTemplate>
                                            <DataTemplate>
                                            <Frame Padding="0" CornerRadius="10">
                                                <Frame.GestureRecognizers>
                                                    <PanGestureRecognizer PanUpdated="PanGestureRecognizer_PanUpdated_1">

                                                    </PanGestureRecognizer>
                                                </Frame.GestureRecognizers>

                                                <Grid HeightRequest="40" BackgroundColor="{Binding btnBkColour}" IsVisible="{Binding visibility}" >

                                                    <Label HorizontalOptions="Center" VerticalOptions="Center" HorizontalTextAlignment="Center" VerticalTextAlignment="Center" TextColor="White" Text="{Binding deviceTitle}" />
                                                </Grid>
                                            </Frame>
                                        </DataTemplate>
                                        </BindableLayout.ItemTemplate>
                                    </StackLayout >

                            </StackLayout>

                        </DataTemplate>
                    </BindableLayout.ItemTemplate>
                </StackLayout >




        </Grid>
        </ScrollView>

Команда для управления расширением 

        public Command ShowHideCommand => new Command(async (sender) =>
        {
            var sideMenu = sender as SideMenuObject;

            if (changeTriggered == false)
            {

                changeTriggered = true;
                if (sideMenu.rowHeight > 0)
                {
                    foreach (SideMenuDevice dev in sideMenu.device)
                    {
                        dev.visibility = false;

                        while (sideMenu.rowHeight >(sideMenu.device.Count - (sideMenu.device.IndexOf(dev) + 1))*40)
                        {
                            sideMenu.rowHeight = sideMenu.rowHeight - 5;
                            await Task.Delay(5);
                        }

                    }

                }
                else
                {
                    foreach (SideMenuDevice dev in sideMenu.device)
                    {
                        while (sideMenu.rowHeight <= (sideMenu.device.IndexOf(dev) +1 ) *40)
                        {
                        sideMenu.rowHeight = sideMenu.rowHeight + 5;
                        await Task.Delay(5);
                        }
                        dev.visibility = true;
                    }
                }
            }

            changeTriggered = false;
        });

Пожалуйста, дайте отзыв, если можете!

0 голосов
/ 18 января 2020

Согласно вашему описанию, вы хотите обновить высоту строки ListView, я предлагаю вам связать высоту BoxView вместо Grid.

Из вашего кода я не знаю о DropDownMenu, поэтому я использую нажатие кнопки чтобы изменить ListView Row, посмотрите мой код: 

<StackLayout>
        <ListView
            HasUnevenRows="False"
            IsGroupingEnabled="true"
            ItemsSource="{Binding groups}"
            SelectionMode="None"
            VerticalScrollBarVisibility="Never">
            <ListView.GroupHeaderTemplate>
                <DataTemplate>
                    <ViewCell>
                        <StackLayout Padding="5" VerticalOptions="FillAndExpand">
                            <!--<StackLayout.GestureRecognizers>
                                <TapGestureRecognizer Command="{Binding HideShowItems}" CommandParameter="{Binding .}" />
                            </StackLayout.GestureRecognizers>-->
                            <Label
                                HorizontalOptions="Center"
                                HorizontalTextAlignment="Center"
                                Text="{Binding GroupKey}"
                                VerticalOptions="FillAndExpand"
                                VerticalTextAlignment="Center" />
                        </StackLayout>
                    </ViewCell>
                </DataTemplate>
            </ListView.GroupHeaderTemplate>
            <ListView.ItemTemplate>
                <DataTemplate>
                    <ViewCell>
                        <ViewCell.View>
                            <Grid
                                Padding="0"
                                HorizontalOptions="FillAndExpand"
                                VerticalOptions="FillAndExpand">
                                <Grid.RowDefinitions>
                                    <RowDefinition Height="Auto" />
                                </Grid.RowDefinitions>
                                <BoxView
                                    BackgroundColor="{Binding BtnColour}"
                                    HeightRequest="{Binding rowHeight}"
                                    HorizontalOptions="FillAndExpand" />
                            </Grid>
                        </ViewCell.View>

                    </ViewCell>

                </DataTemplate>
            </ListView.ItemTemplate>
        </ListView>

        <Button
            x:Name="btn1"
            Clicked="Btn1_Clicked"
            Text="change listview row height" />
    </StackLayout>

 public partial class Page1 : ContentPage
{
    public ObservableCollection<GroupModel> groups { get; set; }

    public Page1()
    {
        InitializeComponent();

        groups = new ObservableCollection<GroupModel>();
        var group1 = new GroupModel() { GroupKey = "Group 1 key" };
        var group2 = new GroupModel() { GroupKey = "Group 2 key" };
        group1.Add(new model1() { rowHeight = 20, BtnColour = Color.Red });
        group1.Add(new model1() { rowHeight = 30, BtnColour = Color.Blue });
        group1.Add(new model1() { rowHeight = 40, BtnColour = Color.Green });

        group2.Add(new model1() { rowHeight = 20, BtnColour = Color.Gray });
        group2.Add(new model1() { rowHeight = 30, BtnColour = Color.Black });
        group2.Add(new model1() { rowHeight = 50, BtnColour = Color.Gold });

        groups.Add(group1);
        groups.Add(group2);
        this.BindingContext = this;


    }

    private void Btn1_Clicked(object sender, EventArgs e)
    {
        groups[0][0].rowHeight = 60;
    }
}


public class GroupModel:ObservableCollection<model1>
{
    public string GroupKey { get; set; }
}
public class model1:ViewModelBase
{
    private double _rowHeight;
    public double rowHeight
    {
        get { return _rowHeight; }
        set
        {
            _rowHeight = value;
            RaisePropertyChanged("rowHeight");
        }
    }


    public Color BtnColour { get; set; }
}

ViewModelBase - это класс, реализующий интерфейс INotifyPropertychanged. 

 public class ViewModelBase : INotifyPropertyChanged
{

    public event PropertyChangedEventHandler PropertyChanged;

          public void RaisePropertyChanged(string propertyName)
    {
        PropertyChangedEventHandler handler = PropertyChanged;
        if (handler != null)
        {
            handler(this, new PropertyChangedEventArgs(propertyName));
        }
    }
}

enter image description here

...