[WPF] 화면이동 프레임

버튼 클릭시 페이지 이동을 하도록 만들어보겠습니다.

 

먼저 Views 폴더를 만들고 페이지 3개를 만듭니다. 

 

MainWindow.xaml

<Window x:Class="Wpf화면이동프레임.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"
        xmlns:local="clr-namespace:Wpf화면이동프레임"
        mc:Ignorable="d"
        Title="MainWindow" Height="450" Width="800">
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="1*"/>
            <RowDefinition Height="5*"/>
        </Grid.RowDefinitions>
        <StackPanel Orientation="Horizontal" HorizontalAlignment="Center">
            <Button FontSize="20" Name="back" Click="back_Click">&lt;</Button>
            <Button FontSize="20" x:Name="forward" Click="forward_Click">&gt;</Button>
        </StackPanel>
        <!--NavigationUIVisibility=Hidden은 자동으로 생기는 뒤로가기 앞으로가기 버튼을 숨김-->
        <Frame Name ="frm" Grid.Row="1" Source="/Views/Page1.xaml" NavigationUIVisibility="Hidden"></Frame>
    </Grid>
</Window>

 

MainWindow.cs

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.Navigation;
using System.Windows.Shapes;

namespace Wpf화면이동프레임
{
    /// <summary>
    /// Interaction logic for MainWindow.xaml
    /// </summary>
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
        }

        private void back_Click(object sender, RoutedEventArgs e)
        {
            if(frm.NavigationService.CanGoBack) frm.NavigationService.GoBack();
        }

        private void forward_Click(object sender, RoutedEventArgs e)
        {
            if(frm.NavigationService.CanGoForward)frm.NavigationService.GoForward();
        }
    }
}

 

Page1.xaml

<Page x:Class="Wpf화면이동프레임.Views.Page1"
      xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
      xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
      xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
      xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
      xmlns:local="clr-namespace:Wpf화면이동프레임.Views"
      mc:Ignorable="d" 
      d:DesignHeight="450" d:DesignWidth="800"
      Title="Page1" Background="Orange">

    <StackPanel>
        <Label FontSize="20">페이지1</Label>
        <Button Click="Button_Click">이동</Button>
    </StackPanel>
</Page>

 

Page1.cs

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
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.Navigation;
using System.Windows.Shapes;

namespace Wpf화면이동프레임.Views
{
    /// <summary>
    /// Page1.xaml에 대한 상호 작용 논리
    /// </summary>
    public partial class Page1 : Page
    {
        public Page1()
        {
            InitializeComponent();
        }

        private void Button_Click(object sender, RoutedEventArgs e)
        {
            Page2 page2 = new Page2();
            NavigationService.Navigate(page2);
        }
    }
}

 

Page2.xaml

<Page x:Class="Wpf화면이동프레임.Views.Page2"
      xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
      xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
      xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
      xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
      xmlns:local="clr-namespace:Wpf화면이동프레임.Views"
      mc:Ignorable="d" 
      d:DesignHeight="450" d:DesignWidth="800"
      Title="Page2" Background="LightBlue">

    <StackPanel>
        <Label FontSize="20">페이지2</Label>
        <Button Click="Button_Click">이동</Button>
    </StackPanel>
</Page>

 

Page2.cs

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
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.Navigation;
using System.Windows.Shapes;

namespace Wpf화면이동프레임.Views
{
    /// <summary>
    /// Page2.xaml에 대한 상호 작용 논리
    /// </summary>
    public partial class Page2 : Page
    {
        public Page2()
        {
            InitializeComponent();
        }

        private void Button_Click(object sender, RoutedEventArgs e)
        {
            Page3 page3 = new Page3();
            NavigationService.Navigate(page3);
        }
    }
}

 

Page3.xaml

<Page x:Class="Wpf화면이동프레임.Views.Page3"
      xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
      xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
      xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
      xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
      xmlns:local="clr-namespace:Wpf화면이동프레임.Views"
      mc:Ignorable="d" 
      d:DesignHeight="450" d:DesignWidth="800"
      Title="Page3" Background="Green">

    <StackPanel>
        <Label FontSize="20">페이지3</Label>
        <Button Click="Button_Click">첫화면</Button>
    </StackPanel>
</Page>

 

Page3.cs

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
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.Navigation;
using System.Windows.Shapes;

namespace Wpf화면이동프레임.Views
{
    /// <summary>
    /// Page3.xaml에 대한 상호 작용 논리
    /// </summary>
    public partial class Page3 : Page
    {
        public Page3()
        {
            InitializeComponent();
        }

        private void Button_Click(object sender, RoutedEventArgs e)
        {
            Page1 page1 = new Page1();
            NavigationService.Navigate(page1);
        }
    }
}

 

실행화면

 

첫화면

 

이동버튼 누를 때 Page1 → Page2로 이동

 

이동버튼을 한번 더 누를 때 Page2 → Page3로 이동

 

이동버튼을 한번 더 누를때 Page3 → Page1로 이동

 

위의 <,> 버튼은 뒤로가기 앞으로 가기 기능을 합니다.