WPF 탐색을위한 Window vs Page vs UserControl?


192

현재 데스크톱 응용 프로그램을 작성하고 있지만 다른 사람을 응용 프로그램의 새 섹션으로 리디렉션 할 때 무엇을 사용해야하는지 알 수 없습니다.

내 옵션은

  • 창문
  • 페이지
  • UserControl

그러나 나는 그들 사이의 차이점과 각각을 사용해야하는 시점을 이해하지 못합니다.

누군가 나에게 차이점을 설명하고 각각의 상황 / 응용 프로그램에 대한 예를 들어 줄 수 있습니까?

답변:


337

새로운 자사의 : 오브젝트는 같은 소리 것입니다 Window응용 프로그램에 대한. 완전히 새로운 윈도우를 팝업하고 싶을 때 사용해야합니다. Window사용자 작업에 따라 변경되는 동적 내용을 기본 창에 배치하는 것을 선호하기 때문에 WPF에서 둘 이상을 자주 사용하지 않습니다 .

페이지는 당신의 창 내부 페이지입니다. XBAP와 같은 웹 기반 시스템에 주로 사용되며, 단일 브라우저 창이 있고 해당 창에서 다른 페이지를 호스팅 할 수 있습니다. 또한 sellmeadog 과 같은 내비게이션 애플리케이션 에서도 사용할 수 있다고 말했다 .

UserControl을은 당신이 당신의 UI로 다른 컨트롤을 추가하는 것과 같은 방법을 추가 할 수있는 재사용 가능한 사용자가 생성 한 컨트롤입니다. 일반적으로 UserControl일부 사용자 지정 기능 (예 :)으로 빌드하려는 경우 CalendarControl또는 ViewMVVM 디자인 패턴을 사용할 때 와 같은 관련 XAML 코드가 많은 경우을 만듭니다.

창 사이를 탐색 할 때 간단히 새 Window객체 를 만들어 표시 할 수 있습니다.

var NewWindow = new MyWindow();
newWindow.Show();

그러나이 답변의 시작 부분에서 말했듯이 가능한 경우 여러 창을 관리하지 않는 것이 좋습니다.

내가 선호하는 탐색 방법은을 사용하여 일부 동적 컨텐츠 영역을 작성 하고 현재보기가 포함 된 것을 포함 ContentControl하여 채우는 것 UserControl입니다.

<Window x:Class="MyNamespace.MainWindow" ...>
    <DockPanel>
        <ContentControl x:Name="ContentArea" />
    </DockPanel>
</Window>

탐색 이벤트에서 다음을 사용하여 간단히 설정할 수 있습니다.

ContentArea.Content = new MyUserControl();

그러나 WPF로 작업하는 경우 MVVM 디자인 패턴을 적극 권장합니다. 내 블로그 에는이 패턴을 사용하여 MVVM을 사용하여 탐색하는 방법을 보여주는 매우 기본적인 예가 있습니다.

<Window x:Class="SimpleMVVMExample.ApplicationView"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:local="clr-namespace:SimpleMVVMExample"
        Title="Simple MVVM Example" Height="350" Width="525">

   <Window.Resources>
      <DataTemplate DataType="{x:Type local:HomeViewModel}">
         <local:HomeView /> <!-- This is a UserControl -->
      </DataTemplate>
      <DataTemplate DataType="{x:Type local:ProductsViewModel}">
         <local:ProductsView /> <!-- This is a UserControl -->
      </DataTemplate>
   </Window.Resources>

   <DockPanel>
      <!-- Navigation Buttons -->
      <Border DockPanel.Dock="Left" BorderBrush="Black"
                                    BorderThickness="0,0,1,0">
         <ItemsControl ItemsSource="{Binding PageViewModels}">
            <ItemsControl.ItemTemplate>
               <DataTemplate>
                  <Button Content="{Binding Name}"
                          Command="{Binding DataContext.ChangePageCommand,
                             RelativeSource={RelativeSource AncestorType={x:Type Window}}}"
                          CommandParameter="{Binding }"
                          Margin="2,5"/>
               </DataTemplate>
            </ItemsControl.ItemTemplate>
         </ItemsControl>
      </Border>

      <!-- Content Area -->
      <ContentControl Content="{Binding CurrentPageViewModel}" />
   </DockPanel>
</Window>

스크린 샷 1 스크린 샷 2


질문이 있는데, MVVM은 데이터 세트에서 잘 작동하는 것처럼 보이지만 정적 양식은 감사용 입력 양식과 같은 것입니다. 정적 페이지에 페이지 또는 usercontrol을 사용해야합니까?
Herrozerro 2016 년

2
@Herrozerro 만약 내가, 내가있는 것 MVVM을 사용하여 감사 양식을 만들고 싶었다 AuditViewModel형태에 대한 모든 데이터와 기능을 포함하고 나는 그것을 사용하여 어느 쪽 그릴 것 AuditViewUserControl을, 또는 단지DataTemplate
레이첼

1
감사! 실제로 블로그와 다른 사이트를 살펴본 후 MVVM의 작동 방식을 더 잘 이해할 수 있습니다.
Herrozerro 2016 년

1
@Herrozerro는 ViewModel일반적으로를 위해 구축 View의는 동안 Models응용 프로그램에서 사용되는 데이터 객체와 클래스 ( "빌딩 블록")이다 ( ViewModels)
레이첼

1
@ GTS13 네, 자주합니다. 나는 TabControl.ItemsSource객체 모음에 바인딩하고 DataTemplates를 사용하여 WPF에게 각 탭에서 각 객체 유형을 그리는 방법을 알려줍니다. 보통 이와 같은
Rachel

13
  • 은 마치 Windows.Forms.Form새 창과 같습니다.
  • 온라인 문서 에 따르면 페이지 는 다음과 같습니다.

    Windows Internet Explorer, NavigationWindow 및 Frame으로 탐색하고 호스트 할 수있는 콘텐츠 페이지를 캡슐화합니다.

    HTML 콘텐츠를 시각화 할 때는 기본적으로 이것을 사용합니다.

  • UserControl 은 재사용 가능한 구성 요소 (독립형 구성 요소는 아님)를 여러 개의 다른 구성 요소에서 사용하려는 경우를위한 것입니다Windows


답변 주셔서 감사합니다. 예를 들어 왼쪽에 버튼이있는 앱을 빌드하고 있지만 오른쪽에이 버튼의 내용을 보려면 사용자 정의 컨트롤을 사용 하시겠습니까?
Steve

@Steve : UserControl이 창에서 사용할 동일한 컨트롤 집합이 다른 창에서도 사용할 것이라고 생각하는 경우 사용하십시오. 따라서 이중 코드를 작성하는 대신을 만들지 UserControl만 그렇지 않은 경우 시각화를 위해 컨트롤을 넣으십시오. 사용자 Window가 조작 한 버튼에서 오른쪽 에있는 데이터 .
Tigran

6
추가해야 할 항목이 하나 더 있습니다 DataTemplates.. 이는 특정 범위 내에서 항목을 그리는 방법을 WPF에 알리려는 경우에 사용됩니다. 예를 들어, Buttons둥근 원 을 그리려면 간단히을 DataTemplate대신 사용할 수 있습니다 UserControl. 일반적으로 UserControls자체 기능이있는 새로운 컨트롤을 원하거나 단일 구성 요소 (예 :와 같은)에 대해 XAML이 많은 경우에 사용합니다 View. 특별한 기능이 필요없는 더 작은 XAML 비트의 DataTemplate경우UserControl
Rachel

3
일반적으로 a의 내용은 PageHTML이 아니라 XAML입니다. 그러나 Page웹 브라우저에서 탐색이 수행되는 방식과 개념적으로 유사한 탐색 프레임 워크에 a 가 연결되어 있습니다. (응용 프로그램이 XBAP 응용 프로그램 인 경우 페이지를 브라우저에서 호스팅 할 수도 있습니다.)
Martin Liversage

6

모두 빌드하려는 앱에 따라 다릅니다. Window대화 상자 기반 앱을 빌드하는 경우 s를 사용하십시오 . 탐색 기반 앱을Page 빌드하는 경우을 사용하십시오 . UserControls는 Windows와 Pages에서 모두 사용할 수 있으므로 방향에 관계없이 유용합니다.

탐험을 시작하기에 좋은 곳은 다음과 같습니다. http://windowsclient.net/learn


5

우리는 일반적으로 Window응용 프로그램에 One Main 을 사용하고 보이지 않는 XAML에서 팝업 컨트롤을 사용하는 대신 디자인 타임에 볼 수있는 창을 사용할 수 있으므로 팝업이 필요할 때와 같은 상황에서 다른 창을 사용할 수 있습니다. 함께 일하다

반면에 우리는 우리가 사용할 수있는 기본 창에서 주문 화면 등을 사용자 관리 화면처럼 한 스크린에서 다른 스크린으로 탐색에 많은 페이지를 사용하여 FrameXAML 아래와 같이 탐색 컨트롤을

    <Frame Name="mainWinFrame" NavigationUIVisibility="Hidden"  ButtonBase.Click="mainWinFrame_Click">
    </Frame>

씨#

     private void mainWinFrame_Click(object sender, RoutedEventArgs e)
    {
        try
        {
            if (e.OriginalSource is Button)
            {
                Button btn = (Button)e.OriginalSource;

                if ((btn.CommandParameter != null) && (btn.CommandParameter.Equals("Order")))
                {

                    mainWinFrame.Navigate(OrderPage);
                }
            }
        }
        catch (Exception ex)
        {
            MessageBox.Show(ex.Message, "Error");
        }
    }

그렇게하는 한 가지 방법입니다. 새 페이지 검사를 추가하는 동안 Fram 대신 Tab 컨트롤을 사용하고 Dictionary를 사용하여 페이지에 페이지를 추가 할 수도 있습니다. 누군가를 도울 수 있기를 바랍니다.


당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.