在Windows 8中編寫自定義控件Metro

Question

我正在編寫我的第一個針對WinRT的自定義用戶控件，並且遇到了問題。

我想公開一個圖像，PART_NwBadge，它是我的控件中依賴屬性的可見性。然後我想通過樣式中的setter提供默認值。這部分不起作用。相反，DependencyProperty（在BadgedButton.cs中）的默認值正在被應用。

它甚至可以做我所描述的嗎？或者我應該在C＃代碼中設置默認值？如果我確實需要在C＃代碼中設置值，那麼有人會評論如何在代碼中加載圖像資源嗎？經過大量的搜索後，我還沒有找到可行的解決方案。

最後，由於這是我第一次認真地嘗試編寫自定義控件，請提出我可以做出的任何改進，即使它們與問題沒有直接關係。

的Windows 8消費者預覽版
C＃/的WinRT /地鐵
的Visual Studio 11 Beta版

主題/ Generic.xaml

<ResourceDictionary 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    xmlns:l="using:InkSdkTestApplication.Controls"> 

    <Style TargetType="l:BadgedButton"> 
     <Setter Property="Width" Value="36"/> 
     <Setter Property="Height" Value="36"/> 
     <Setter Property="Background" Value="#1C1C1C"/> 
     <Setter Property="BorderBrush" Value="White"/> 
     <Setter Property="BorderThickness" Value="2"/> 
     <Setter Property="NwBadge"> 
      <Setter.Value> 
       <Image Width="16" Height="16" Source="../Assets/mouse_16x16.png"/>    
      </Setter.Value> 
     </Setter> 
     <Setter Property="NwBadgeVisibility" Value="Collapsed"/> 
     <Setter Property="Template"> 
      <Setter.Value> 
       <ControlTemplate TargetType="l:BadgedButton"> 
        <Border x:Name="PART_Border" 
          Width="{TemplateBinding Width}" 
          Height="{TemplateBinding Height}" 
          Background="{TemplateBinding Background}" 
          BorderBrush="{TemplateBinding BorderBrush}" 
          BorderThickness="{TemplateBinding BorderThickness}"> 

         <Grid> 
          <ContentPresenter x:Name="PART_Content" 
               HorizontalAlignment="Center" 
               VerticalAlignment="Center" 
               Content="{TemplateBinding Content}"/> 

          <Image x:Name="PART_NwBadge" 
            HorizontalAlignment="Left" 
            VerticalAlignment="Top" 
            Width="16" Height="16" 
            Visibility="{TemplateBinding NwBadgeVisibility}" 
            Source="{TemplateBinding NwBadge}"/> 
         </Grid> 
        </Border> 
       </ControlTemplate> 
      </Setter.Value> 
     </Setter> 
    </Style> 
</ResourceDictionary> 

控制/ BadgedButton.cs

namespace InkSdkTestApplication.Controls 
{ 
    public sealed class BadgedButton : Control 
    { 
     #region // Dependency Properties 
     public static DependencyProperty ContentProperty = 
      DependencyProperty.Register(
       "Content", 
       typeof(FrameworkElement), 
       typeof(BadgedButton), 
       new PropertyMetadata(null)); 

     public static DependencyProperty NwBadgeProperty = 
      DependencyProperty.Register(
       "NwBadge", 
       typeof(Image), 
       typeof(BadgedButton), 
       new PropertyMetadata(null)); 

     public static DependencyProperty NwBadgeVisibilityProperty = 
      DependencyProperty.Register(
       "NwBadgeVisibility", 
       typeof(Visibility), 
       typeof(BadgedButton), 
       new PropertyMetadata(Visibility.Visible)); 
     #endregion 

     #region // Public Properties 
     public FrameworkElement Content 
     { 
      get { return (FrameworkElement)GetValue(ContentProperty); } 
      set { SetValue(ContentProperty, value); } 
     } 

     public Image NwBadge 
     { 
      get { return (Image)GetValue(NwBadgeProperty); } 
      set { SetValue(NwBadgeProperty, value); } 
     } 

     public Visibility NwBadgeVisibility 
     { 
      get { return (Visibility)GetValue(NwBadgeVisibilityProperty); } 
      set { SetValue(NwBadgeVisibilityProperty, value); } 
     } 
     #endregion 

     public BadgedButton() 
     { 
      this.DefaultStyleKey = typeof(BadgedButton); 
     } 
    } 
} 

Answer 1

http://timheuer.com/blog/archive/2012/03/07/creating-custom-controls-for-metro-style-apps.aspx