如何解决使用 WebView/媒体源在 UWP 应用程序中播放 Flask 视频源
我正在尝试从使用 Flask 在另一台机器上创建的网页流式传输 UWP 应用程序中的视频源。页面在 MS Edge 中加载,但是当 webView 指向页面时,它会永久卡在旋转轮上。
在 appxmanifest 中,我启用了专用网络(客户端和服务器)、互联网(客户端和服务器), 和互联网(客户端)。
我还尝试使用指向地址的媒体播放器源加载页面,这会因地址格式无效而引发错误。
我尝试加载的网页来源如下:
<html>
<head>
<title></title>
</head>
<body>
<img src="/video_Feed">
</body>
</html>
对于我应该使用什么类型的对象来尝试显示视频提要的任何建议,我们将不胜感激。
谢谢!
编辑:
以下是尝试使用 webView 的页面的源代码和 xaml。目前图像以每秒 20 帧的速度更新,但这可能会增加。
感谢您的帮助。
namespace GroundControl.Views
{
public sealed partial class CameraPage : Page,INotifyPropertyChanged
{
dispatcherTimer updateDataTimer;
private const string DefaultUrl = "http://127.0.0.1";
private Uri _source;
public Uri Source
{
get { return _source; }
set { Set(ref _source,value); }
}
private bool _isLoading;
public bool IsLoading
{
get
{
return _isLoading;
}
set
{
if (value)
{
IsShowingFailedMessage = false;
}
Set(ref _isLoading,value);
IsLoadingVisibility = value ? Visibility.Visible : Visibility.Collapsed;
}
}
private Visibility _isLoadingVisibility;
public Visibility IsLoadingVisibility
{
get { return _isLoadingVisibility; }
set { Set(ref _isLoadingVisibility,value); }
}
private bool _isShowingFailedMessage;
public bool IsShowingFailedMessage
{
get
{
return _isShowingFailedMessage;
}
set
{
if (value)
{
IsLoading = false;
}
Set(ref _isShowingFailedMessage,value);
FailedMesageVisibility = value ? Visibility.Visible : Visibility.Collapsed;
}
}
private Visibility _FailedMesageVisibility;
public Visibility FailedMesageVisibility
{
get { return _FailedMesageVisibility; }
set { Set(ref _FailedMesageVisibility,value); }
}
private void OnNavigationCompleted(WebView sender,WebViewNavigationCompletedEventArgs args)
{
IsLoading = false;
OnPropertyChanged(nameof(IsBackEnabled));
OnPropertyChanged(nameof(IsForwardEnabled));
}
private void OnNavigationFailed(object sender,WebViewNavigationFailedEventArgs e)
{
// Use `e.WebErrorStatus` to vary the displayed message based on the error reason
IsShowingFailedMessage = true;
}
private void OnRetry(object sender,RoutedEventArgs e)
{
IsShowingFailedMessage = false;
IsLoading = true;
webView.Refresh();
}
private async void OnopenInbrowser(object sender,RoutedEventArgs e)
{
await Windows.System.Launcher.LaunchUriAsync(webView.source);
}
public CameraPage()
{
InitializeComponent();
IsLoading = true;
Source = new Uri("http://192.168.1.100:5004");
}
public event PropertyChangedEventHandler PropertyChanged;
private void Set<T>(ref T storage,T value,[CallerMemberName]string propertyName = null)
{
if (Equals(storage,value))
{
return;
}
storage = value;
OnPropertyChanged(propertyName);
}
private void OnPropertyChanged(string propertyName) => PropertyChanged?.Invoke(this,new PropertyChangedEventArgs(propertyName));
}
}
<Page
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:behaviors="using:GroundControl.Behaviors"
xmlns:Custom="using:Microsoft.Toolkit.Uwp.UI.Controls"
x:Class="GroundControl.Views.CameraPage"
mc:Ignorable="d">
<Page.Resources>
<Style x:Key="browserButtonStyle" targettype="Button">
<Setter Property="Background" Value="Transparent" />
<Setter Property="Foreground" Value="{ThemeResource ButtonForeground}" />
<Setter Property="BorderBrush" Value="{ThemeResource ButtonBorderBrush}" />
<Setter Property="BorderThickness" Value="{ThemeResource ButtonBorderThemeThickness}" />
<Setter Property="Padding" Value="8,4,8,4" />
<Setter Property="HorizontalAlignment" Value="Left" />
<Setter Property="VerticalAlignment" Value="Center" />
<Setter Property="FontFamily" Value="{ThemeResource ContentControlThemeFontFamily}" />
<Setter Property="FontWeight" Value="normal" />
<Setter Property="FontSize" Value="{ThemeResource ControlContentThemeFontSize}" />
<Setter Property="UseSystemFocusVisuals" Value="True" />
<Setter Property="FocusVisualMargin" Value="-3" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate targettype="Button">
<Grid x:Name="RootGrid" Background="{TemplateBinding Background}">
<visualstatemanager.VisualStateGroups>
<VisualStateGroup x:Name="CommonStates">
<VisualState x:Name="normal">
<Storyboard>
<PointerUpThemeAnimation Storyboard.TargetName="RootGrid" />
</Storyboard>
</VisualState>
<VisualState x:Name="PointerOver">
<Storyboard>
<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="BorderBrush" Storyboard.TargetName="ContentPresenter">
<discreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ButtonBorderBrushPointerOver}" />
</ObjectAnimationUsingKeyFrames>
<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" Storyboard.TargetName="ContentPresenter">
<discreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ButtonForegroundPointerOver}" />
</ObjectAnimationUsingKeyFrames>
<PointerUpThemeAnimation Storyboard.TargetName="RootGrid" />
</Storyboard>
</VisualState>
<VisualState x:Name="pressed">
<Storyboard>
<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="BorderBrush" Storyboard.TargetName="ContentPresenter">
<discreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ButtonBorderBrushpressed}" />
</ObjectAnimationUsingKeyFrames>
<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" Storyboard.TargetName="ContentPresenter">
<discreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ButtonForegroundpressed}" />
</ObjectAnimationUsingKeyFrames>
<PointerDownThemeAnimation Storyboard.TargetName="RootGrid" />
</Storyboard>
</VisualState>
<VisualState x:Name="disabled">
<Storyboard>
<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="BorderBrush" Storyboard.TargetName="ContentPresenter">
<discreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ButtonBorderBrushdisabled}" />
</ObjectAnimationUsingKeyFrames>
<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" Storyboard.TargetName="ContentPresenter">
<discreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ButtonForegrounddisabled}" />
</ObjectAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
</VisualStateGroup>
</visualstatemanager.VisualStateGroups>
<ContentPresenter x:Name="ContentPresenter" AutomationProperties.AccessibilityView="Raw" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" ContentTemplate="{TemplateBinding ContentTemplate}" ContentTransitions="{TemplateBinding ContentTransitions}" Content="{TemplateBinding Content}" HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" Padding="{TemplateBinding Padding}" VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}" />
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</Page.Resources>
<Page.Style>
<StaticResource ResourceKey="PageStyle"/>
</Page.Style>
<Grid>
<Grid.RowDeFinitions>
<RowDeFinition Height="*" />
<RowDeFinition Height="Auto" />
</Grid.RowDeFinitions>
<WebView x:Name="webView" Source="{x:Bind Mode=OneWay,Path=Source}"
NavigationCompleted="OnNavigationCompleted"
NavigationFailed="OnNavigationFailed" />
<StackPanel Visibility="{x:Bind Mode=OneWay,Path=IsLoadingVisibility}"
HorizontalAlignment="Center"
VerticalAlignment="Center">
<ProgressRing IsActive="{x:Bind Mode=OneWay,Path=IsLoading}" />
<TextBlock x:Uid="Camera_Loading" />
</StackPanel>
<StackPanel Visibility="{x:Bind Mode=OneWay,Path=FailedMesageVisibility}"
HorizontalAlignment="Center"
VerticalAlignment="Center">
<TextBlock HorizontalAlignment="Center" x:Uid="Camera_FailedMessage" textwrapping="WrapWholeWords" />
<HyperlinkButton Click="OnRetry" x:Uid="Camera_Retry" HorizontalAlignment="Center" />
</StackPanel>
<Grid VerticalAlignment="Bottom" Background="{ThemeResource SystemControlChromeHighAcrylicElementMediumBrush}">
<StackPanel Orientation="Horizontal">
<Button IsEnabled="{x:Bind Mode=OneWay,Path=IsBackEnabled}" Style="{StaticResource browserButtonStyle}" Click="OnGoBack" x:Uid="Camera_browserBackButton">
<FontIcon FontFamily="Segoe MDL2 Assets" Glyph="" />
</Button>
<Button IsEnabled="{x:Bind Mode=OneWay,Path=IsForwardEnabled}" Style="{StaticResource browserButtonStyle}" Click="OnGoForward" x:Uid="Camera_browserForwardButton">
<FontIcon FontFamily="Segoe MDL2 Assets" Glyph="" />
</Button>
</StackPanel>
<StackPanel Orientation="Horizontal" HorizontalAlignment="Right">
<Button Style="{StaticResource browserButtonStyle}" Click="OnRefresh" x:Uid="Camera_RefreshbrowserButton">
<FontIcon FontFamily="Segoe MDL2 Assets" Glyph="" />
</Button>
<Button Style="{StaticResource browserButtonStyle}" Click="OnopenInbrowser" x:Uid="Camera_OpenInbrowserButton">
<FontIcon FontFamily="Segoe MDL2 Assets" Glyph="" />
</Button>
</StackPanel>
</Grid>
<Custom:AdaptiveGridView x:Name="adaptiveGridView">
<StackPanel BorderBrush="Transparent" Height="370" Width="120">
<TextBlock x:Name="BatteryLabel" HorizontalAlignment="Left" Text="Battery: " Margin="5" textwrapping="Wrap" VerticalAlignment="Top"/>
<TextBlock x:Name="LatitudeLabel" HorizontalAlignment="Left" Text="Latitude: " Margin="5" textwrapping="Wrap" VerticalAlignment="Top"/>
<TextBlock x:Name="LongitudeLabel" HorizontalAlignment="Left" Text="Longitude: " Margin="5" textwrapping="Wrap" VerticalAlignment="Top"/>
<TextBlock x:Name="AbsAltitudeLabel" HorizontalAlignment="Left" Text="ABS Alt: " Margin="5" textwrapping="Wrap" VerticalAlignment="Top"/>
<TextBlock x:Name="RelAltitudeLabel" HorizontalAlignment="Left" Text="Rel Alt: " Margin="5" textwrapping="Wrap" VerticalAlignment="Top"/>
<TextBlock x:Name="VelnorthLabel" HorizontalAlignment="Left" Text="Vel north: " Margin="5" textwrapping="Wrap" VerticalAlignment="Top"/>
<TextBlock x:Name="VelEastLabel" HorizontalAlignment="Left" Text="Vel East: " Margin="5" textwrapping="Wrap" VerticalAlignment="Top"/>
<TextBlock x:Name="VelForwardLabel" HorizontalAlignment="Left" Text="Vel Forw: " Margin="5" textwrapping="Wrap" VerticalAlignment="Top"/>
<TextBlock x:Name="VelDownLabel" HorizontalAlignment="Left" Text="Vel Down: " Margin="5" textwrapping="Wrap" VerticalAlignment="Top"/>
<TextBlock x:Name="distanceDownSenseLabel" HorizontalAlignment="Left" Text="dist Down: " Margin="5" textwrapping="Wrap" VerticalAlignment="Top"/>
<TextBlock x:Name="YawAngleLabel" HorizontalAlignment="Left" Text="Yaw Angle: " Margin="5" textwrapping="Wrap" VerticalAlignment="Top"/>
<TextBlock x:Name="YawCamAngleLabel" HorizontalAlignment="Left" Text="Yaw Deg: " Margin="5" textwrapping="Wrap" VerticalAlignment="Top"/>
<TextBlock x:Name="PitchCamAngleLabel" HorizontalAlignment="Left" Text="Pitch Deg: " Margin="5" textwrapping="Wrap" VerticalAlignment="Top" Width="67"/>
</StackPanel>
</Custom:AdaptiveGridView>
</Grid>
</Page>
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。