2011-02-01 17 views
2

システムの前景色に基づいて画像に色を付ける特別なボタンを作成しようとしています。溶液の色を取得するには不透明マスクとして画像を使用してのようだと私はこのような画像を直接設定すると、それは動作します:ImageBrushをDependencyPropertyのテンプレートにバインドする

<Grid> 
    <Rectangle x:Name="ImageForeground" Height="48" Width="48" 
    Fill="{StaticResource PhoneForegroundBrush}" > 
    <Rectangle.OpacityMask> 
     <ImageBrush Stretch="Fill" ImageSource="/icons/play.png"/> 
    </Rectangle.OpacityMask> 
    </Rectangle> 
</Grid> 

しかし、すぐに、私は画像liteのためのDependencyPropertyでこれをテンプレートしてみてくださいとこの:このようなXAMLで

public static readonly DependencyProperty ImageProperty = 
    DependencyProperty.Register("Image", typeof(ImageSource), 
           typeof(RButton), null); 

そして:

<Grid> 
    <Rectangle x:Name="ImageForeground" Height="48" Width="48" 
    Fill="{TemplateBinding Foreground}" > 
    <Rectangle.OpacityMask> 
     <ImageBrush Stretch="Fill" ImageSource="{TemplateBinding Image}"/> 
    </Rectangle.OpacityMask> 
    </Rectangle> 
</Grid> 

私はというエラーを取得:

私が代わりにこの

<Image Source="{TemplateBinding Image}" Width="48" Height="48" /> 

のような画像に任意のアイデアを、それを結合テストとして

object of type 'System.Windows.CustomDependencyProperty' 
    cannot be converted to type 'System.Windows.DependencyProperty' 

ImagePropertyは、okですか?私の勘違いはDependecyPropertyをどのように定義しているかを示していますが、私はどのように前進するのか分かりません。

答えて

6

ImageBrushはFrameworkElementから継承されないため、TemplateBoundまたはData Boundにすることはできません。

+0

うん、それは難しい方法を学んだ:) – haqwin

+0

これのソースはありますか? DependencyObjectのDependencyPropertyがテンプレートバインディングのターゲットになり得ないと言う人は誰ですか? – McGarnagle

3

あなたが与えたXAMLに基づいてテストプロジェクトで問題を再現しようとしましたが、あなたが記述した問題に遭遇していないことを認めなければなりません。 RButtonのコードとコントロールの使い方に関する文脈を提供できれば、もっと運があるかもしれません(または欠けているかもしれません)。

今日投稿されたブログの投稿All about Dependency Properties in Silverlight for WP7が有益でした。

更新:私はちょうど問題を完全に説明し解決策を提供するこれに完全に一致するarticleを読んでいます。基本的にImageBrushFrameworkElementではないため、TemplateBindingを使用することはできません。

+0

賢い、それはトリックを行うかもしれません!さらにそれを見なければならないでしょう... – haqwin

3

完全な回答ではありませんが、回答としてマークしました。それをすべて稼働させるためには、TemplateBindingで一台のConverterを使用することができないので、いくつかの調整が必要でした。とにかく。 Derekが指摘したarticleのコンバータと一緒に私のためにそれを解決したコードはここにあります。

ので

<Grid> 
    <Grid.Resources> 
    <controls:ImageBrushConverter x:Key="brushConverter"/> 
    </Grid.Resources> 
    <Rectangle 
    x:Name="ImageForeground" 
    Height="48" 
    Width="48" 
    Fill="{TemplateBinding Foreground}" 
     DataContext="{TemplateBinding Image}" 
     OpacityMask="{Binding Converter={StaticResource brushConverter}}"> 
    </Rectangle> 
</Grid> 

明らかではありません...私はこれをしなければならない私のテンプレートの画像ブラシとしての私のイメージのDependencyPropertyをバインドするが、それはトリックをした、これは私のために多くのことを解決しました。おかげで助け

+0

最後にうまくいけばうれしいよ:) –

+0

あなたのソリューションを追加してくれてありがとう、それはまさに私が必要だったものでした! – RajenK

0

別のアプローチが、コンバータ

<Grid> 
<Rectangle x:Name="ImageForeground" DataContext="{TemplateBinding Image}" Height="48" Width="48" 
     Fill="{TemplateBinding Foreground}" > 
    <Rectangle.OpacityMask> 
     <ImageBrush Stretch="Fill" ImageSource="{Binding DataContext , RelativeSource={RelativeSource AncestorType=Rectangle}}"/> 
    </Rectangle.OpacityMask> 
</Rectangle> 

//あるいは

<Rectangle DataContext="{TemplateBinding IconVisual}" x:Name="Icon" RadiusX="2" RadiusY="2" StrokeThickness="1" Margin="{TemplateBinding Padding}" Fill="{TemplateBinding Foreground}" Stroke="{TemplateBinding Foreground}" > 
           <Rectangle.OpacityMask> 
            <VisualBrush Visual="{Binding DataContext , RelativeSource={RelativeSource AncestorType=Rectangle}}" Stretch="Uniform" /> 
           </Rectangle.OpacityMask> 
          </Rectangle> 
+0

Windows Phone Silverlightに「AncestorType」バインディングがないため、この回答は役に立ちません。 – McGarnagle

0

それとも、コントロールの著者であるならば、OnApplyTemplateは、視覚的なブラシを見つけることを必要とせずに用そのテンプレートの値を設定します。

public override void OnApplyTemplate() 
{ 
    base.OnApplyTemplate(); 

    VisualBrush oVBrushBack = (VisualBrush)this.Template.FindName("rectVisual", this); 

    oVBrushBack.Visual = this.IconVisual; 
} 
+0

Silverlightには「VisualBrush」がありません。これはWPFのことです。 – McGarnagle

2

TemplateBindingの代わりにRelativeSource TemplatedParentバインディングを使用できます。これは基本的には同じですが、TemplateBindingがそうでないような奇妙なケースでも機能します。

<ImageBrush 
    ImageSource="{Binding RelativeSource={RelativeSource TemplatedParent},Path=Image}" /> 
+0

元の質問に対する最も簡単な解決法。 – altso

関連する問題