본문 바로가기
프로그래밍/UWP | WPF

[WPF] Page 이용하여 초기화면 구성하기

by 남생 namsaeng 2022. 8. 11.
반응형
  • WPF를 처음 생성하면 MainWindow.xaml이 생기게 되는데, 여기에서 multi page 전환 화면을 구현하게 되면 나중에 실행 시에 지저분한 내비게이션 아이콘이 뜨게 된다.
  • 따라서 MainPage를 따로 만들어 프로그램 런타임 시 MainWindow가 생성되는 동시에 MainPage.xaml를 소스로 호출하도록 한다.
  • MainPage에서 ChildPage들을 전환하도록 한다.

 

<MainWindow.xaml>

<Window x:Class="Restaurant.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:IEC_GUI"
        mc:Ignorable="d"
        FontSize="25"
        WindowState="Maximized"
        Title="Namsaenga Dinning Room" Height="1080" Width="1920">
    <Grid>
        
        <Frame NavigationUIVisibility="Hidden"
               Source="MainPage.xaml"/>
    </Grid>
</Window>

 

<MainPage.xaml>

<Page x:Class="Restaurant.MainPage"
      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:IEC_GUI"
      mc:Ignorable="d" 
      d:DesignHeight="450" d:DesignWidth="800"
      Title="MainPage">
    <Grid>
        <Menu VerticalAlignment="Top" >
            <MenuItem Header="Mode" >
                <MenuItem Header="Dishes" Click="Dishes_Click" />
                <MenuItem Header="Desserts" Click="Desserts_Click" />
            </MenuItem>
        </Menu>
        <Grid>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="*"/>
            </Grid.ColumnDefinitions>
            <Grid.RowDefinitions>
                <RowDefinition Height="0.02*"/>
                <RowDefinition Height="0.1*"/>
                <RowDefinition Height="*"/>
            </Grid.RowDefinitions>
            <Frame Grid.Row="1" Grid.RowSpan="2" x:Name="mode_area" Margin="0,0,0,0" HorizontalAlignment="Center" 
                   VerticalAlignment="Center" Width="1920" Height="1020" BorderThickness="0">
            </Frame>
        </Grid>
    </Grid>
   
</Page>

 

<MainPage.xaml.cs>

namespace Restaurant
{
   
    public partial class MainPage : Page
    {

        public MainPage()
        {
            InitializeComponent();
        }

        private void Dishes_Click(object sender, RoutedEventArgs e)
        {
            mode_area.Navigate(new Uri("DishesPage.xaml", UriKind.RelativeOrAbsolute));
        }

        private void Desserts_Click(object sender, RoutedEventArgs e)
        {
			mode_area.Navigate(new Uri("DessertsPage.xaml", UriKind.RelativeOrAbsolute));
        }
    }

    
}

 

<DishesPage.xaml>

<Page x:Class="Restaurant.TestPage"
      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:IEC_GUI"
      mc:Ignorable="d" 
      Title="TestPage">

    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="0.09*"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*"/>
            <ColumnDefinition Width="*"/>
        </Grid.ColumnDefinitions>
        <Border Grid.Row="0" Grid.ColumnSpan="2" VerticalAlignment="Center">
            <Grid Background="DarkBlue" Height="80">
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="*"/>
                    <ColumnDefinition Width="*"/>
                    <ColumnDefinition Width="*"/>
                    <ColumnDefinition Width="*"/>
                    <ColumnDefinition Width="*"/>
                </Grid.ColumnDefinitions>
                <Border Grid.Column="0">
                    <Button x:Name="menu_0" Content="Chicken" FontSize="40" Foreground="Silver" Background="DarkBlue" BorderBrush="DarkBlue" FontWeight="Bold" HorizontalAlignment="Center" Click="menu_0_Click"/>
                </Border>
                <Border Grid.Column="1">
                    <Button x:Name="menu_1" Content="Pizza" FontSize="40"  Foreground="Silver" Background="DarkBlue" BorderBrush="DarkBlue" FontWeight="Bold" HorizontalAlignment="Center" Click="menu_1_Click"/>
                </Border>
                <Border Grid.Column="2">
                    <Button x:Name="menu_2" Content="Pasta" FontSize="40"  Foreground="Silver" Background="DarkBlue" BorderBrush="DarkBlue" FontWeight="Bold" HorizontalAlignment="Center" Click="menu_2_Click"/>
                </Border>
                <Border Grid.Column="3">
                    <Button x:Name="menu_3" Content="Kimchi" FontSize="40"  Foreground="Silver" Background="DarkBlue" BorderBrush="DarkBlue" FontWeight="Bold" HorizontalAlignment="Center" Click="menu_3_Click"/>
                </Border>
                <Border Grid.Column="4">
                    <Button x:Name="menu_4" Content="Cheese" FontSize="40"  Foreground="Silver" Background="DarkBlue" BorderBrush="DarkBlue" FontWeight="Bold" HorizontalAlignment="Center" Click="menu_4_Click"/>
                 </Border>
            </Grid>
        </Border>
        <Frame x:Name="main_view" Grid.Row="1" Grid.Column="0" BorderBrush="Aqua" BorderThickness="2">
        </Frame>
    </Grid>
</Page>

 

<DishesPage.xaml.cs>

namespace Restaurant
{
    public partial class DishesPage : Page
    {
        public TestPage()
        {
            InitializeComponent();
        }

        private void menu_0_Click(object sender, RoutedEventArgs e)
        {
            this.main_view.Navigate(new Uri("Chicken.xaml", UriKind.RelativeOrAbsolute));
        }

        private void menu_1_Click(object sender, RoutedEventArgs e)
        {
			this.main_view.Navigate(new Uri("Pizza.xaml", UriKind.RelativeOrAbsolute));
        }

        private void menu_2_Click(object sender, RoutedEventArgs e)
        {
			this.main_view.Navigate(new Uri("Pasta.xaml", UriKind.RelativeOrAbsolute));
        }

        private void menu_3_Click(object sender, RoutedEventArgs e)
        {
			this.main_view.Navigate(new Uri("Kimchi.xaml", UriKind.RelativeOrAbsolute));
        }

        private void menu_4_Click(object sender, RoutedEventArgs e)
        {
			this.main_view.Navigate(new Uri("Cheese.xaml", UriKind.RelativeOrAbsolute));
        }
    }
}

 

<Pizza.xaml>

<Page x:Class="Restaurant.Pizza"
      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:IEC_GUI"
      mc:Ignorable="d" 
      d:DesignHeight="450" d:DesignWidth="800"
      Title="Pizza">

    <Grid>
        <Grid.Background>
            <ImageBrush ImageSource="/images/pizza.jpg"/>
        </Grid.Background>
    </Grid>
</Page>

 

 

WPF choose sub page
WPF choose sub page

반응형

댓글