Question

我有一项功能，允许用户在设备上的FrontFacing和主摄像头之间切换。在切换过程中，我想向用户显示ProgressBar和TextBlock。出于某种原因，我无法将这些显示在视图中，并且在切换过程中唯一显示的是未旋转的VideoBrush的冻结图像

MainPage.xaml中

<Grid.RowDefinitions>
            <RowDefinition Height="72"/>
            <RowDefinition Height="*"/>
            <RowDefinition Height="68"/>
            <RowDefinition Height="72"/>
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="72"/>
            <ColumnDefinition Width=".33*"/>
            <ColumnDefinition Width=".33*"/>
            <ColumnDefinition Width=".33*"/>
            <ColumnDefinition Width="72"/>
        </Grid.ColumnDefinitions>

        <!-- Center this on the screen --> 
        <Canvas x:Name="VideoCanvas" Grid.Row="0" Grid.RowSpan="4" Grid.ColumnSpan="5" 
                VerticalAlignment="Center" HorizontalAlignment="Center">
            <Canvas.Background>
                <VideoBrush x:Name="videoBrush">
                    <VideoBrush.RelativeTransform>
                        <CompositeTransform x:Name="videoBrushTransform" 
                                        CenterX="0.5" CenterY="0.5"/>
                    </VideoBrush.RelativeTransform>
                </VideoBrush>
            </Canvas.Background>
        </Canvas>

        ...

        <StackPanel Grid.Row="1" Grid.ColumnSpan="5" VerticalAlignment="Center">
            <ProgressBar x:Name="progressIndicator" IsIndeterminate="False" Background="Transparent"/>
            <TextBlock x:Name="modeChangeTextBlock" Margin="12"
                   VerticalAlignment="Top" HorizontalAlignment="Center" FontSize="28" 
                   Foreground="{StaticResource PhoneSubtleBrush}"/>
        </StackPanel>

MainPage.xaml.cs中

void sensor_Click(object sender, EventArgs e)
    {
        CameraType type = camera.CameraType;

        //Switch to other camera, if available
        if(type == CameraType.Primary)
        {
            if(PhotoCamera.IsCameraTypeSupported(CameraType.FrontFacing) == true)
            {
                ShowProgress("Switching cameras");
                UninitializeCamera();
                InitializeCamera(CameraType.FrontFacing);
                HideProgress();
            }
        }
        else
        {
            if(PhotoCamera.IsCameraTypeSupported(CameraType.Primary) == true)
            {
                ShowProgress("Switching cameras");
                UninitializeCamera();
                InitializeCamera(CameraType.Primary);
                HideProgress();
            }
        }
    }

    ...

    private void ShowProgress(String msg)
    {            
        progressIndicator.IsIndeterminate = true;
        modeChangeTextBlock.Text = msg;
        //progressIndicator.Visibility = Visibility.Visible;
    }

    private void HideProgress()
    {
        progressIndicator.IsIndeterminate = false;
        modeChangeTextBlock.Text = "";
        //progressIndicator.Visibility = Visibility.Collapsed;
    }

EDIT *添加在现有的xaml代码下面进行测试

<Rectangle x:Name="cameraSwitchingFill" Visibility="Visible"
                   Fill="{StaticResource SelfiePageBackgroundColorBrush}" 
                   Grid.Row="0" Grid.Column="0" Grid.RowSpan="4" Grid.ColumnSpan="5"/>

        <StackPanel Grid.Row="1" Grid.ColumnSpan="5" VerticalAlignment="Center">
            <ProgressBar x:Name="progressIndicator" IsIndeterminate="True" Background="Transparent"/>
            <TextBlock x:Name="modeChangeTextBlock" Margin="12"
                   VerticalAlignment="Top" HorizontalAlignment="Center" FontSize="28" 
                   Foreground="{StaticResource PhoneSubtleBrush}" Text="test"/>
        </StackPanel>

添加的编辑试图了解在摄像机切换期间未显示进度条的原因。设置要在屏幕上看到的所有内容，当我第一次导航到此页面时，我看到的是cameraSwitchingFill矩形，上面没有ProgressBar或TextBlock（虽然在设计器中我可以看到这些很好）。在切换摄像机时（如预期的那样），我看到了矩形但没有ProgressBar或TextBlock。

然后我回去不显示编辑和修改

void sensor_Click（对象发送者，EventArgs e） { //切换到其他相机（如果有） CameraType type = camera.CameraType;

        if(type == CameraType.Primary)
        {
            if(PhotoCamera.IsCameraTypeSupported(CameraType.FrontFacing) == true)
            {
                ShowProgress(AppResources.CapturePage_SwitchingCameras);
                cameraSwitchingFill.Visibility = Visibility.Visible;
                UninitializeCamera();
                InitializeCamera(CameraType.FrontFacing);
                cameraSwitchingFill.Visibility = Visibility.Collapsed;
                HideProgress();
            }
        }
        else
        {
            if(PhotoCamera.IsCameraTypeSupported(CameraType.Primary) == true)
            {
                ShowProgress(AppResources.CapturePage_SwitchingCameras);
                cameraSwitchingFill.Visibility = Visibility.Visible;
                UninitializeCamera();
                InitializeCamera(CameraType.Primary);
                cameraSwitchingFill.Visibility = Visibility.Collapsed;
                HideProgress();
            }
        }
    }

因此结果是当我永久地在屏幕上显示矩形和进度条时，只显示矩形，直到第一个相机切换点击事件发生，此后都不会显示矩形或进度条。此外，即使在xaml中的videobrush实现下面声明的矩形和进度条在此期间设置为可见，在切换期间冻结的图像仍保留在屏幕上。

Answer 1

愿这对你有所帮助。试试这个

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

         <!-- Center this on the screen -->
                    <Canvas x:Name="VideoCanvas" Grid.Row="0" >
                        <Canvas.Background>
                            <VideoBrush x:Name="videoBrush" >
                                <VideoBrush.RelativeTransform>
                                    <CompositeTransform x:Name="videoBrushTransform" 
                                                    CenterX="0.5" CenterY="0.5"/>
                                </VideoBrush.RelativeTransform>
                            </VideoBrush>
                        </Canvas.Background>
                    </Canvas>
              <StackPanel Grid.Row="0"  VerticalAlignment="Center">
         <TextBlock x:Name="modeChangeTextBlock" Margin="12" VerticalAlignment="Top" HorizontalAlignment="Center" FontSize="28" Foreground="{StaticResource PhoneSubtleBrush}"/>
         <ProgressBar x:Name="progressIndicator" IsIndeterminate="False" Grid.RowSpan="4" />
           </StackPanel>
    </Grid>

Answer 2

声明中没有错。它只是你做出声明的顺序是不正确的。

网格中的重叠是按照您编写xaml

的顺序完成的

在给定包含文本块和进度条的Panel的xaml放置在第一个位置，然后包含Videobrush的面板与第一个面板重叠（隐身背后的主要原因）。因此，如果您希望面板可见，只需在包含videobrush的面板下方声明一级。这样可以帮助具有进度条的面板与包含视频冲击的面板重叠。

因此更新的声明现在变为

  <Grid.RowDefinitions>
            <RowDefinition Height="72"/>
            <RowDefinition Height="*"/>
            <RowDefinition Height="68"/>
            <RowDefinition Height="72"/>
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="72"/>
            <ColumnDefinition Width=".33*"/>
            <ColumnDefinition Width=".33*"/>
            <ColumnDefinition Width=".33*"/>
            <ColumnDefinition Width="72"/>
        </Grid.ColumnDefinitions>

        <!-- Center this on the screen -->


            <Canvas x:Name="VideoCanvas" Grid.Row="0" Grid.RowSpan="4" Grid.ColumnSpan="5">
            <Canvas.Background>
                <VideoBrush x:Name="videoBrush" >
                    <VideoBrush.RelativeTransform>
                        <CompositeTransform x:Name="videoBrushTransform" 
                                        CenterX="0.5" CenterY="0.5"/>
                    </VideoBrush.RelativeTransform>
                </VideoBrush>
            </Canvas.Background>
        </Canvas>

        <StackPanel Grid.Row="1" Grid.ColumnSpan="5" VerticalAlignment="Center">
            <ProgressBar x:Name="progressIndicator" IsIndeterminate="True" Background="Transparent"/>
            <TextBlock x:Name="modeChangeTextBlock" Margin="12" Text="loading"
                   VerticalAlignment="Top" HorizontalAlignment="Center" FontSize="28" 
                   Foreground="White"/>
        </StackPanel>

希望这有帮助。

如何在VideoBrush上显示ProgressBar

2 个答案: