10

私が作成しているボタンのコントロールテンプレートで、最近流行の「反射」効果を複製しようとしています。

基本的な考え方は、白から透明へのグラデーション塗りつぶしで四角形を作成し、その半透明の四角形の一部をrectanglegeometryで切り取ることです。

問題は、相対的な長方形のジオメトリを定義する方法がわからないことです。大きな値(1000)を定義することで幅を回避しましたが、高さが問題です。たとえば、高さが 200 のボタンには適していますが、小さいボタンには効果がありません。

何か案は?

            <Rectangle RadiusX="5" RadiusY="5" StrokeThickness="1" Stroke="Transparent">
                <Rectangle.Fill>
                    <LinearGradientBrush StartPoint="0,0" EndPoint="0,0.55">
                        <GradientStop Color="#66ffffff" Offset="0.0"  />
                        <GradientStop Color="Transparent" Offset="1.0" />
                    </LinearGradientBrush>
                </Rectangle.Fill>
                <Rectangle.Clip>
                    <RectangleGeometry Rect="0,0,1000,60" />
                </Rectangle.Clip>
            </Rectangle>
4

1 に答える 1

11

MultiBindingあなたはと新しいでこれを行うことができますIMultiValueConverter

public class RectangleConverter : IMultiValueConverter
{
    public object Convert(object[] values, Type targetType, object parameter, CultureInfo culture)
{
        // you can pass in the value to divide by if you want
        return new Rect(0, 0, (double)values[0], (double)values[1] / 3.33);
    }

    public object[] ConvertBack(object value, Type[] targetTypes, object parameter, CultureInfo culture)
    {
        throw new NotSupportedException();
    }
}

そして、XAMLでそのように使用されます:

<lcl:RectangleConverter x:Key="rectConverter" />

...

<RectangleGeometry>
    <RectangleGeometry.Rect>
        <MultiBinding Converter="{StaticResource rectConverter}">
            <Binding Path="ActualWidth" RelativeSource="{RelativeSource AncestorType={x:Type Button}}" />
            <Binding Path="ActualHeight" RelativeSource="{RelativeSource AncestorType={x:Type Button}}" />
        </MultiBinding>
    </RectangleGeometry.Rect>
</RectangleGeometry>
于 2010-03-24T20:54:28.390 に答える