Question

我有一个带有2列网格的窗口。左列包含浏览器控件

我想展示一个小窗口或什么东西来展示该网页仍在加载。

我怎么能这样做？我可以在第二列中有一个浮动窗口在浏览器前显示???请解释一下怎么样？

马尔科姆

感谢bendwey就像一个魅力。只有事情找不到我可以使用的GIF，它会显示叠加的移动/旋转等内容任何想法在哪里？

Answer 1

我完成此操作的方法是使用公开的Show（）和Hide（）方法创建用户控件。下面是代码。 Loading.xaml：

<UserControl x:Class="UK.Budgeting.XBAP.Loading"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Height="200">
  <UserControl.Resources>
    <Color x:Key="FilledColor" A="255" B="155" R="155" G="155"/>
    <Color x:Key="UnfilledColor" A="0" B="155" R="155" G="155"/>

    <Storyboard x:Key="Animation0" FillBehavior="Stop" BeginTime="00:00:00.0" RepeatBehavior="Forever">
      <ColorAnimationUsingKeyFrames Storyboard.TargetName="_00" Storyboard.TargetProperty="(Shape.Fill).(SolidColorBrush.Color)">
        <SplineColorKeyFrame KeyTime="00:00:00.0" Value="{StaticResource FilledColor}"/>
        <SplineColorKeyFrame KeyTime="00:00:01.6" Value="{StaticResource UnfilledColor}"/>
      </ColorAnimationUsingKeyFrames>
    </Storyboard>

    <Storyboard x:Key="Animation1" BeginTime="00:00:00.2" RepeatBehavior="Forever">
      <ColorAnimationUsingKeyFrames Storyboard.TargetName="_01" Storyboard.TargetProperty="(Shape.Fill).(SolidColorBrush.Color)">
        <SplineColorKeyFrame KeyTime="00:00:00.0" Value="{StaticResource FilledColor}"/>
        <SplineColorKeyFrame KeyTime="00:00:01.6" Value="{StaticResource UnfilledColor}"/>
      </ColorAnimationUsingKeyFrames>
    </Storyboard>

    <Storyboard x:Key="Animation2" BeginTime="00:00:00.4" RepeatBehavior="Forever">
      <ColorAnimationUsingKeyFrames Storyboard.TargetName="_02" Storyboard.TargetProperty="(Shape.Fill).(SolidColorBrush.Color)">
        <SplineColorKeyFrame KeyTime="00:00:00.0" Value="{StaticResource FilledColor}"/>
        <SplineColorKeyFrame KeyTime="00:00:01.6" Value="{StaticResource UnfilledColor}"/>
      </ColorAnimationUsingKeyFrames>
    </Storyboard>

    <Storyboard x:Key="Animation3" BeginTime="00:00:00.6" RepeatBehavior="Forever">
      <ColorAnimationUsingKeyFrames Storyboard.TargetName="_03" Storyboard.TargetProperty="(Shape.Fill).(SolidColorBrush.Color)">
        <SplineColorKeyFrame KeyTime="00:00:00.0" Value="{StaticResource FilledColor}"/>
        <SplineColorKeyFrame KeyTime="00:00:01.6" Value="{StaticResource UnfilledColor}"/>
      </ColorAnimationUsingKeyFrames>
    </Storyboard>

    <Storyboard x:Key="Animation4" BeginTime="00:00:00.8" RepeatBehavior="Forever">
      <ColorAnimationUsingKeyFrames Storyboard.TargetName="_04" Storyboard.TargetProperty="(Shape.Fill).(SolidColorBrush.Color)">
        <SplineColorKeyFrame KeyTime="00:00:00.0" Value="{StaticResource FilledColor}"/>
        <SplineColorKeyFrame KeyTime="00:00:01.6" Value="{StaticResource UnfilledColor}"/>
      </ColorAnimationUsingKeyFrames>
    </Storyboard>

    <Storyboard x:Key="Animation5" BeginTime="00:00:01.0" RepeatBehavior="Forever">
      <ColorAnimationUsingKeyFrames Storyboard.TargetName="_05" Storyboard.TargetProperty="(Shape.Fill).(SolidColorBrush.Color)">
        <SplineColorKeyFrame KeyTime="00:00:00.0" Value="{StaticResource FilledColor}"/>
        <SplineColorKeyFrame KeyTime="00:00:01.6" Value="{StaticResource UnfilledColor}"/>
      </ColorAnimationUsingKeyFrames>
    </Storyboard>

    <Storyboard x:Key="Animation6" BeginTime="00:00:01.2" RepeatBehavior="Forever">
      <ColorAnimationUsingKeyFrames Storyboard.TargetName="_06" Storyboard.TargetProperty="(Shape.Fill).(SolidColorBrush.Color)">
        <SplineColorKeyFrame KeyTime="00:00:00.0" Value="{StaticResource FilledColor}"/>
        <SplineColorKeyFrame KeyTime="00:00:01.6" Value="{StaticResource UnfilledColor}"/>
      </ColorAnimationUsingKeyFrames>
    </Storyboard>

    <Storyboard x:Key="Animation7" BeginTime="00:00:01.4" RepeatBehavior="Forever">
      <ColorAnimationUsingKeyFrames Storyboard.TargetName="_07" Storyboard.TargetProperty="(Shape.Fill).(SolidColorBrush.Color)">
        <SplineColorKeyFrame KeyTime="00:00:00.0" Value="{StaticResource FilledColor}"/>
        <SplineColorKeyFrame KeyTime="00:00:01.6" Value="{StaticResource UnfilledColor}"/>
      </ColorAnimationUsingKeyFrames>
    </Storyboard>
  </UserControl.Resources>

  <UserControl.Triggers>
    <EventTrigger RoutedEvent="FrameworkElement.Loaded">
      <BeginStoryboard Storyboard="{StaticResource Animation0}"/>
      <BeginStoryboard Storyboard="{StaticResource Animation1}"/>
      <BeginStoryboard Storyboard="{StaticResource Animation2}"/>
      <BeginStoryboard Storyboard="{StaticResource Animation3}"/>
      <BeginStoryboard Storyboard="{StaticResource Animation4}"/>
      <BeginStoryboard Storyboard="{StaticResource Animation5}"/>
      <BeginStoryboard Storyboard="{StaticResource Animation6}"/>
      <BeginStoryboard Storyboard="{StaticResource Animation7}"/>
    </EventTrigger>
  </UserControl.Triggers>

  <Grid>
    <Grid.RowDefinitions>
      <RowDefinition Height="*"/>
      <RowDefinition Height="100"/>
      <RowDefinition Height="*"/>
    </Grid.RowDefinitions>
    <Grid.ColumnDefinitions>
      <ColumnDefinition Width="*"/>
      <ColumnDefinition Width="Auto"/>
      <ColumnDefinition Width="*"/>
    </Grid.ColumnDefinitions>
    <Canvas Grid.Row="1" Grid.Column="1" Height="105" Width="105">
      <Canvas.Resources>
        <Style TargetType="Ellipse">
          <Setter Property="Width" Value="15"/>
          <Setter Property="Height" Value="15" />
          <Setter Property="Fill" Value="#FFFFFFFF" />
        </Style>
      </Canvas.Resources>
      <Ellipse x:Name="_00" Canvas.Left="24.75" Canvas.Top="50"/>
      <Ellipse x:Name="_01" Canvas.Top="36" Canvas.Left="29.5"/>
      <Ellipse x:Name="_02" Canvas.Left="43.5" Canvas.Top="29.75"/>
      <Ellipse x:Name="_03" Canvas.Left="57.75" Canvas.Top="35.75"/>
      <Ellipse x:Name="_04" Canvas.Left="63.5" Canvas.Top="49.75" />
      <Ellipse x:Name="_05" Canvas.Left="57.75" Canvas.Top="63.5"/>
      <Ellipse x:Name="_06" Canvas.Left="43.75" Canvas.Top="68.75"/>
      <Ellipse x:Name="_07" Canvas.Top="63.25" Canvas.Left="30" />
      <Ellipse Stroke="{x:Null}" Width="39.5" Height="39.5" Canvas.Left="31.75" Canvas.Top="37" Fill="{x:Null}"/>
    </Canvas>
    <TextBlock Grid.Row="2" Grid.Column="0" Grid.ColumnSpan="3" Foreground="#AAA" TextAlignment="Center" FontSize="15" Text="{Binding Source={StaticResource Model}, Path=StatusMessage}"/>
  </Grid>

</UserControl>

Loading.xaml.cs：

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Shapes;

namespace UK.Budgeting.XBAP
{
    /// <summary>
    /// Interaction logic for Loading.xaml
    /// </summary>
    public partial class Loading : UserControl
    {
        public Loading()
        {
            InitializeComponent();
        }
        public void Show()
        {
            this.Visibility = Visibility.Visible;
        }
        public void Hide()
        {
            this.Visibility = Visibility.Hidden;
        }
    }
}

要使用，请在主页中进行参考：

<local:Loading x:Name="LoadingAnimation" Visibility="Hidden" />

并从代码致电：

LoadingAnimation.Show();
LoadingAnimation.Hide();

Answer 2

通过显示“小窗口”，我不确定你的意思。你的意思是一个弹出窗口或一个显示在浏览器顶部的元素，如叠加层。如果您指的是overlay元素，则可以使用webbrowser Navigating和LoadCompleted事件来显示和隐藏元素。

有很多方法可以定位依赖于父控件的元素。如果您正在使用网格控件，那么只需将加载元素放在浏览器控件下面，它就会在可见时显示在顶部。

在覆盖控件时要注意几点。只是将不透明度更改为0将不起作用，您需要将visiblity设置为隐藏，否则您的浏览器控件上的事件将不会触发。另请注意，如果您使用动画设置要淡出/淡出的属性，则必须将其清除。请参阅Josh Smiths post。

回复时只需修改原始帖子。您可能需要考虑添加XAML以帮助解释您的计划。

Answer 3

我找到了一位gif创作者。

唯一的事情是浏览器加载时gif不会移动。

我猜这是一些线程问题。

你会怎么做？

Answer 4

感谢您的帖子。

我意识到我当然不需要GIF只是一个WPF动画。

所以我只是在带有我发现的gif的图像上做了一个rotatetransform。

像魅力一样工作

WPF - 如何显示Web浏览器控件的加载消息

4 个答案: