2

在我的 WP8 应用程序中，我想制作颜色反转效果。我不知道我应该使用什么工具，所以我只会用非常笼统的术语解释我想要什么。

它应该如何工作：假设我有一个UserControl由黑色矩形和顶部的一些白色文本组成的。我想对那个用户控件应用一些东西UserControl，它会反转它所覆盖的一部分的颜色。一些跨越 50%UserControl且在该区域中的不可见矩形背景将是白色，文本将是黑色。我希望它是动态的，所以我可以在运行时更改它覆盖的区域。

这是一张图片来说明这一点：
在此处输入图像描述

反转效果应用于一半的控制。

我相信可以通过使用具有相同文本、反转颜色和不透明蒙版的两个控件来实现这一点，但我想知道这是否可以以更干净和直接的方式完成？

4

1 回答 1

5

我认为理想情况下您要寻找的要么是两个TextBlocks，要么OpacityMask应用于顶部的一个；

<Grid MaxWidth="100">
    <TextBlock Text="Hey check it out we can change object gradients! yay!" Foreground="Red"
               TextWrapping="Wrap" HorizontalAlignment="Center" VerticalAlignment="Center"/>
    <TextBlock Text="Hey check it out we can change object gradients! yay!" Foreground="Blue"
               TextWrapping="Wrap" HorizontalAlignment="Center" VerticalAlignment="Center">
             <TextBlock.OpacityMask>
                 <LinearGradientBrush StartPoint="0.1,0.1" EndPoint="0.75,0.75">
                  <LinearGradientBrush.GradientStops>
                    <GradientStop Offset="0.322" Color="Black"/>
                    <GradientStop Offset="0.739" Color="Transparent"/>
                  </LinearGradientBrush.GradientStops>
                </LinearGradientBrush>
            </TextBlock.OpacityMask>
    </TextBlock>               
</Grid>

或者您可以直接将 a 应用于LinearGradientBrush（Foreground或Background其他元素）本身，例如；

<Border Width="100" Height="50">
        <Border.Background>
                <LinearGradientBrush StartPoint="0.062,0.552" EndPoint="0.835,0.548">
                  <LinearGradientBrush.GradientStops>
                    <GradientStop Offset="0.5" Color="White"/>
                    <GradientStop Offset="0.5" Color="Black"/>
                  </LinearGradientBrush.GradientStops>
                </LinearGradientBrush>
            </Border.Background>

        <TextBlock Text="Hello World!" HorizontalAlignment="Center" VerticalAlignment="Center">
            <TextBlock.Foreground>
                <LinearGradientBrush StartPoint="0.1,0.1" EndPoint="0.75,0.75">
                  <LinearGradientBrush.GradientStops>
                    <GradientStop Offset="0.5" Color="Black"/>
                    <GradientStop Offset="0.5" Color="White"/>
                  </LinearGradientBrush.GradientStops>
                </LinearGradientBrush>
            </TextBlock.Foreground>
        </TextBlock>

    </Border>

或开始 80 年代风格的幻想；

<Border Width="100" Height="50">
        <Border.Background>
                <LinearGradientBrush StartPoint="0.472,0.047" EndPoint="0.47,0.942">
                  <LinearGradientBrush.GradientStops>
                    <GradientStop Offset="0.541" Color="White"/>
                    <GradientStop Offset="0.548" Color="Black"/>
                  </LinearGradientBrush.GradientStops>
                </LinearGradientBrush>
            </Border.Background>

            <TextBlock Text="Hello World!" HorizontalAlignment="Center" VerticalAlignment="Center">
                <TextBlock.Foreground>
                    <LinearGradientBrush StartPoint="0.472,0.047" EndPoint="0.47,0.942">
                      <LinearGradientBrush.GradientStops>
                        <GradientStop Offset="0.631" Color="Black"/>
                        <GradientStop Offset="0.635" Color="White"/>
                      </LinearGradientBrush.GradientStops>
                    </LinearGradientBrush>
                </TextBlock.Foreground>
            </TextBlock>

    </Border>

试一试，希望这会有所帮助。

于 2013-01-16T19:52:30.467 回答