如何在 C# 中开发 xamarin 表单应用程序界面的一部分，而在 xaml 中开发另一部分？

Question

你好我正在开发一个 xamarin 表单应用程序，它有一个用 c# 编写的网格界面我正在尝试使用 xaml 添加一个底部导航栏

这是我的 C# 代码：

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;

using Xamarin.Forms;

namespace App.Pages
{
    public partial class HomePage : ContentPage
    {
        public HomePage()
        {
            InitializeComponent();

            var g = new Grid { };

            //Image 1 setup
            var Image1 = new Image
            {
                HorizontalOptions = LayoutOptions.StartAndExpand,
                Source = ImageSource.FromFile("event.png"),
                WidthRequest = 200,
                HeightRequest = 200,
            };
            //Image 1 tapped event
            var tapGestureRecognizer1 = new TapGestureRecognizer();
            tapGestureRecognizer1.Tapped += TapGestureRecognizer1_Tapped;
            Image1.GestureRecognizers.Add(tapGestureRecognizer1);
            //Image 1 tapped event
            g.Children.Add(Image1, 0, 0);


            //Image 2 setup
            var Image2 = new Image
            {
                HorizontalOptions = LayoutOptions.StartAndExpand,
                Source = ImageSource.FromFile("schedule.png"),
                WidthRequest = 200,
                HeightRequest = 200,
            };
            //Image 2 tapped event
            var tapGestureRecognizer2 = new TapGestureRecognizer();
            tapGestureRecognizer2.Tapped += TapGestureRecognizer2_Tapped;
            Image2.GestureRecognizers.Add(tapGestureRecognizer2);
            //Image 2 tapped event
            g.Children.Add(Image2, 1, 0);


            //Image 3 setup
            var Image3 = new Image
            {
                HorizontalOptions = LayoutOptions.StartAndExpand,
                Source = ImageSource.FromFile("icon.png"),
                WidthRequest = 200,
                HeightRequest = 200,
            };
            //Image 3 tapped event
            var tapGestureRecognizer3 = new TapGestureRecognizer();
            tapGestureRecognizer3.Tapped += TapGestureRecognizer3_Tapped;
            Image3.GestureRecognizers.Add(tapGestureRecognizer3);
            //Image 3 tapped event
            g.Children.Add(Image3, 0, 1);


            //Image 4 setup
            var Image4 = new Image
            {
                HorizontalOptions = LayoutOptions.StartAndExpand,
                Source = ImageSource.FromFile("icon.png"),
                WidthRequest = 200,
                HeightRequest = 200,
            };
            //Image 4 tapped event
            var tapGestureRecognizer4 = new TapGestureRecognizer();
            tapGestureRecognizer4.Tapped += TapGestureRecognizer4_Tapped;
            Image4.GestureRecognizers.Add(tapGestureRecognizer4);
            //Image 4 tapped event
            g.Children.Add(Image4, 1, 1);


            //Image 5setup
            var Image5 = new Image
            {
                HorizontalOptions = LayoutOptions.StartAndExpand,
                Source = ImageSource.FromFile("icon.png"),
                WidthRequest = 200,
                HeightRequest = 200,
            };
            //Image 5 tapped event
            var tapGestureRecognizer5 = new TapGestureRecognizer();
            tapGestureRecognizer5.Tapped += TapGestureRecognizer5_Tapped;
            Image5.GestureRecognizers.Add(tapGestureRecognizer5);
            //Image 5 tapped event
            g.Children.Add(Image5, 0, 2);


            //Image 6 setup
            var Image6 = new Image
            {
                HorizontalOptions = LayoutOptions.StartAndExpand,
                Source = ImageSource.FromFile("icon.png"),
                WidthRequest = 200,
                HeightRequest = 200,
            };
            //Image 6 tapped event
            var tapGestureRecognizer6 = new TapGestureRecognizer();
            tapGestureRecognizer6.Tapped += TapGestureRecognizer6_Tapped;
            Image6.GestureRecognizers.Add(tapGestureRecognizer6);
            //Image 6 tapped event
            g.Children.Add(Image6, 1, 2);

            // Accomodate iPhone status bar.
            this.Padding = new Thickness(0, Device.OnPlatform(20, 0, 0), 0, 0);

            // Build the page.
            this.Content = g;

        }


        //This is the code that takes you to page1
        private void TapGestureRecognizer1_Tapped(object sender, EventArgs e)
        {
            Navigation.PushModalAsync(new Page1());

        }

        //This is the code that takes you to page2

        private void TapGestureRecognizer2_Tapped(object sender, EventArgs e)
        {
            Navigation.PushModalAsync(new Page2());
        }
        private void TapGestureRecognizer3_Tapped(object sender, EventArgs e)
        {
            this.DisplayAlert("Image Tapped", "Image 3 tapped, push navigation here.", "Dismiss");
        }
        private void TapGestureRecognizer4_Tapped(object sender, EventArgs e)
        {
            this.DisplayAlert("Image Tapped", "Image 4 tapped, push navigation here.", "Dismiss");
        }
        private void TapGestureRecognizer5_Tapped(object sender, EventArgs e)
        {
            this.DisplayAlert("Image Tapped", "Image 5 tapped, push navigation here.", "Dismiss");
        }
        private void TapGestureRecognizer6_Tapped(object sender, EventArgs e)
        {
            this.DisplayAlert("Image Tapped", "Image 6 tapped, push navigation here.", "Dismiss");
        }

        //Code to take you to the homepage
        public void Home(object sender, EventArgs e)
        {

            Navigation.PushAsync(new HomePage());






        }


        //Code to take you to the MapPage
        public void Map(object sender, EventArgs e)
        {

            Navigation.PushAsync(new MapPage());






        }


        //Code to take you to the SponsorsPage
        public void sponsors(object sender, EventArgs e)
        {

            Navigation.PushAsync(new SponsorsPage());






        }
    }


}

这是我尝试将导航栏添加到的 xaml 页面：

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="App.Pages.HomePage"
                xmlns:flv="clr-namespace:DLToolkit.Forms.Controls;assembly=DLToolkit.Forms.Controls.FlowListView"
             BackgroundColor="#8f9e1c">
  <Grid RowSpacing="0">
    <Grid.RowDefinitions>
      <RowDefinition Height="*" />
      <RowDefinition Height="Auto" />
    </Grid.RowDefinitions>

    <ContentPage.Content>
      <Grid Grid.Row="1" BackgroundColor="#8f9e1c">
        <StackLayout Orientation="Horizontal" MinimumHeightRequest="30" VerticalOptions="FillAndExpand" HorizontalOptions="FillAndExpand">
          <Button Image="icon.png" HorizontalOptions="StartAndExpand" BorderColor="Transparent" BackgroundColor="Transparent" Clicked="Home" />
          <Button  Image="icon.png" HorizontalOptions="CenterAndExpand" BackgroundColor="Transparent" Clicked="Map" />
          <Button  Image="icon.png" HorizontalOptions="EndAndExpand" BorderColor="Transparent" BackgroundColor="Transparent" Clicked="sponsors" />
        </StackLayout>
      </Grid>
    </ContentPage.Content>
  </Grid>
</ContentPage>

当我按原样运行代码时，它只显示 C# 代码，关于如何让导航栏工作有什么想法吗？

任何帮助都会很棒！

提前致谢

Answer 1

这只是覆盖任何现有的页面内容

this.Content = g;

您需要为 XAML 网格分配一个名称，并在 C# 代码中按名称引用它，而不是仅仅创建一个新网格

<Grid RowSpacing="0" x:Name="myGrid">

myGrid.Children.Add(Image1, 0, 0);

不要这样做

var g = new Grid { };

或者这个

this.Content = g;