Camera.MAUI 条形码检测不适用于绝对布局或网格，但适用于滚动视图垂直布局

Question

我正在尝试使用绝对布局或网格*来实现它，这样无论您使用什么设备，我的相机视图都会占据整个屏幕，但是当我这样做时，不会检测到条形码。在我使用滚动视图和垂直堆栈布局之前，我什至重新做了一遍以确保这是因为这个。

`这是我试图做的两个例子：

使用绝对布局：

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:cv="clr-namespace:Camera.MAUI;assembly=Camera.MAUI"
             x:Class="J2MobilePClock.CameraPage">

    <ContentPage.ToolbarItems>
        <ToolbarItem Order="Secondary" Text="Punch in" Clicked="BtnMainPage_Clicked"/>
    </ContentPage.ToolbarItems>

    <AbsoluteLayout>
        <cv:CameraView x:Name="cameraView" IsVisible="True"
            CamerasLoaded="cameraView_CamerasLoaded" BarCodeDetectionEnabled="True"
            BarcodeDetected="cameraView_BarcodeDetected"
            AbsoluteLayout.LayoutFlags="All"
            AbsoluteLayout.LayoutBounds="0,0,1,1"/>

    </AbsoluteLayout>
</ContentPage>

使用网格：

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:cv="clr-namespace:Camera.MAUI;assembly=Camera.MAUI"
             x:Class="J2MobilePClock.CameraPage">

    <ContentPage.ToolbarItems>
        <ToolbarItem Order="Secondary" Text="Punch in" Clicked="BtnMainPage_Clicked"/>
    </ContentPage.ToolbarItems>

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

        <cv:CameraView x:Name="cameraView" IsVisible="True"
            CamerasLoaded="cameraView_CamerasLoaded" BarCodeDetectionEnabled="True"
            BarcodeDetected="cameraView_BarcodeDetected"/>
    </Grid>
</ContentPage>

我希望它能够正常工作，因为相机视图的其他高度和宽度根本没有被编辑。 这是我之前工作时的情况：

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:cv="clr-namespace:Camera.MAUI;assembly=Camera.MAUI"
             x:Class="J2MobilePClock.CameraPage">

    <ContentPage.ToolbarItems>
        <ToolbarItem
          Order="Secondary"
          Text="Punch in" 
          Clicked="BtnMainPage_Clicked"/>

    </ContentPage.ToolbarItems>

    <ScrollView>
        <VerticalStackLayout
            Spacing="25"
            Padding="30,0"
            VerticalOptions="Center">

            <cv:CameraView x:Name="cameraView" WidthRequest="600" HeightRequest="800" IsVisible="True"
                CamerasLoaded="cameraView_CamerasLoaded" BarCodeDetectionEnabled="True"
                BarcodeDetected="cameraView_BarcodeDetected"/>

        </VerticalStackLayout>
    </ScrollView>
</ContentPage>

Answer 1

无论您使用什么设备，我的相机视图都会占据整个屏幕 使用。

您需要添加

 HorizontalOptions="FillAndExpand"

的

VerticalOptions="FillAndExpand"

和

CameraView

使其全屏，然后扫描条形码或二维码。

以下代码供您参考：

XAML：

<ScrollView>
       
 
        <Grid>
         
            <cv:CameraView x:Name="cameraView"  
                           HorizontalOptions="FillAndExpand"
                           VerticalOptions="FillAndExpand"
                           CamerasLoaded="cameraView_CamerasLoaded"
                           BarCodeDetectionEnabled="True"
                           BarcodeDetected="cameraView_BarcodeDetected"/>

       </Grid>
</ScrollView>

隐藏代码：

 private void cameraView_CamerasLoaded(object sender, EventArgs e)
 {
        if (cameraView.Cameras.Count > 0)
        {
              cameraView.Camera = cameraView.Cameras.First();
              MainThread.BeginInvokeOnMainThread(async () =>
              {
                    await cameraView.StopCameraAsync();
                    await cameraView.StartCameraAsync();
               });
         }
 }

 private void cameraView_BarcodeDetected(object sender, Camera.MAUI.ZXingHelper.BarcodeEventArgs args)
  {
        MainThread.BeginInvokeOnMainThread(() =>
        {
                System.Diagnostics.Debug.WriteLine(args.Result[0]);
        });
  }