.net maui 如果 BORDER 使用则整个页面消失

Question

我有一个页面，如果选择了图像，则应在图像周围放置边框，如下图所示：（当我用框架替换边框并重写属性以调整为框架时，该逻辑正在工作，但框架没有中风选项——太糟糕了）。

这是 xaml 中的可能页面代码：

<?xml version="1.0" encoding="utf-8" ?>
<master:MeterDataMasterContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
                                   xmlns:master="clr-namespace:MeterReader.Pages"
                                   xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
                                   xmlns:toolkit="http://schemas.microsoft.com/dotnet/2022/maui/toolkit"
                                   xmlns:translate="clr-namespace:MeterReader.Localization"
                                   xmlns:viewModel="clr-namespace:MeterReader.ViewModels"
                                   xmlns:componenets="clr-namespace:MeterReader.Components"
                                   xmlns:models="clr-namespace:MeterReader.Models"
                                   xmlns:converters="clr-namespace:MeterReader.Converters"
                                   x:Class="MeterReader.Pages.FilterPage"
                                   x:DataType="viewModel:FilterPageViewModel"
                                   HeaderText="{translate:Localizer MeterDataPage.Title}"
                                   Shell.NavBarIsVisible="False">
    <ContentPage.Behaviors>
        <toolkit:EventToCommandBehavior Command="{Binding AppearingCommand}" EventName="Appearing"/>
        <toolkit:EventToCommandBehavior Command="{Binding DisappearingCommand}" EventName="Disappearing" />
    </ContentPage.Behaviors>

    <ContentPage.Resources>
        <ResourceDictionary>
            <converters:TaskTypeToBooleanConverter x:Key="TaskTypeToBoolean"/>
        </ResourceDictionary>
    </ContentPage.Resources>

    <VerticalStackLayout Spacing="15"
                         BackgroundColor="#FFF4FBFF"
                         Style="{x:StaticResource FormContainer}"
                         Margin="16,0,16,0">
        <HorizontalStackLayout HorizontalOptions="End">
            <Image Source="close.png"
                   HeightRequest="24" WidthRequest="24"
                   Margin="0,0,24,0"/>
        </HorizontalStackLayout>
        <HorizontalStackLayout HorizontalOptions="Center">
            <Label Text="{translate:Localizer FilterPage.Form.Title}"
                   Style="{x:StaticResource PageTitle}" />
        </HorizontalStackLayout>
        <VerticalStackLayout Style="{x:StaticResource InputWrapper}"
                             Spacing="10"
                             Margin="0,24,0,0">
            <Label Text="{translate:Localizer FilterPage.SectionTitle.TaskType}"
                   Style="{x:StaticResource SectiomTitle}"/>
            <FlexLayout Direction="Row" JustifyContent="SpaceEvenly">
                <Border Stroke="Transparent" StrokeThickness="0"
                        HeightRequest="84" WidthRequest="84">
                    <Border.Triggers>
                        <DataTrigger TargetType="Border"
                                     Binding="{Binding TaskType, Converter={StaticResource TaskTypeToBoolean}, ConverterParameter=Water}"
                                     Value="True">
                            <Setter Property="Stroke" Value="{StaticResource LightMeterReaderBottomBlue900}" />
                            <Setter Property="StrokeThickness" Value="3" />
                        </DataTrigger>
                    </Border.Triggers>
                    <Border.GestureRecognizers>
                        <TapGestureRecognizer Command="{Binding SetTaskTypeCommand}" CommandParameter="Water" 
                                              NumberOfTapsRequired="1" />
                    </Border.GestureRecognizers>
                    <Image Source="big_water.png"
                           HeightRequest="84" WidthRequest="84" />
                </Border>
                <Border Stroke="Transparent" StrokeThickness="0"
                        HeightRequest="84" WidthRequest="84">
                    <Border.Triggers>
                        <DataTrigger TargetType="Border"
                                     Binding="{Binding TaskType, Converter={StaticResource TaskTypeToBoolean}, ConverterParameter=Water}"
                                     Value="True">
                            <Setter Property="Stroke" Value="{StaticResource LightMeterReaderBottomBlue900}" />
                            <Setter Property="StrokeThickness" Value="3" />
                        </DataTrigger>
                    </Border.Triggers>
                    <Border.GestureRecognizers>
                        <TapGestureRecognizer Command="{Binding SetTaskTypeCommand}" CommandParameter="Water" 
                                              NumberOfTapsRequired="1" />
                    </Border.GestureRecognizers>
                    <Image Source="big_electrity.png" 
                           HeightRequest="84" WidthRequest="84" />
                </Border>
                <Border Stroke="Transparent" StrokeThickness="0"
                        HeightRequest="84" WidthRequest="84">
                    <Border.Triggers>
                        <DataTrigger TargetType="Border"
                                     Binding="{Binding TaskType, Converter={StaticResource TaskTypeToBoolean}, ConverterParameter=Water}"
                                     Value="True">
                            <Setter Property="Stroke" Value="{StaticResource LightMeterReaderBottomBlue900}" />
                            <Setter Property="StrokeThickness" Value="3" />
                        </DataTrigger>
                    </Border.Triggers>
                    <Border.GestureRecognizers>
                        <TapGestureRecognizer Command="{Binding SetTaskTypeCommand}" CommandParameter="Water" 
                                              NumberOfTapsRequired="1" />
                    </Border.GestureRecognizers>
                    <Image Source="big_heat.png" 
                           HeightRequest="84" WidthRequest="84" />
                </Border>
            </FlexLayout>
        </VerticalStackLayout>
        <VerticalStackLayout Style="{x:StaticResource InputWrapper}"
                             Margin="0,24,0,0">
            <Label Text="{translate:Localizer FilterPage.SectionTitle.Date}"
                   Style="{x:StaticResource SectiomTitle}" />
            <FlexLayout Direction="Row" JustifyContent="SpaceEvenly">
                <Frame Style="{x:StaticResource TextBoxFrame}">
                    <DatePicker x:Name="fromDatePicker"
                                Date="{Binding StartDate}"
                                MaximumDate="{Binding MaximumEndDate}" MinimumDate="{Binding MinimumDateEndDate}" />
                </Frame>
                <Frame Style="{x:StaticResource TextBoxFrame}">
                    <DatePicker x:Name="toDatePicker"
                                Date="{Binding EndDate}"
                                MaximumDate="{Binding MaximumEndDate}" MinimumDate="{Binding MinimumDateEndDate}" />
                </Frame>
            </FlexLayout>
        </VerticalStackLayout>
        <VerticalStackLayout Style="{x:StaticResource InputWrapper}"
                             Margin="0,24,0,0">
            <Label Text="{translate:Localizer FilterPage.SectionTitle.Title}"
                   Style="{x:StaticResource SectiomTitle}" />
            <Grid  HeightRequest="48">
                <Frame Style="{x:StaticResource PickerFrame}">
                    <Picker Title="{translate:Localizer FilterPage.Picker.Title}"
                            ItemsSource="{Binding ConsumptionPlaces, Mode=OneTime}"
                            ItemDisplayBinding="{Binding Name}" 
                            SelectedItem="{Binding ConsumptionPlace.Name}"
                            HorizontalTextAlignment="Start"/>
                </Frame>
                <Image Source="arrow_down.png"
                       Style="{x:StaticResource PasswordEyeIcon}"
                       Margin="0,0,24,0"
                       Grid.Row="0" Grid.Column="0">
                </Image>
            </Grid>
        </VerticalStackLayout>
        <VerticalStackLayout Style="{x:StaticResource InputWrapper}">
            <Frame Style="{x:StaticResource FormButtonContainer}">
                <Button Text="{translate:Localizer FilterPage.SubmitButton.Text}"
                        Style="{x:StaticResource FormButton}"
                        x:Name="submitButton">
                    <Button.GestureRecognizers>
                        <TapGestureRecognizer Command="{Binding ApplyFilterCommand}"
                                              NumberOfTapsRequired="1" />
                    </Button.GestureRecognizers>
                </Button>
            </Frame>
        </VerticalStackLayout>
    </VerticalStackLayout>
</master:MeterDataMasterContentPage>

有趣的部分是，当我放入边框时，整个页面都是空的，当我将其更改为框架页面上的所有元素时。 很奇怪，或者可能是我做错了什么

谢谢

Answer 1

遇到过这个问题，并认为这是由于同一页面上混合框架和边框引起的。全部转换为边框，现在可以了。