消息框的 Silverlight BusyIndicator 背景颜色答案

【问题标题】：Silverlight BusyIndicator background color for the message box消息框的 Silverlight BusyIndicator 背景颜色
【发布时间】：2013-09-29 19:58:20
【问题描述】：

在 Silverlight 中，我需要 BusyIndicator 的消息框是透明的。我发现了一个同样的问题，但没有任何解决方案：

Silverlight BusyIndicator Background Colour

我的部分代码如下：

<toolkit:BusyIndicator x:Name="WorkingLayout" Height="80">
        <toolkit:BusyIndicator.BusyContent>
            <StackPanel>
                <TextBlock Text="Wait please..." HorizontalAlignment="Center"></TextBlock>
                <Button x:Name="CancelButton" HorizontalAlignment="Center" Content="Cancel" Width="100" Click="CancelButton_Click" />
            </StackPanel>
        </toolkit:BusyIndicator.BusyContent>
        <!-- Rest of component code -->
</toolkit:BusyIndicator>

有没有办法让所有内容背景透明，包括包含消息的框，而不是默认的灰色渐变？

我尝试像这样将属性背景设置为透明：

<toolkit:BusyIndicator x:Name="WorkingLayout" Height="80" Background="Transparent">

但它没有用。

【问题讨论】：

标签： silverlight xaml silverlight-toolkit busyindicator

【解决方案1】：

你可以得到你想要的，你只需要编辑模板以满足你的需要。在表情混合中，

右键单击忙碌指示符，选择编辑模板，编辑副本
在模板内，找到进度条，删除

如果要删除灰色框，请将 Content Presenter 向上移动到更高的网格，并删除边框对象这是我制作的一个示例 busyindicator，

        <Setter Property="HorizontalAlignment" Value="Stretch"/>
        <Setter Property="VerticalAlignment" Value="Stretch"/>
        <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
        <Setter Property="VerticalContentAlignment" Value="Stretch"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="toolkit:BusyIndicator">
                    <Grid>
                        <VisualStateManager.VisualStateGroups>
                            <VisualStateGroup x:Name="VisibilityStates">
                               <VisualState x:Name="Hidden">
                                    <Storyboard>
                                      <ObjectAnimationUsingKeyFrames BeginTime="00:00:00" Duration="00:00:00.001" Storyboard.TargetName="busycontent" Storyboard.TargetProperty="(UIElement.Visibility)">
                                           <DiscreteObjectKeyFrame KeyTime="00:00:00">
                                                <DiscreteObjectKeyFrame.Value>
                                                   <Visibility>Collapsed</Visibility>
                                               </DiscreteObjectKeyFrame.Value>
                                            </DiscreteObjectKeyFrame>
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames BeginTime="00:00:00" Duration="00:00:00.001" Storyboard.TargetName="overlay" Storyboard.TargetProperty="(UIElement.Visibility)">
                                            <DiscreteObjectKeyFrame KeyTime="00:00:00">
                                              <DiscreteObjectKeyFrame.Value>
                                                    <Visibility>Collapsed</Visibility>
                                                </DiscreteObjectKeyFrame.Value>
                                            </DiscreteObjectKeyFrame>
                                        </ObjectAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>
                                <VisualState x:Name="Visible">
                                    <Storyboard>
                                       <ObjectAnimationUsingKeyFrames BeginTime="00:00:00" Duration="00:00:00.001" Storyboard.TargetName="busycontent" Storyboard.TargetProperty="(UIElement.Visibility)">
                                            <DiscreteObjectKeyFrame KeyTime="00:00:00">
                                                <DiscreteObjectKeyFrame.Value>
                                                    <Visibility>Visible</Visibility>
                                                </DiscreteObjectKeyFrame.Value>
                                           </DiscreteObjectKeyFrame>
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames BeginTime="00:00:00" Duration="00:00:00.001" Storyboard.TargetName="overlay" Storyboard.TargetProperty="(UIElement.Visibility)">
                                            <DiscreteObjectKeyFrame KeyTime="00:00:00">
                                                <DiscreteObjectKeyFrame.Value>
                                                    <Visibility>Visible</Visibility>
                                               </DiscreteObjectKeyFrame.Value>
                                           </DiscreteObjectKeyFrame>
                                        </ObjectAnimationUsingKeyFrames>
                                       <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="ellipse" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[2].(RotateTransform.Angle)" RepeatBehavior="Forever">
                                           <EasingDoubleKeyFrame KeyTime="00:00:00" Value="0"/>
                                            <EasingDoubleKeyFrame KeyTime="00:00:01" Value="360"/>
                                        </DoubleAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>
                           </VisualStateGroup>
                            <VisualStateGroup x:Name="BusyStatusStates">
                                <VisualState x:Name="Idle">
                                    <Storyboard>
                                        <ObjectAnimationUsingKeyFrames BeginTime="00:00:00" Duration="00:00:00.001" Storyboard.TargetName="content" Storyboard.TargetProperty="(Control.IsEnabled)">
                                           <DiscreteObjectKeyFrame KeyTime="00:00:00">
                                                <DiscreteObjectKeyFrame.Value>
                                                    <System:Boolean>True</System:Boolean>
                                                </DiscreteObjectKeyFrame.Value>
                                            </DiscreteObjectKeyFrame>
                                        </ObjectAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>
                                <VisualState x:Name="Busy">
                                   <Storyboard>
                                        <ObjectAnimationUsingKeyFrames BeginTime="00:00:00" Duration="00:00:00.001" Storyboard.TargetName="content" Storyboard.TargetProperty="(Control.IsEnabled)">
                                           <DiscreteObjectKeyFrame KeyTime="00:00:00">
                                               <DiscreteObjectKeyFrame.Value>
                                                    <System:Boolean>False</System:Boolean>
                                                </DiscreteObjectKeyFrame.Value>
                                            </DiscreteObjectKeyFrame>
                                       </ObjectAnimationUsingKeyFrames>
                                    </Storyboard>
                              </VisualState>
                            </VisualStateGroup>
                        </VisualStateManager.VisualStateGroups>
                        <ContentControl x:Name="content" HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}" Content="{TemplateBinding Content}" ContentTemplate="{TemplateBinding ContentTemplate}"/>
                        <Rectangle x:Name="overlay" Style="{TemplateBinding OverlayStyle}"/>
                        <ContentPresenter x:Name="busycontent">
                            <Grid HorizontalAlignment="Center" VerticalAlignment="Center">
                                <Ellipse x:Name="ellipse" Margin="-13,-46,-15,-44" StrokeThickness="15" RenderTransformOrigin="0.5,0.5">
                                    <Ellipse.RenderTransform>
                                        <TransformGroup>
                                            <ScaleTransform/>
                                            <SkewTransform/>
                                            <RotateTransform/>
                                            <TranslateTransform/>
                                        </TransformGroup>
                                    </Ellipse.RenderTransform>
                                    <Ellipse.Stroke>
                                        <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                                           <GradientStop Color="Black" Offset="0"/>
                                            <GradientStop Color="Transparent" Offset="0.94"/>
                                        </LinearGradientBrush>
                                    </Ellipse.Stroke>
                                </Ellipse>
                                <ContentPresenter Margin="8,8,12,8" Content="{TemplateBinding BusyContent}" ContentTemplate="{TemplateBinding BusyContentTemplate}"/>
                            </Grid>
                        </ContentPresenter>
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
</UserControl.Resources>
<Grid x:Name="LayoutRoot" Background="White">
    <toolkit:BusyIndicator Background="Transparent" Style="{StaticResource BusyIndicatorStyle1}" BorderThickness="0" x:Name="WorkingLayout" Height="80" Margin="65,110,123,110">
        <!--<toolkit:BusyIndicator.OverlayStyle>
            <Style TargetType="Rectangle">
                <Setter Property="Fill" Value="White"/>
                <Setter Property="Opacity" Value="0.5"/>
            </Style>
        </toolkit:BusyIndicator.OverlayStyle>-->
        <toolkit:BusyIndicator.BusyContent>
            <StackPanel>
                <TextBlock Text="Wait please..." HorizontalAlignment="Center"></TextBlock>
                <Button x:Name="CancelButton" HorizontalAlignment="Center" Content="Cancel" Width="100"  />
            </StackPanel>
        </toolkit:BusyIndicator.BusyContent>
        <!-- Rest of component code -->
    </toolkit:BusyIndicator>


</Grid>

【讨论】：

谢谢，我使用这种方法来自定义 BusyIndicator 的宽度和高度。
你还在使用 silverlight 真的很棒

【解决方案2】：

将堆栈面板背景更改为透明。

【讨论】：

我将 Background 属性添加到 StackPanel 控件 (<StackPanel Background="Transparent">) 但没有任何改变。
在 Blend 中为忙碌指示器创建样式副本并修改样式以满足您的需要。 @LeoGC