Xamarin 表单 contentpresenter 进入错误的行并在 phone 上为空

Question

我正在使用 Xamarin Forms 尝试创建我的自定义 'GroupBox' 控件，它只是一个包含两行的网格。第一行应该只显示一个带有 header 的框。 header 有一个带标签的背景矩形。第二行显示内容 ContentPresenter 第二行下方的内容。

我相信我已经正确地完成了 XAML，这就是我在 WPF 中的做法，它在 GroupBox.xaml 表单预览器中显示正常，但是当我将它添加到主页中，Groupbox 的内容会进入第一行（header）而不是预览器中出于某种原因的第二行。

此外，当我尝试在 android phone 上运行时，它看起来像这样：

组框是没有背景颜色或文本的空白框

这是GroupBox的代码'user control'

<?xml version="1.0" encoding="UTF-8"?>
<Grid xmlns="http://xamarin.com/schemas/2014/forms" 
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="XForms.GroupBox">

    <Grid.RowDefinitions>
        <RowDefinition Height="0.2*"/>
        <RowDefinition Height="1*"/>
    </Grid.RowDefinitions>

    <Frame Grid.Row="0" Grid.RowSpan="2" Margin="1" OutlineColor="AliceBlue"/>

    <BoxView Grid.Row="0" BackgroundColor="Red" Margin="1"/>

    <Label Grid.Row="0" TextColor="White" Text="Label!" Margin="2" />

    <Grid Grid.Row="1">   
        <ContentPresenter/>
    </Grid>

</Grid>

这段代码在主窗体中：

<?xml version="1.0" encoding="utf-8" ?>
    <ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
                 xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
                 xmlns:local="clr-namespace:XForms;assembly=XForms"
                 x:Class="XForms.MainPage">
        <Grid>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="auto"/>
                <ColumnDefinition Width="1*"/>
            </Grid.ColumnDefinitions>
            <Grid Grid.Column="0">
                <Grid.RowDefinitions>
                    <RowDefinition Height="1*"/>
                    <RowDefinition Height="1*"/>
                    <RowDefinition Height="1*"/>
                </Grid.RowDefinitions>

                <local:GroupBox Grid.Row="0">
                    <Label Text="I'm some content 1"/>
                </local:GroupBox>

                <local:GroupBox Grid.Row="1">
                    <Label Text="I'm some content 2"/>
                </local:GroupBox>

                <local:GroupBox Grid.Row="2">
                    <Label Text="I'm some content 3"/>
                </local:GroupBox>
            </Grid>
        </Grid>
    </ContentPage>

在主页中 XAML 我可以向标签添加一个网格行，即使内容中没有网格，它也可以在预览器中工作——但它在 phone（哪个最重要）。

  <local:GroupBox Grid.Row="0">
                    <Label Text="I'm some content 1" Grid.Row="1"/>
                </local:GroupBox>

Answer 1

我不知道 Frame 是做什么用的，但它目前覆盖了 BoxView 和标签，因此使它们不可见。注释掉 Frame，您将再次看到标签和 BoxView。

I believe I've done the XAML correctly, this is how I'd do it in WPF, it shows in the GroupBox.xaml Forms Previewer fine, but when I add it into the main page, the content of the Groupbox goes into the first row (the header) instead of the second for some reason within the Previewer.

ContentPresenter不像that.InXamarin.Forms那样起作用，一般用在ControlTemplate。 ContentPresenter的使用请参考this blog.

在你的情况下，如果你想让 ContentPresenter 工作。除了使用 Grid 代替 GroupBox，您还可以使用 ContentView 代替 GroupBox，如下所示：

[XamlCompilation(XamlCompilationOptions.Compile)]
public partial class GroupBox : ContentView
{
    public GroupBox()
    {
        InitializeComponent();
    }
}

GroupBox.xaml:

<ContentView xmlns="http://xamarin.com/schemas/2014/forms"
         xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
         x:Class="Demo.GroupBox">
<ContentView.ControlTemplate>
    <ControlTemplate>
        <Grid>
            <Grid.RowDefinitions>
                <RowDefinition Height="0.2*"/>
                <RowDefinition Height="1*"/>
            </Grid.RowDefinitions>
            <!--<Frame Grid.Row="0" Grid.RowSpan="2" Margin="1" OutlineColor="AliceBlue"></Frame>-->
            <BoxView Grid.Row="0" BackgroundColor="Red" Margin="1"  />
            <Label Grid.Row="0" TextColor="White" Text="Label!" Margin="2" />
            <Grid Grid.Row="1">
                <ContentPresenter/>
            </Grid>
        </Grid>
    </ControlTemplate>
</ContentView.ControlTemplate>

Xamarin 表单 contentpresenter 进入错误的行并在 phone 上为空

Xamarin forms contentpresenter goes in wrong row and empty on phone

c#

xaml

android

contentpresenter

xamarin.forms