계층적 탐색Hierarchical Navigation

샘플 다운로드 샘플 다운로드Download Sample Download the sample

NavigationPage 클래스는 사용자가 필요에 따라 페이지를 앞으로 뒤로 탐색할 수 있는 계층적 탐색 환경을 제공합니다. 이 클래스는 탐색을 Page 개체의 LIFO(후입선출) 스택으로 구현합니다. 이 문서에서는 NavigationPage 클래스를 사용하여 페이지 스택 탐색을 수행하는 방법을 보여 줍니다.The NavigationPage class provides a hierarchical navigation experience where the user is able to navigate through pages, forwards and backwards, as desired. The class implements navigation as a last-in, first-out (LIFO) stack of Page objects. This article demonstrates how to use the NavigationPage class to perform navigation in a stack of pages.

한 페이지에서 다른 페이지로 이동하려면 다음 다이어그램에 표시된 것처럼 애플리케이션은 새 페이지를 탐색 스택으로 푸시하여 활성 페이지가 되게 합니다.To move from one page to another, an application will push a new page onto the navigation stack, where it will become the active page, as shown in the following diagram:

이전 페이지로 돌아가기 위해 애플리케이션은 다음 다이어그램에 표시된 것처럼 탐색 스택에서 현재 페이지를 꺼내고 맨 위에 있는 새 페이지가 활성 페이지가 됩니다.To return back to the previous page, the application will pop the current page from the navigation stack, and the new topmost page becomes the active page, as shown in the following diagram:

탐색 메서드는 모든 Page 파생 형식의 Navigation 속성에 의해 노출됩니다.Navigation methods are exposed by the Navigation property on any Page derived types. 이 메서드는 탐색 스택에 페이지를 푸시하고 탐색 스택에서 페이지를 꺼내 스택 조작을 수행하는 기능을 제공합니다.These methods provide the ability to push pages onto the navigation stack, to pop pages from the navigation stack, and to perform stack manipulation.

탐색 수행Performing Navigation

계층적 탐색에서는 NavigationPage 클래스가 ContentPage 개체의 스택을 탐색하는 데 사용됩니다.In hierarchical navigation, the NavigationPage class is used to navigate through a stack of ContentPage objects. 다음 스크린샷은 각 플랫폼에서 NavigationPage의 주요 구성 요소를 보여 줍니다.The following screenshots show the main components of the NavigationPage on each platform:

NavigationPage의 레이아웃은 플랫폼에 따라 달라집니다.The layout of a NavigationPage is dependent on the platform:

  • iOS에는 탐색 모음이 제목을 표시하는 페이지 맨 위에 나타나며 여기에 이전 페이지로 돌아가는 뒤로 단추가 있습니다.On iOS, a navigation bar is present at the top of the page that displays a title, and that has a Back button that returns to the previous page.
  • Android에는 탐색 모음이 제목, 아이콘 및 이전 페이지로 돌아가는 뒤로 단추를 표시하는 페이지 맨 위에 나타납니다.On Android, a navigation bar is present at the top of the page that displays a title, an icon, and a Back button that returns to the previous page. 아이콘은 Android 플랫폼 관련 프로젝트의 MainActivity 클래스를 데코레이팅하는 [Activity] 특성에 정의됩니다.The icon is defined in the [Activity] attribute that decorates the MainActivity class in the Android platform-specific project.
  • 유니버설 Windows 플랫폼에서 제목을 표시하는 페이지 맨 위에 탐색 모음이 나타납니다.On the Universal Windows Platform, a navigation bar is present at the top of the page that displays a title.

모든 플랫폼에서 Page.Title 속성 값이 페이지 제목으로 표시됩니다.On all the platforms, the value of the Page.Title property will be displayed as the page title.

참고

NavigationPageContentPage 인스턴스만으로 채우는 것이 좋습니다.It's recommended that a NavigationPage should be populated with ContentPage instances only.

루트 페이지 만들기Creating the Root Page

탐색 스택에 추가된 첫 번째 페이지는 애플리케이션의 root 페이지라고 하며, 다음 코드 예제는 해당 수행 방법을 보여줍니다.The first page added to a navigation stack is referred to as the root page of the application, and the following code example shows how this is accomplished:

public App ()
{
  MainPage = new NavigationPage (new Page1Xaml ());
}

Page1Xaml ContentPage 인스턴스가 탐색 스택으로 푸시되어 애플리케이션의 활성 및 루트 페이지가 됩니다.This causes the Page1Xaml ContentPage instance to be pushed onto the navigation stack, where it becomes the active page and the root page of the application. 이 과정은 다음 스크린샷에 나와 있습니다.This is shown in the following screenshots:

참고

NavigationPage 인스턴스의 RootPage 속성은 탐색 스택의 첫 번째 페이지에 대한 액세스를 제공합니다.The RootPage property of a NavigationPage instance provides access to the first page in the navigation stack.

탐색 스택으로 페이지 푸시Pushing Pages to the Navigation Stack

Page2Xaml로 이동하려면 다음 코드 예제에서 설명한 것처럼 현재 페이지의 Navigation 속성에서 PushAsync 메서드를 호출해야 합니다.To navigate to Page2Xaml, it is necessary to invoke the PushAsync method on the Navigation property of the current page, as demonstrated in the following code example:

async void OnNextPageButtonClicked (object sender, EventArgs e)
{
  await Navigation.PushAsync (new Page2Xaml ());
}

Page2Xaml 인스턴스가 탐색 스택으로 푸시되어 활성 페이지가 됩니다.This causes the Page2Xaml instance to be pushed onto the navigation stack, where it becomes the active page. 이 과정은 다음 스크린샷에 나와 있습니다.This is shown in the following screenshots:

PushAsync 메서드가 호출되는 경우 다음 이벤트가 발생합니다.When the PushAsync method is invoked, the following events occur:

  • PushAsync를 호출하는 페이지에서는 해당 OnDisappearing 재정의가 호출됩니다.The page calling PushAsync has its OnDisappearing override invoked.
  • 탐색 중인 페이지에서는 OnAppearing 재정의가 호출됩니다.The page being navigated to has its OnAppearing override invoked.
  • PushAsync 작업이 완료됩니다.The PushAsync task completes.

그러나 이러한 이벤트가 발생하는 정확한 순서는 플랫폼에 따라 다릅니다.However, the precise order in which these events occur is platform dependent. 자세한 내용은 Charles Petzold의 Xamarin.Forms 책 24장을 참조하세요.For more information, see Chapter 24 of Charles Petzold's Xamarin.Forms book.

참고

OnDisappearingOnAppearing 재정의에 대한 호출을 페이지 탐색의 보장된 표시로 다룰 수는 없습니다.Calls to the OnDisappearing and OnAppearing overrides cannot be treated as guaranteed indications of page navigation. 예를 들어 iOS에서 OnDisappearing 재정의는 애플리케이션이 종료될 때 활성 페이지에 호출됩니다.For example, on iOS, the OnDisappearing override is called on the active page when the application terminates.

탐색 스택에서 페이지 꺼내기Popping Pages from the Navigation Stack

활성 페이지는 디바이스의 뒤로 단추를 눌러 탐색 스택에서 뺄(pop) 수 있습니다. 이때 단추는 디바이스의 물리적 단추든 화면상 단추든 상관없습니다.The active page can be popped from the navigation stack by pressing the Back button on the device, regardless of whether this is a physical button on the device or an on-screen button.

프로그래밍 방식으로 원래 페이지로 돌아가려면 Page2Xaml 개체가 다음 코드 예제에서 설명한 것처럼 PopAsync 메서드를 호출해야 합니다.To programmatically return to the original page, the Page2Xaml instance must invoke the PopAsync method, as demonstrated in the following code example:

async void OnPreviousPageButtonClicked (object sender, EventArgs e)
{
  await Navigation.PopAsync ();
}

Page2Xaml 인스턴스가 탐색 스택에서 제거되어 맨 위에 있는 새 페이지가 활성 페이지가 됩니다.This causes the Page2Xaml instance to be removed from the navigation stack, with the new topmost page becoming the active page. PopAsync 메서드가 호출되는 경우 다음 이벤트가 발생합니다.When the PopAsync method is invoked, the following events occur:

  • PopAsync를 호출하는 페이지에서는 해당 OnDisappearing 재정의가 호출됩니다.The page calling PopAsync has its OnDisappearing override invoked.
  • 반환되는 페이지에서는 OnAppearing 재정의가 호출됩니다.The page being returned to has its OnAppearing override invoked.
  • PopAsync 작업이 반환됩니다.The PopAsync task returns.

그러나 이러한 이벤트가 발생하는 정확한 순서는 플랫폼에 따라 다릅니다.However, the precise order in which these events occur is platform dependent. 자세한 내용은 Charles Petzold의 Xamarin.Forms 책 24장을 참조하세요.For more information see Chapter 24 of Charles Petzold's Xamarin.Forms book.

각 페이지의 Navigation 속성은 PushAsyncPopAsync 메서드뿐만 아니라 PopToRootAsync 메서드도 제공하며 다음 코드 예제에 표시됩니다.As well as PushAsync and PopAsync methods, the Navigation property of each page also provides a PopToRootAsync method, which is shown in the following code example:

async void OnRootPageButtonClicked (object sender, EventArgs e)
{
  await Navigation.PopToRootAsync ();
}

이 메서드는 탐색 스택에서 루트 Page를 제외한 모든 항목을 꺼내므로 애플리케이션의 루트 페이지를 활성 페이지로 만듭니다.This method pops all but the root Page off the navigation stack, therefore making the root page of the application the active page.

페이지 전환에 애니메이션 적용Animating Page Transitions

각 페이지의 Navigation 속성은 또한 다음 코드 예제에 나온 것처럼 탐색하는 동안 페이지 애니메이션을 표시할지 여부를 제어하는 boolean 매개 변수가 포함된 재정의 푸시 및 팝 메서드를 제공합니다.The Navigation property of each page also provides overridden push and pop methods that include a boolean parameter that controls whether to display a page animation during navigation, as shown in the following code example:

async void OnNextPageButtonClicked (object sender, EventArgs e)
{
  // Page appearance not animated
  await Navigation.PushAsync (new Page2Xaml (), false);
}

async void OnPreviousPageButtonClicked (object sender, EventArgs e)
{
  // Page appearance not animated
  await Navigation.PopAsync (false);
}

async void OnRootPageButtonClicked (object sender, EventArgs e)
{
  // Page appearance not animated
  await Navigation.PopToRootAsync (false);
}

기본 플랫폼에서 지원되는 경우 매개 변수를 true로 설정하면 페이지 전환 애니메이션을 사용하도록 설정되고, boolean 매개 변수를 false로 설정하면 페이지 전환 애니메이션을 사용하지 않도록 설정됩니다.Setting the boolean parameter to false disables the page-transition animation, while setting the parameter to true enables the page-transition animation, provided that it is supported by the underlying platform. 그러나 이 매개 변수가 없는 푸시 및 팝 메서드는 기본적으로 애니메이션을 사용하도록 설정합니다.However, the push and pop methods that lack this parameter enable the animation by default.

탐색 시 데이터 전달Passing Data when Navigating

경우에 따라 페이지에서 탐색하는 동안 다른 페이지로 데이터를 전달해야 합니다.Sometimes it's necessary for a page to pass data to another page during navigation. 페이지 생성자를 통해 데이터를 전달하는 방법과 새 페이지의 BindingContext를 데이터로 설정하는 방법의 두 방법으로 이 작업을 수행할 수 있습니다.Two techniques for accomplishing this are passing data through a page constructor, and by setting the new page's BindingContext to the data. 각 방법을 이제 차례차례 설명하겠습니다.Each will now be discussed in turn.

페이지 생성자를 통해 데이터 전달Passing Data through a Page Constructor

탐색하는 동안 다른 페이지로 데이터를 전달하기 위한 가장 간단한 방법은 다음 코드 예제에 나와 있는 페이지 생성자 매개 변수를 통하는 것입니다.The simplest technique for passing data to another page during navigation is through a page constructor parameter, which is shown in the following code example:

public App ()
{
  MainPage = new NavigationPage (new MainPage (DateTime.Now.ToString ("u")));
}

이 코드는 NavigationPage 인스턴스에 래핑되고 ISO8601 형식의 현재 날짜 및 시간으로 전달하는 MainPage 인스턴스를 생성합니다.This code creates a MainPage instance, passing in the current date and time in ISO8601 format, which is wrapped in a NavigationPage instance.

MainPage 인스턴스는 다음 코드 예제에 나온 것처럼 생성자 매개 변수를 통해 데이터를 수신합니다.The MainPage instance receives the data through a constructor parameter, as shown in the following code example:

public MainPage (string date)
{
  InitializeComponent ();
  dateLabel.Text = date;
}

그런 다음, 다음 스크린샷에 표시된 것처럼 Label.Text 속성을 설정하여 데이터를 페이지에 표시합니다.The data is then displayed on the page by setting the Label.Text property, as shown in the following screenshots:

BindingContext를 통해 데이터 전달Passing Data through a BindingContext

탐색하는 동안 다른 페이지로 데이터를 전달하는 또 다른 방법은 다음 코드 예제에 표시된 대로 새 페이지의 BindingContext를 데이터로 설정하는 것입니다.An alternative approach for passing data to another page during navigation is by setting the new page's BindingContext to the data, as shown in the following code example:

async void OnNavigateButtonClicked (object sender, EventArgs e)
{
  var contact = new Contact {
    Name = "Jane Doe",
    Age = 30,
    Occupation = "Developer",
    Country = "USA"
  };

  var secondPage = new SecondPage ();
  secondPage.BindingContext = contact;
  await Navigation.PushAsync (secondPage);
}

이 코드는 SecondPage 인스턴스의 BindingContextContact 인스턴스로 설정한 다음, SecondPage로 이동합니다.This code sets the BindingContext of the SecondPage instance to the Contact instance, and then navigates to the SecondPage.

그런 다음, 다음 XAML 코드 예제에 표시된 대로 SecondPage는 데이터 바인딩을 사용하여 Contact 인스턴스 데이터를 표시합니다.The SecondPage then uses data binding to display the Contact instance data, as shown in the following XAML code example:

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="PassingData.SecondPage"
             Title="Second Page">
    <ContentPage.Content>
        <StackLayout HorizontalOptions="Center" VerticalOptions="Center">
            <StackLayout Orientation="Horizontal">
                <Label Text="Name:" HorizontalOptions="FillAndExpand" />
                <Label Text="{Binding Name}" FontSize="Medium" FontAttributes="Bold" />
            </StackLayout>
            ...
            <Button x:Name="navigateButton" Text="Previous Page" Clicked="OnNavigateButtonClicked" />
        </StackLayout>
    </ContentPage.Content>
</ContentPage>

다음 코드 예제는 C#에서 데이터 바인딩이 어떻게 수행되는지를 보여 줍니다.The following code example shows how the data binding can be accomplished in C#:

public class SecondPageCS : ContentPage
{
  public SecondPageCS ()
  {
    var nameLabel = new Label {
      FontSize = Device.GetNamedSize (NamedSize.Medium, typeof(Label)),
      FontAttributes = FontAttributes.Bold
    };
    nameLabel.SetBinding (Label.TextProperty, "Name");
    ...
    var navigateButton = new Button { Text = "Previous Page" };
    navigateButton.Clicked += OnNavigateButtonClicked;

    Content = new StackLayout {
      HorizontalOptions = LayoutOptions.Center,
      VerticalOptions = LayoutOptions.Center,
      Children = {
        new StackLayout {
          Orientation = StackOrientation.Horizontal,
          Children = {
            new Label{ Text = "Name:", FontSize = Device.GetNamedSize (NamedSize.Medium, typeof(Label)), HorizontalOptions = LayoutOptions.FillAndExpand },
            nameLabel
          }
        },
        ...
        navigateButton
      }
    };
  }

  async void OnNavigateButtonClicked (object sender, EventArgs e)
  {
    await Navigation.PopAsync ();
  }
}

그런 다음, 다음 스크린샷에 표시된 것처럼 일련의 Label 컨트롤로 데이터를 페이지에 표시합니다.The data is then displayed on the page by a series of Label controls, as shown in the following screenshots:

데이터 바인딩에 대한 자세한 내용은 데이터 바인딩 기본을 참조하세요.For more information about data binding, see Data Binding Basics.

탐색 스택 조작Manipulating the Navigation Stack

Navigation 속성은 탐색 스택의 페이지를 얻을 수 있는 NavigationStack 속성을 노출합니다.The Navigation property exposes a NavigationStack property from which the pages in the navigation stack can be obtained. Xamarin.Forms는 탐색 스택에 대한 액세스를 유지 관리하는 반면, Navigation 속성은 페이지를 삽입하거나 제거하여 스택을 조작하는 InsertPageBeforeRemovePage 메서드를 제공합니다.While Xamarin.Forms maintains access to the navigation stack, the Navigation property provides the InsertPageBefore and RemovePage methods for manipulating the stack by inserting pages or removing them.

InsertPageBefore 메서드는 다음 다이어그램에 표시된 것처럼 탐색 스택에서 기존 지정된 페이지 앞에 지정된 페이지를 삽입합니다.The InsertPageBefore method inserts a specified page in the navigation stack before an existing specified page, as shown in the following diagram:

RemovePage 메서드는 다음 다이어그램에 표시된 것처럼 탐색 스택에서 지정된 페이지를 제거합니다.The RemovePage method removes the specified page from the navigation stack, as shown in the following diagram:

이러한 메소드를 사용하면 로그인 성공 후 로그인 페이지를 새 페이지로 바꾸는 것과 같은 사용자 지정 탐색 환경이 가능합니다.These methods enable a custom navigation experience, such as replacing a login page with a new page, following a successful login. 다음 코드 예제에서는 이 시나리오를 보여 줍니다.The following code example demonstrates this scenario:

async void OnLoginButtonClicked (object sender, EventArgs e)
{
  ...
  var isValid = AreCredentialsCorrect (user);
  if (isValid) {
    App.IsUserLoggedIn = true;
    Navigation.InsertPageBefore (new MainPage (), this);
    await Navigation.PopAsync ();
  } else {
    // Login failed
  }
}

사용자의 자격 증명이 정확하다면 MainPage 인스턴스가 현재 페이지 앞에 탐색 스택에 삽입됩니다.Provided that the user's credentials are correct, the MainPage instance is inserted into the navigation stack before the current page. 그러면 PopAsync 메서드가 탐색 스택에서 현재 페이지를 제거하고 MainPage 인스턴스가 활성 페이지가 됩니다.The PopAsync method then removes the current page from the navigation stack, with the MainPage instance becoming the active page.

탐색 모음에서 보기 표시Displaying Views in the Navigation Bar

모든 Xamarin.Forms ViewNavigationPage의 탐색 모음에 표시될 수 있습니다.Any Xamarin.Forms View can be displayed in the navigation bar of a NavigationPage. 이렇게 하려면 NavigationPage.TitleView 연결된 속성을 View로 설정합니다.This is accomplished by setting the NavigationPage.TitleView attached property to a View. 이 연결된 속성은 모든 Page로 설정할 수 있으며 PageNavigationPage에 푸시되면 NavigationPage가 속성 값을 적용합니다.This attached property can be set on any Page, and when the Page is pushed onto a NavigationPage, the NavigationPage will respect the value of the property.

제목 보기 샘플에서 가져온 다음 예제에서는 XAML에서 NavigationPage.TitleView 연결된 속성을 설정하는 방법을 보여 줍니다.The following example, taken from the Title View sample, shows how to set the NavigationPage.TitleView attached property from XAML:

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="NavigationPageTitleView.TitleViewPage">
    <NavigationPage.TitleView>
        <Slider HeightRequest="44" WidthRequest="300" />
    </NavigationPage.TitleView>
    ...
</ContentPage>

해당하는 C# 코드는 다음과 같습니다.Here is the equivalent C# code:

public class TitleViewPage : ContentPage
{
    public TitleViewPage()
    {
        var titleView = new Slider { HeightRequest = 44, WidthRequest = 300 };
        NavigationPage.SetTitleView(this, titleView);
        ...
    }
}

그 결과, SliderNavigationPage의 탐색 모음에 표시됩니다.This results in a Slider being displayed in the navigation bar on the NavigationPage:

슬라이더 TitleViewSlider TitleView

중요

보기의 크기가 WidthRequestHeightRequest 속성으로 지정되지 않으면 탐색 모음에 많은 보기가 나타나지 않습니다.Many views won't appear in the navigation bar unless the size of the view is specified with the WidthRequest and HeightRequest properties. 또는 HorizontalOptionsVerticalOptions 속성을 적절한 값으로 설정하여 보기를 StackLayout에 래핑할 수 있습니다.Alternatively, the view can be wrapped in a StackLayout with the HorizontalOptions and VerticalOptions properties set to appropriate values.

Layout 클래스는 View 클래스에서 파생되므로 여러 보기를 포함하는 레이아웃 클래스를 표시하도록 TitleView 연결된 속성을 설정할 수 있습니다.Note that, because the Layout class derives from the View class, the TitleView attached property can be set to display a layout class that contains multiple views. iOS 및 UWP(유니버설 Windows 플랫폼)에서는 탐색 모음의 높이를 변경할 수 없으므로 탐색 모음에 표시된 보기가 탐색 모음의 기본 크기보다 클 경우 클리핑이 발생합니다.On iOS and the Universal Windows Platform (UWP), the height of the navigation bar can't be changed, and so clipping will occur if the view displayed in the navigation bar is larger than the default size of the navigation bar. 그러나 Android에서는 NavigationPage.BarHeight 바인딩 가능 속성을 새 높이를 나타내는 double로 설정하여 탐색 모음의 높이를 변경할 수 있습니다.However, on Android, the height of the navigation bar can be changed by setting the NavigationPage.BarHeight bindable property to a double representing the new height. 자세한 내용은 NavigationPage에서 탐색 모음 높이 설정을 참조하세요.For more information, see Setting the Navigation Bar Height on a NavigationPage.

또는 탐색 막대에 일부 콘텐츠를 배치하고, 일부는 탐색 막대와 색상이 일치하는 페이지 콘텐츠 맨 위에 있는 보기에 배치하여 확장된 탐색 모음을 제시할 수 있습니다.Alternatively, an extended navigation bar can be suggested by placing some of the content in the navigation bar, and some in a view at the top of the page content that you color match to the navigation bar. 또한 iOS에서 NavigationPage.HideNavigationBarSeparator 바인드 가능 속성을 true로 설정하여 탐색 모음의 맨 아래에 있는 구분선과 그림자를 제거할 수 있습니다.In addition, on iOS the separator line and shadow that's at the bottom of the navigation bar can be removed by setting the NavigationPage.HideNavigationBarSeparator bindable property to true. 자세한 내용은 NavigationPage에서 탐색 모음 구분 기호 숨기기를 참조하세요.For more information, see Hiding the Navigation Bar Separator on a NavigationPage.

참고

BackButtonTitle, Title, TitleIconTitleView 속성으로 탐색 모음에서 공간을 차지하는 모든 값을 정의할 수 있습니다.The BackButtonTitle, Title, TitleIcon, and TitleView properties can all define values that occupy space on the navigation bar. 탐색 모음 크기는 플랫폼 및 화면 크기에 따라 다르지만 이러한 속성을 모두 설정하면 사용 가능한 공간이 제한되어 충돌이 발생합니다.While the navigation bar size varies by platform and screen size, setting all of these properties will result in conflicts due to the limited space available. 이러한 속성을 조합하여 사용하는 대신 TitleView 속성만 설정하여 원하는 탐색 모음 디자인을 보다 잘 만들 수 있습니다.Instead of attempting to use a combination of these properties, you may find that you can better achieve your desired navigation bar design by only setting the TitleView property.

제한 사항Limitations

NavigationPage의 탐색 모음에 View를 표시할 때 주의해야 할 몇 가지 제한 사항이 있습니다.There are a number of limitations to be aware of when displaying a View in the navigation bar of a NavigationPage:

  • iOS에서는 NavigationPage의 탐색 모음에 배치된 보기가 큰 제목의 사용 가능 여부에 따라 다른 위치에 나타납니다.On iOS, views placed in the navigation bar of a NavigationPage appear in a different position depending on whether large titles are enabled. 큰 제목 사용에 대한 자세한 내용은 큰 제목 표시를 참조하세요.For more information about enabling large titles, see Displaying Large Titles.
  • Android에서는 NavigationPage의 탐색 모음에 보기를 배치하는 작업을 app-compat을 사용하는 앱에서만 수행할 수 있습니다.On Android, placing views in the navigation bar of a NavigationPage can only be accomplished in apps that use app-compat.
  • NavigationPage의 탐색 모음에 ListViewTableView와 같은 크고 복잡한 보기를 배치하지 않는 것이 좋습니다.It's not recommended to place large and complex views, such as ListView and TableView, in the navigation bar of a NavigationPage.