0

我正在尝试为我的应用程序制作动画启动画面。我有我的 MainPage,我在其中显示了一个 Popup,它有一个动画和一个文本块。我想更改文本块的文本以显示加载状态,但无法更改。有任何想法吗?

主页代码

namespace animatedsplash
{
    public partial class MainPage : PhoneApplicationPage
    {
        BackgroundWorker preloader;
        Popup splashPop;

        public MainPage()
        {
            InitializeComponent();
            splashPop = new Popup(){IsOpen = true, Child = new Splash() };
            preloader = new BackgroundWorker();
            RunPreloader();
        }

        private void RunPreloader()
        {
            preloader.DoWork += ((s, args) => {
                  Thread.Sleep(10000);
                  });

            preloader.RunWorkerCompleted += ((s,args) => 
            {
                this.Dispatcher.BeginInvoke(()=> { this.splashPop.IsOpen = false; });
            });

            preloader.RunWorkerAsync();
        }
    }
}

启动 xaml

<phone:PhoneApplicationPage 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
    xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:i="clr-namespace:System.Windows.Interactivity;assembly=System.Windows.Interactivity" xmlns:ec="clr-namespace:Microsoft.Expression.Interactivity.Core;assembly=Microsoft.Expression.Interactions" xmlns:eim="clr-namespace:Microsoft.Expression.Interactivity.Media;assembly=Microsoft.Expression.Interactions"
    xmlns:local="clr-namespace:animatedsplash"
    mc:Ignorable="d" d:DesignWidth="480" d:DesignHeight="800"
    x:Class="animatedsplash.Splash"
    Orientation="Portrait"
    shell:SystemTray.IsVisible="False">
    <phone:PhoneApplicationPage.Resources>

        <Storyboard x:Name="load">
            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.Rotation)" Storyboard.TargetName="image">
                <EasingDoubleKeyFrame KeyTime="0" Value="-180"/>
                <EasingDoubleKeyFrame KeyTime="0:0:1" Value="0"/>
                <EasingDoubleKeyFrame KeyTime="0:0:2" Value="180"/>
            </DoubleAnimationUsingKeyFrames>
        </Storyboard>
    </phone:PhoneApplicationPage.Resources>

    <phone:PhoneApplicationPage.FontFamily>
        <StaticResource ResourceKey="PhoneFontFamilyNormal"/>
    </phone:PhoneApplicationPage.FontFamily>
    <phone:PhoneApplicationPage.FontSize>
        <StaticResource ResourceKey="PhoneFontSizeNormal"/>
    </phone:PhoneApplicationPage.FontSize>
    <phone:PhoneApplicationPage.Foreground>
        <StaticResource ResourceKey="PhoneForegroundBrush"/>
    </phone:PhoneApplicationPage.Foreground>
    <i:Interaction.Triggers>
        <eim:StoryboardCompletedTrigger Storyboard="{StaticResource load}">
            <eim:ControlStoryboardAction Storyboard="{StaticResource load}"/>
        </eim:StoryboardCompletedTrigger>
        <i:EventTrigger>
            <eim:ControlStoryboardAction Storyboard="{StaticResource load}"/>
        </i:EventTrigger>
    </i:Interaction.Triggers>

    <!--LayoutRoot is the root grid where all page content is placed-->
    <Grid x:Name="LayoutRoot" Background="Transparent">
        <!--TitlePanel contains the name of the application and page title--><!--ContentPanel - place additional content here-->
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>
        <Image Margin="0" Grid.Row="1" Source="/media/splashbg.jpg" Stretch="Fill" d:IsLocked="True"/>
        <Image x:Name="rotator" Margin="96,288,184,312" Grid.Row="1" Source="media/splashpin.png" Stretch="Fill" d:IsLocked="True"/>
        <Image x:Name="image" Margin="142,305,0,370" Grid.Row="1" Source="media/pinload.png" Stretch="Fill" HorizontalAlignment="Left" Width="75" RenderTransformOrigin="0.838,0.504">
            <Image.RenderTransform>
                <CompositeTransform/>
            </Image.RenderTransform>
        </Image>
        <TextBlock x:Name="preloader_percentage" Margin="178,354,0,0" Grid.Row="1" TextWrapping="Wrap" Text="100" VerticalAlignment="Top" RenderTransformOrigin="0.5,0.593" TextAlignment="Right" HorizontalAlignment="Left" Width="35" FontFamily="Segoe WP Semibold" Height="27"/>
        <TextBlock Margin="213,354,0,0" Grid.Row="1" TextWrapping="Wrap" Text="%" VerticalAlignment="Top" HorizontalAlignment="Left" Width="16" FontFamily="Segoe WP Semibold" d:IsLocked="True"/>

    </Grid>
</phone:PhoneApplicationPage>
4

1 回答 1

0

像这样的东西怎么样:

在 Splash.xaml.cs 中,您将拥有以下内容:

public string Progress
{
    get { return preloader_percentage.Text; }
    set { preloader_percentage.Text = value; }
}

在 MainWindow.xaml.cs 中,您将代码更改为如下所示:

preloader.WorkerReportsProgress = true;
preloader.ProgressChanged += (sender, e) =>
    {
        this.Dispatcher.BeginInvoke(() =>
            (this.splashPop.Child as Splash).Progress = e.ProgressPercentage.ToString());
    };

然后在您的工作方法中,您需要调用预加载器。ReportProgress()方法多次。据我所知,应该这样做。

注意:这里有很多设计地雷。我建议让这段代码正常工作,您可以稍后重构以使其更清洁、更易于维护。

于 2012-06-07T13:39:10.990 回答