C# WPF Page 만들기

간단하게 여러개의 화면을 구성하고 싶어서 유튜브를 통해 화면 구성하는 방법을 확인하였다.

1. MainWindow.xaml

NavigationUIVisibility 값을 Hidden을 하게 되면 네비게이션 바가 숨겨진다. 옵션을 확인해보자

버튼에 대한 이벤트도 생성해준다.

<Window x:Class="WpfApplication1.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:WpfApplication1"
        mc:Ignorable="d"
        Title="MainWindow" Height="350" Width="525">
    <Grid>
        <StackPanel Orientation="Horizontal" Height="35" VerticalAlignment="Top">
            <Button Content="Page1" MinWidth="100" Height="35" VerticalAlignment="Top" Click="BtnClickp1"/>
            <Button Content="Page2" MinWidth="100" Margin="10,0,0,0" Click="BtnClickp2" />
        </StackPanel>
        
        <Frame x:Name="Main" Margin="0,35,0,0" NavigationUIVisibility="Hidden"/>
    </Grid>
</Window>

 2. 솔루션에서 add->page 를 누르면 xaml 이 생성되며 2개의 페이지를 생성한다.

<Page x:Class="WpfApplication1.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:WpfApplication1"
      mc:Ignorable="d" 
      d:DesignHeight="300" d:DesignWidth="300"
      Title="Page1">

    <Grid>
        <TextBlock Text ="Page1" HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="32"/>
    </Grid>
</Page>

<Page x:Class="WpfApplication1.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:WpfApplication1"
      mc:Ignorable="d" 
      d:DesignHeight="300" d:DesignWidth="300"
      Title="Page2">

    <Grid>
        <TextBlock Text="Page2" HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="32" />
    </Grid>
</Page>

3. 메인윈도우에서 각각 페이지를 생성해준다.

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 WpfApplication1
{
    /// <summary>
    /// Interaction logic for MainWindow.xaml
    /// </summary>
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
        }
        
        private void BtnClickp1(object sender, RoutedEventArgs e)
        {
            Main.Content = new Page1();
        }
        private void BtnClickp2(object sender, RoutedEventArgs e)
        {
            Main.Content = new Page2();
        }
    }
}

4. 결과 화면

처음 실행화면

 

page1을 눌렀을때

page2를 눌렀을때