如何使用 Xamarin.Forms 在一个屏幕上同时创建具有多个 ContentPages 的平板电脑 UI? [英] How to create a tablet UI with multiple ContentPages on one screen at the same time with Xamarin.Forms?

问题描述

我想使用 Xamarin.Forms 为平板电脑(Android 和 iOS)设计一个 UI，其中我想在一个屏幕上有多个 ContentPages.我知道如何通过使用 Fragments(对于 iOS 它是 UISplitViewController)来为 Android 实现这一点.

I want to design a UI for tablets (Android & iOS) with Xamarin.Forms where I want to have multiple ContentPages on one screen. I know how to achieve this for Android by using Fragments (afaik for iOS it's UISplitViewController).

如何使用 Xamarin.Forms 实现这一点?

How can I achieve this with Xamarin.Forms?

附言我绝对不想要 TabbedPage！

推荐答案

据我所知，您不能将多个 ContentPage 项目放在屏幕上，至少不能放在开箱即用的 Xamarin.Forms 中.

As far as I know you can't put multiple ContentPage items on the screen, at least not within the out-of-the-box Xamarin.Forms.

但是，您可以在屏幕上放置多个 ContentView 项目，并且您也可以在独立页面中重复使用这些 ContentView 项目.

You can, however, put multiple ContentView items on the screen and you can reuse the ContentView items in stand-alone pages as well.

基本上，您可以将您希望在单个页面上看到的内容描述为 ContentView，然后制作一个仅包含该内容的页面

Essentially you can describe what you'd want to see on a single page as a ContentView and then make a page that just includes that

PhotoItem.xaml:

PhotoItem.xaml:

<ContentView>
   <Grid>
     <Image Source="{Binding MyImageSource}"/>
   </Grid>
</ContentView>

PhotoBucket.xaml:

PhotoBucket.xaml:

<ContentPage xmlns:local="namespace;assembly">
  <ContentPage.Content>
    <OnIdiom x:TypeArguments="View">
     <OnIdiom.Phone>
       <ListView>
          ... on list item tap do Navigation.PushAsync(new PhotoItemPage{BindingContext = itemTapped} );
       </ListView>
      </OnIdiom.Phone>
     <OnIdiom.Tablet>
       <Grid> // Add two columns
         <ListView Grid.Column="0">
            ... on list item tap do PhotoItem.BindingContext = itemTapped
         </ListView>
         <local:PhotoItem Grid.Column="1"/>
      </OnIdiom.Tablet>
    </OnIdiom>
  </ContentPage.Content> 
</ContentPage>

PhotoItemPage.xaml:

PhotoItemPage.xaml:

<ContentPage xmlns:local="namespace;assembly">
   <local:PhotoItem>
</ContentPage>

这篇关于如何使用 Xamarin.Forms 在一个屏幕上同时创建具有多个 ContentPages 的平板电脑 UI?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！