Xamarin Forms - 棱镜绑定属性 - 渲染问题

Question

Git：https://github.com/jimmyt1988/Test

---

我在 UWP 本地设备“模拟器”上的桌面 windows 10 pc 上运行

---

我的视图模型中有一个深度整数属性，它通过按钮命令递增。

当我这样做时，数字会从屏幕上消失，然后如果我调整应用程序的大小，它将再次正确呈现。

发生了什么事？

它似乎可以在 Android 模拟器上运行。

代码

public DelegateCommand<FoodGroupModel> SubtractFromAmountEatenCommand { get; private set; }

...

SubtractFromAmountEatenCommand = new DelegateCommand<FoodGroupModel>((foodGroup) => SubtractFromAmountEaten(foodGroup));

...

public void SubtractFromAmountEaten(FoodGroupModel foodGroup)
{
    if(foodGroup.AmountEaten != 0)
    {
        foodGroup.AmountEaten--;
    }
}

...

public class FoodGroupModel : BindableBase
{
    private int _amountEaten;
    public int AmountEaten
    {
        get { return _amountEaten; }
        set { SetProperty(ref _amountEaten, value); }
    }
}

XAML：

<?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:prism="clr-namespace:Prism.Mvvm;assembly=Prism.Forms"
             prism:ViewModelLocator.AutowireViewModel="True"
             x:Class="...Views.MealPage">

    <StackLayout>
        <Label Text="{Binding Meal.Number}"/>
        <ListView x:Name="FoodGroupsListView" ItemsSource="{Binding Meal.FoodGroups}">
            <ListView.ItemTemplate>
                <DataTemplate>
                    <ViewCell>
                        <ViewCell.View>
                            <Grid>
                                <Grid.RowDefinitions>
                                    <RowDefinition Height="50"/>
                                </Grid.RowDefinitions>
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition Width="Auto" />
                                    <ColumnDefinition Width="1*" />
                                    <ColumnDefinition Width="Auto" />
                                    <ColumnDefinition Width="100" />
                                    <ColumnDefinition Width="50" />
                                    <ColumnDefinition Width="50" />
                                </Grid.ColumnDefinitions>

                                <Label Grid.Row="0" Grid.Column="0" TextColor="#bababa" Text="Group"></Label>
                                <Label Grid.Row="0" Grid.Column="1" Text="{Binding Title}" />

                                <Label Grid.Row="0" Grid.Column="2" TextColor="#bababa" Text="Qty"></Label>
                                <Label Grid.Row="0" Grid.Column="3" Text="{Binding AmountEaten}" />

                                <Button Grid.Row="0" Grid.Column="4"
                                        Command="{Binding Source={x:Reference FoodGroupsListView}, Path=BindingContext.UndoAmountEatenByOneCommand}"
                                        CommandParameter="{Binding}"
                                        Text="✖"></Button>

                                <Button Grid.Row="0" Grid.Column="5"
                                        Command="{Binding Source={x:Reference FoodGroupsListView}, Path=BindingContext.SubtractFromAmountEatenCommand}"
                                        CommandParameter="{Binding}"
                                        Text="✔"></Button>
                            </Grid>
                        </ViewCell.View>
                    </ViewCell>
                </DataTemplate>
            </ListView.ItemTemplate>
        </ListView>
    </StackLayout>

</ContentPage>

Answer 1

当我这样做时，数字会从屏幕上消失，然后如果我调整我的应用程序的大小，它将再次正确呈现。

您可能会遇到问题：属性绑定的更改通知在 Xamarin ListView 内无法正常工作（可能与重新渲染有关），请在此处报告：Bugzilla

在 Windows 运行时平台（Win/WP 8.1 & UWP）中，我们必须使用变通方法来暂时避免这种情况：

private void RefreashFoodGroupModel()
        {
            if (Device.OS == TargetPlatform.Windows || Device.OS == TargetPlatform.WinPhone)
            {
                //var index = Meal.FoodGroups.IndexOf(foodGroup);
                //Meal.FoodGroups.RemoveAt(index);
                //Meal.FoodGroups.Insert(index, foodGroup);

                var t = Meal.FoodGroups;
                Meal.FoodGroups = new System.Collections.ObjectModel.ObservableCollection<FoodGroupModel>();
                foreach (var item in t)
                {
                    Meal.FoodGroups.Add(item);
                }
            }
        }

数据变化后调用上述方法刷新数据：

public void SubtractFromAmountEaten(FoodGroupModel foodGroup)
        {
            if(foodGroup.AmountEaten != 0)
            {
                foodGroup.AmountEaten--;
                RefreashFoodGroupModel();
            }
        }

        public void UndoAmountEatenByOne(FoodGroupModel foodGroup)
        {
            if (foodGroup.AmountEaten != foodGroup.Quantity)
            {
                foodGroup.AmountEaten++;
                RefreashFoodGroupModel();
            }
        }

此解决方法将导致刷新ListView 项目。