windows-phone-8 - 使用隐藏在全景控件中的进度指示器会导致全景项目只有第一个

Question

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

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

当“加载” View 折叠时，我发现无论您选择了什么项目，全景控件都会跳回控件中的第一个项目。

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

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>

虚拟机和后面的代码如下:

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();
      }
   }
}

如果您在模拟器中运行代码，然后轻弹到全景图中的 Item2。 5 秒后，它会弹回标有“控制”的页面。

在此测试代码中，我可以通过以下任一方式解决问题
a) 将包含 ProgressIndicator 的 StackPanel 更改为 Grid
b) 移除 ProgressIndicator

但是，这些解决方案都不适用于我的正确项目，但是如果我删除使用 BooleanToVisibilityConverter 的可见性代码，则它不会弹回。

有没有人有任何想法可能导致这种情况？
如果有用，我可以发布整个示例代码。

谢谢

- - 编辑 - -

这是 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);
        });
    }

好的。那是一个线索。所以我玩弄了我的项目模板(我的标题不存在)，试图看看是什么改变了大小。有些东西在改变大小……不知道是什么。因此，我将所有内容都包装在一个网格中，并将宽度/高度/MaxWidth/MaxHeight 硬编码为等于屏幕高度/宽度。它们绑定(bind)到我的 View 模型中的计算值，这些值会根据设备方向而变化。

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

有用!不再切换回第一项!

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