在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