XAML将渐变淡化效果应用于容器的内容

时间:2016-06-23 14:09:55

标签: c# xaml windows-10-universal uwp-xaml

XAML 中是否有办法使容器的所有内容逐渐淡出?例如,假设我们有<StackPanel>并且它包含多个<TextBlock>元素...我希望所有.Foreground值都采用应用的渐变。

<StackPanel>
    <StackPanel Orientation="Horizontal" HorizontalAlignment="Right">
        <TextBlock Text="Tue" />
    </StackPanel>
    <StackPanel Orientation="Horizontal" HorizontalAlignment="Right">
        <TextBlock Text="Wed" />
    </StackPanel>
    <StackPanel Orientation="Horizontal" HorizontalAlignment="Right">
        <TextBlock Text="Thu" />
    </StackPanel>
    <StackPanel Orientation="Horizontal" HorizontalAlignment="Right">
        <TextBlock Text="Fri" />
     </StackPanel>
     <StackPanel Orientation="Horizontal" HorizontalAlignment="Right">
        <TextBlock Text="Sat" />
     </StackPanel>
</StackPanel>

我希望文本块的文本值从顶部的白色渐变到透明。我想要对每个人<LinearGradientBrush>应用<TextBlock.Foreground>,我也不想应用.Background渐变。

1 个答案:

答案 0 :(得分:0)

我不认为这是可能的,但是现在一切都可以伪造它,只要没有图片作为背景,而是可绑定的颜色。您可以创建一个矩形,它将与您当前的堆栈面板重叠,您可以绑定您的背景颜色并使用它来伪造transperent控件。以下是如何做到这一点的示例。

  <Page
    x:Class="App1.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:App1"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d">

    <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
        <StackPanel>
            <StackPanel HorizontalAlignment="Left" Orientation="Horizontal">
                <TextBlock Text="Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque dolor." />
            </StackPanel>
            <StackPanel HorizontalAlignment="Left" Orientation="Horizontal">
                <TextBlock Text="Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque dolor." />
            </StackPanel>
            <StackPanel HorizontalAlignment="Left" Orientation="Horizontal">
                <TextBlock Text="Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque dolor." />
            </StackPanel>
            <StackPanel HorizontalAlignment="Left" Orientation="Horizontal">
                <TextBlock Text="Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque dolor." />
            </StackPanel>
            <StackPanel HorizontalAlignment="Left" Orientation="Horizontal">
                <TextBlock Text="Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque dolor." />
            </StackPanel>
        </StackPanel>
        <Rectangle>
            <Rectangle.Fill>
                <LinearGradientBrush StartPoint="0,0" EndPoint="0.5,0.5">
                    <GradientStop Offset="0" Color="Transparent" />
                    <GradientStop Offset="0.5" Color="White" />
                </LinearGradientBrush>
            </Rectangle.Fill>
        </Rectangle>
    </Grid>
</Page>

其他替代方案是使用转换器,但您必须将相同的转换器应用于每个控件。希望这会有所帮助。

修改

这不是你想要的,或者我不明白这个问题?

enter image description here