Home > OS >  How to make an expanding form using WPF framework on visual studio?
How to make an expanding form using WPF framework on visual studio?

Time:03-01

So on the opening of my application I want it to go from a tiny little box to its normal size.

Here is an example video: https://youtu.be/HIhuGGgRSuc

I'm new to wpf mainly the xaml part so im kinda stuck on what to do.

CodePudding user response:

I have made a small sample using the story board. In XAML I did the following:

  1. Named my MainWindow and Grid.

  2. Set the following properties on my Main Window:

    • Width and Height = Auto

    • SizeToContent = WidthAndHeight

    • WindowStartUpLocation = CenterScreen

    • WindowStyle = None

  3. Set the animation codes under Windows.Resources.

Here are the XAML codes:

<Window x:Name="MainWin" x:Class="Window_Animation_Sample.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    Title="MainWindow" Width="Auto" Height="Auto" SizeToContent="WidthAndHeight" WindowStartupLocation="CenterScreen" WindowStyle="None">
<Window.Resources>
    <Storyboard x:Key="ExpandingAnimation">
        <DoubleAnimationUsingKeyFrames Storyboard.TargetName="ExpandingGrid" Storyboard.TargetProperty="(FrameworkElement.Height)">
            <EasingDoubleKeyFrame KeyTime="00:00:00" Value="0"></EasingDoubleKeyFrame>
            <EasingDoubleKeyFrame KeyTime="00:00:01" Value="0"></EasingDoubleKeyFrame>
            <EasingDoubleKeyFrame KeyTime="00:00:05" Value="400"></EasingDoubleKeyFrame>
        </DoubleAnimationUsingKeyFrames>
    </Storyboard>
</Window.Resources>

<Grid x:Name="ExpandingGrid">
    <MediaElement Width="800" Height="400"/>
</Grid>

Here are the C# codes:

using System.Windows;
using System.Windows.Media.Animation;

namespace Window_Animation_Sample
{
    /// <summary>
    /// Interaction logic for MainWindow.xaml
    /// </summary>
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
            Storyboard ExpandingAnime = (Storyboard)TryFindResource("ExpandingAnimation");
            ExpandingAnime.Begin();
        }
    }
}
  • Related