Xamarin Forms - ListView IsVisible 绑定到 Switch，仅在 2 次切换后显示整个 ListView

Question

我目前正在使用带有 MVVM Light 的 Xamarin Forms 来创建跨平台 Android/iOS 应用程序。

我的问题是我尝试使用开关来显示/隐藏开关下方的 ListView。

编辑：问题仍然相同，但我发现如果列表 IsVisible=true 在导航到页面时，它会正确呈现。似乎从一开始就不能是 IsVisible=false。

当我第一次打开开关时，ListView 只显示了一部分。如果我将其关闭，然后再次打开，整个 ListView 都会被渲染。 图片可以更好地解释：

1. 第一张图片显示了开关打开之前的状态

1. 第二张图片显示了开关已打开一次的状态。 ListView 的背景是 Aqua 更好看

1. 第三张图片显示了开关已打开、关闭、打开的状态。 ListView 的背景仍然是 Aqua，但一切都按原样显示。

开关绑定到 ViewModel 中的布尔值，而 ListView IsVisible 绑定到 ViewModel 中的布尔值。 当开关打开时，它会将 IsVisible 属性更改为 true，这也应该第一次显示 List。

XAML 查看代码 sn-p:

<Grid Padding="0, 10, 0, 0" VerticalOptions="Start" Grid.Row="0" BackgroundColor="{Binding Source={x:Static color:ColorService.BackgroundColor}}">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="*"/>
            </Grid.ColumnDefinitions>

            <Label Text="Show list" Grid.Column="0" HorizontalOptions="Start" VerticalOptions="Center" TextColor="{Binding Source={x:Static color:ColorService.TextColor}}"/>
            <Switch IsToggled="{Binding IsCustomTeamNamesSwitchToggled}" Grid.Column="0" VerticalOptions="Center" HorizontalOptions="End" >
                <Switch.HeightRequest>
                    <OnPlatform x:TypeArguments="x:Double">
                      <OnPlatform.iOS>
                        30
                      </OnPlatform.iOS>
                      <OnPlatform.Android>
                       50
                      </OnPlatform.Android>
                    </OnPlatform>
                </Switch.HeightRequest>
                <Switch.WidthRequest>
                    <OnPlatform x:TypeArguments="x:Double">
                      <OnPlatform.iOS>
                        50
                      </OnPlatform.iOS>
                      <OnPlatform.Android>
                       100
                      </OnPlatform.Android>
                    </OnPlatform>
                </Switch.WidthRequest>
            </Switch>
        </Grid>

        <ListView ItemsSource="{Binding TeamNameList}" Grid.Row="1" x:Name="listview" IsVisible="{Binding IsListVisible}" BackgroundColor="{Binding Source={x:Static color:ColorService.BorderColor}}">
            <ListView.ItemTemplate>
              <DataTemplate>
                <ViewCell>
                  <ViewCell.View>
                    <Grid Padding="15, 0, 0, 0">
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="20"/>
                            <ColumnDefinition Width="*"/>
                        </Grid.ColumnDefinitions>

                        <Label Text="{Binding TeamShortName}" Grid.Column="0" VerticalOptions="Center" TextColor="{Binding Source={x:Static color:ColorService.TextColor}}"/>
                        <Entry Text="{Binding TeamName, Mode=TwoWay}" Grid.Column="1" VerticalOptions="Center" Placeholder="Placeholder" TextColor="{Binding Source={x:Static color:ColorService.TextColor}}"/>
                    </Grid>
                  </ViewCell.View>
                </ViewCell>
              </DataTemplate>
            </ListView.ItemTemplate>
        </ListView>
    </Grid>

ViewModel 代码 sn-p:

private ObservableCollection<Team> _teamNameList = new ObservableCollection<Team>();
    public ObservableCollection<Team> TeamNameList {
        get {
            return _teamNameList;
        }
        set {
            _teamNameList = value;
            RaisePropertyChanged("TeamNameList");
        }
    }

    private bool _isListVisible;
    public bool IsListVisible {
        get {
            return _isListVisible;
        }
        set {
            _isListVisible = value;
            RaisePropertyChanged ("IsListVisible");
        }
    }

    private bool _isCustomTeamNamesSwitchToggled;
    public bool IsCustomTeamNamesSwitchToggled {
        get {
            return _isCustomTeamNamesSwitchToggled;
        }
        set {
            _isCustomTeamNamesSwitchToggled = value;
            RaisePropertyChanged ("IsCustomTeamNamesSwitchToggled");

            if (_isCustomTeamNamesSwitchToggled)
                IsListVisible = true;
            else
                IsListVisible = false;
        }
    }

如果您需要查看一些代码或其他任何内容，请告诉我 :)

谢谢！

Answer 1

我们在 XF 上遇到了同样的问题，在解决这个问题之前，我们的解决方案是扩展元素（基本上只是从它继承）和 OnPropertyChanged，如果它的 isvisible 设置为 true，则执行 this.FadeTo(1f, 50); .大部分时间都可以解决这个问题。

更新

在我们进一步调试之后，我们发现这是因为我们的托管对象（列表视图、按钮等）的隐藏属性被更新了。这实际上是更新的，但本机元素属性没有更新，因此会导致此问题。 进行上述修复几乎总是有效，但它仍然只是一种解决方法。

我已经有一段时间没有使用 Xamarin Forms，所以我建议尝试看看它是否仍然会发生，因为在手机上制作动画是一个相当繁重的过程。

维托