How to create a tablet UI with multiple ContentPag

2020-04-10 03:56发布

问题:

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).

How can I achieve this with Xamarin.Forms?

P.s. I definitely don't want a TabbedPage!

回答1:

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.

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

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:

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

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:

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


回答2:

You can't have multiple pages, use content views for it. Or custom renderers