使用隐藏在Panorama控件中的进度指示器会导致全景项目仅为第一个

Question

我的WP8应用程序出现了一个非常奇怪和烦人的问题。

它使用Panorama控件来查看从网络下载的项目。它有一个在下载内容时显示的视图，但在内容完成加载后会被折叠。

当"加载"视图折叠时，我发现无论您选择了什么项目，Panorama控件都会跳回控件中的第一个项目。

我有以下非常基本的测试代码来演示这个问题。

XAML:

<phone:PhoneApplicationPage
    x:Class="Wp8.GUI.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
    xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:converters="clr-namespace:Wp8.Gui.Converters"
    mc:Ignorable="d"
    FontFamily="{StaticResource PhoneFontFamilyNormal}"
    FontSize="{StaticResource PhoneFontSizeNormal}"
    Foreground="{StaticResource PhoneForegroundBrush}"
    SupportedOrientations="Portrait" Orientation="Portrait"
    shell:SystemTray.IsVisible="True">
        <!--ContentPanel - place additional content here-->
        <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
            <Grid.Resources>
               <converters:BooleanToVisibilityConverter x:Key="BooleanToVisibilityConverter" />
            </Grid.Resources>

      <phone:Panorama ItemsSource="{Binding PanoramaItems}">
            <phone:Panorama.HeaderTemplate>
               <DataTemplate>
                  <Grid HorizontalAlignment="Stretch">
                     <TextBlock Text="{Binding Title}" />
                  </Grid>
               </DataTemplate>
            </phone:Panorama.HeaderTemplate>

            <phone:Panorama.ItemTemplate>
               <DataTemplate>
                  <Grid>
                     <StackPanel x:Name="Visible1" Visibility="{Binding ShowFirst, Converter={StaticResource BooleanToVisibilityConverter},ConverterParameter=True}" >
                        <ProgressBar IsIndeterminate="True" />
                        <TextBlock Text="ShowFirst" />
                     </StackPanel>
                     <StackPanel x:Name="Visible2" Visibility="{Binding ShowFirst, Converter={StaticResource BooleanToVisibilityConverter},ConverterParameter=False}" >
                        <TextBlock Text="Show  Second" />
                     </StackPanel>
                  </Grid>
               </DataTemplate>
            </phone:Panorama.ItemTemplate>
         </phone:Panorama>
      </Grid>
</phone:PhoneApplicationPage>

VM和代码隐藏如下：

namespace Wp8.GUI
{
   public class PanItemVm : INotifyPropertyChanged 
   {
      private readonly string _title;
      private bool _showFirst = true;
      public PanItemVm()
      {
         _title = "Control";
      }
      public PanItemVm(string title)
      {
         _title = title;
      }
      public string Title { get { return _title; } }
      public bool ShowFirst
      {
         get { return _showFirst; }
         set
         {
            _showFirst = value;
            RaisePropertyChanged("ShowFirst");
         }
      }
      private void RaisePropertyChanged(string propName)
      {
         if (PropertyChanged != null)
         {
            PropertyChanged(this, new PropertyChangedEventArgs(propName));
         }
      }
      public event PropertyChangedEventHandler PropertyChanged;
   }
   public class PanItemVm2 : PanItemVm
   {
      public PanItemVm2() : base ("Items") 
      {
         Task.Run(() => Task.Delay(TimeSpan.FromSeconds(5))) 
             .ContinueWith(t => ShowFirst = false, 
                           TaskScheduler.FromCurrentSynchronizationContext());
      }
   }
   public class TestVm : INotifyPropertyChanged
   {
      public IEnumerable<PanItemVm> PanoramaItems
      {
         get { 
            return Enumerable.Range(0, 2)
                   .Select(i => i == 0 ? 
                           new PanItemVm() : new PanItemVm2()); }
      }
      public event PropertyChangedEventHandler PropertyChanged;
   }
   public partial class MainPage : PhoneApplicationPage
   {
      public MainPage()
      {
         InitializeComponent();
         DataContext = new TestVm();
      }
   }
}

如果您在模拟器中运行代码，然后在全景中轻弹到项目2。5秒钟后，它将弹回到标记为"控制"的页面。

在这个测试代码中，我可以通过以下方式解决问题：a） 将ProgressIndicator所在的StackPanel更改为网格b） 卸下ProgressIndicator

然而，这两种解决方案都不适用于我的正确项目，但如果我删除了使用BooleanToVisibilityConverter的Visibility代码，它就不会弹回来。

有人知道是什么原因造成的吗？如果有用的话，我可以发布整个示例代码。

感谢

---编辑---

这是BooleanToVisibilityConverter 的代码

using System.Windows;
using System.Windows.Data;
namespace Wp8.Gui.Converters
{
   public class BooleanToVisibilityConverter : IValueConverter 
   {
      public object Convert(object value, System.Type targetType, object parameter, System.Globalization.CultureInfo culture)
      {
         if (value != null && value is bool)
         {
            bool visibilityValue = true;
            if(parameter != null)
            {
               if(parameter is string)
               {
                  bool.TryParse((string)parameter, out visibilityValue);
               }
            }
            return (bool)value == visibilityValue ? Visibility.Visible : Visibility.Collapsed;
         }
         return Visibility.Visible;
      }
      public object ConvertBack(object value, System.Type targetType, object parameter, System.Globalization.CultureInfo culture)
      {
         throw new System.NotImplementedException();
      }
   }
}

Answer 1

我也遇到了同样的问题。我有一个全景（修改为全屏），我正在用它在旋转木马中显示图片。我必须根据全景位置打开/关闭图片，以保持低内存。然而，无论何时加载图片，全景都会返回到默认项目。。。第一项。

因此，我从另一个问题中得到了提示，并查看了Panorama的源代码。虽然您看不到当前的代码，但您可以看到Panorama作为WP Toolkit的一部分时是什么。似乎只要全景图的大小发生变化，内部滚动查看器就会重置。

 void OnSizeChanged(object sender, SizeChangedEventArgs e)
    {
        // clip to control layout
        LayoutRoot.SetValue(Panel.ClipProperty, new RectangleGeometry() { Rect = new Rect(0, 0, this.Width, this.Height) });
        // reset scroll viewer
        Dispatcher.BeginInvoke(() =>
        {
            ScrollView.Invalidate(false);
        });
    }

好的。这是一条线索。所以我玩了我的项目模板（我的标题不存在），试图看看是什么在改变大小。有东西在变大。。。不知道是什么。所以我把所有东西都包装在一个网格中，并硬编码Width/Height/MaxWidth/MaxHeight，使其等于屏幕高度/宽度。它们绑定到我的视图模型中的计算值，这些值会根据设备方向而变化。

 <controls:PanoramaFullScreen.ItemTemplate>
            <DataTemplate>
                <Grid Width="{Binding LayoutWidth}"
                      MaxWidth="{Binding LayoutWidth}"
                      Height="{Binding LayoutHeight}"
                      MaxHeight="{Binding LayoutHeight}">
             {rest of stuff}
                </Grid>
            </DataTemplate>

它有效！不再切换回第一项！

因此，我怀疑您的代码正在更改PanoramaItem的整体高度/宽度，这反过来又会更改Panorama的大小并重置内部滚动查看器。