在 Windows 8 C# 中更新 UI

Question

我有一个名为 AllPageView 的页面，它有一个 GridView。 GridView的数据模板如下

<GridView.ItemTemplate>
     <DataTemplate>
          <Canvas Width="{Binding TemplateWidth}" Height="{Binding TemplateHeight}">
              <Canvas.Background>
                  <ImageBrush ImageSource="{Binding PageBackground}"/>
               </Canvas.Background>
                <Image Height="{Binding TemplateHeight}" Width="{Binding TemplateWidth}" Source="{Binding Page}" Stretch="Uniform" Opacity="1" CacheMode="BitmapCache" />

                   <StackPanel x:Name="EditDeleteStackPanel" Width="{Binding TemplateWidth}" Height="{Binding TemplateHeight}" Opacity="0.95">
                       <Button x:Name="NoteDelete"  HorizontalAlignment="Right"   VerticalAlignment="Top" Foreground="{x:Null}" Tapped="NoteDelete_Tapped" MinWidth="50" MinHeight="50" Margin="0,0,10,0" BorderBrush="{x:Null}" >
                           <Button.Background>
                               <ImageBrush ImageSource="{Binding Delete}"/>
                           </Button.Background>
                       </Button>
                       <Button x:Name="NoteEdit"  HorizontalAlignment="Right"   VerticalAlignment="Top"   FontFamily="Segoe Script" FontSize="24" BorderBrush="{x:Null}" Tapped="NoteEdit_Tapped" Foreground="{x:Null}" MinWidth="50" MinHeight="50" Margin="0,0,10,0">
                           <Button.Background>
                               <ImageBrush ImageSource="{Binding Edit}"/>
                           </Button.Background>
                       </Button>
                  </StackPanel>
           </Canvas>
       </DataTemplate>
</GridView.ItemTemplate>

图像的高度和宽度分别绑定到Page_Collection 类的TemplateHeight 和TemplateWidth。对于TemplateHeight 和TemplateWidth，我有一个更好的二传手。

public static int TemplateWidth
{
    get { return m_templateWidth; }
    set 
    { 
        m_templateWidth = value;                
    }
}

问题是，我现在需要从名为General 的页面调整图像大小。
当切换切换开关时，我需要更改图像的大小。像这样

private void OnCompactCategoryToggled(object sender, RoutedEventArgs e)
{
    if (compactCateg.IsOn == true)
    {
        Page_Collection.TemplateHeight = 100;
        Page_Collection.TemplateWidth = 350;
    }
    else
    {
        Page_Collection.TemplateHeight = 200;
        Page_Collection.TemplateWidth = 700;
    }
}

虽然AllPageView 页面绑定到Page_Collection，但值不会更新，因此图像大小是相同的。 General 是Flyout 中的SettingsPane。

我是 Windows 8 的新手，这是我第一次使用 DataBinding。有人可以告诉我哪里出了问题或者我遗漏了什么吗？

编辑

这是AllPageView 的代码。我在类的构造函数中调用Load_PageCollection

public async void Load_PageCollection()
{
    m_pageConfig = new PageConfig();
    Page_Collection[] tmppage = await m_pageConfig.Read_FromJSONFile(App.PAGECONFIG);
    List<Page_Collection> tmp;
    if (tmppage != null)
    {
        for (int i = 0; i < tmppage.Length; i++)
        {
            tmppage[i].UpdateCompletionStatus();
        }
        tmp = tmppage.ToList();
        ObservableCollection<Page_Collection> NoteCol = new ObservableCollection<Page_Collection>(tmp.ToList<Page_Collection>());
        PageCollection = NoteCol;
        PageLV.DataContext = PageCollection;
        m_pageManager.InitilizeWithFileLoc(PageCollection.ToArray());
    }
    else
    {
        PageCollection = new ObservableCollection<Page_Collection>();
        PageLV.DataContext = PageCollection;// PageLV is the grid view. The gridview, the image and a stackpanel.
    }
}

Answer 1

更新代码后编辑。

您需要将模板属性移动到支持 INotifyPropertyChanged 的​​单独类中，然后从您的每个 PageCollection 实例中引用此类......

public class PageCollectionTemplate : INotifyPropertyChanged {

   private static readonly void m_Instance=new PageCollectionTemplate();

   private int m_templateWidth;

   public static PageCollectionTemplate Instance {
     get { return m_Instance; }
   }

   public  int TemplateWidth {
        get { return m_templateWidth; }

        set 
        { 
            if (m_templateWidth == value) return;
            m_templateWidth = value;                
            OnPropertyChanged("TemplateWidth");
        }
    }
    // Do same for template height...

   protected void OnPropertyChanged(string propertyName) {
     var handler=PropertyChanged;
     if (handler!=null) handler(this,new PropertyChangedEventArgs(propertyName));
  }

  public event PropertyChangedEventHandler PropertyChanged;

}

更新，我之前错过了这一点，在你的页面集合类中

public PageCollectionTemplate Tempate { 
    get { return PageCollectionTemplate.Instance; }
}

然后将您的绑定更新为{Binding Template.TemplateWidth}。

您可以通过将绑定源设置为单例实例来替代实现，例如：

{Binding TemplateWidth,Source={x:Static w:PageCollectionTemplate.Instance}

但您需要为w 定义命名空间

不要试图实现以下内容，因为通知属性更改事件不会触发！

public int TemplateWidth {
   get { return PageCollectionTemplate.Instance.TemplateWidth; }
   set { PageCollectionTemplate.Instance.TemplateWidth=value; }
}

Answer 2

包含 TemplateWidth 定义的类需要实现 INotifyPropertyChanged，并且 TemplateWidth 的 setter 需要引发 PropertyChanged 事件。

public int TemplateWidth
{
    get { return m_templateWidth; }

    set 
    { 
        m_templateWidth = value;    
        if (PropertyChanged!=null)
        {
             PropertyChanged(this, new PropertyChangedEventArgs("TemplateWidth"));
        }            
    }
}

使用 Prism 或 SimpleMVVM 等框架可以简化此类事物的编码 并且还可以让您摆脱对“TemplateWidth”等常量的依赖。