I want to setup my raspberry pi 3 that is running Windows 10 IoT to display a webpage, specifically this page. My issue is, that looking at IoTBrowser sample code, and I can't figure out how to remove the buttons and address bar and get the webpage to autoload. So I'm asking if anyone has code I can use for it?
The instructions I was trying to follow for removing all the display elements except for the webpage its self can be found here, but it really confuses me.
My issue is, that looking at IoTBrowser sample code, and I can't
figure out how to remove the buttons and address bar and get the
webpage to autoload.
You can remove all buttons and address bar except webView in xaml and utilize OnNavigatedTo method to achieve autoload purpose. Then what you need are a few lines code like this:
In MainPage.xaml :
<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<WebView x:Name="webView"/>
</Grid>
In MainPage.xaml.cs :
protected override void OnNavigatedTo(NavigationEventArgs e)
{
var address = "https://www.windowsondevices.com";
webView.Navigate(new Uri(address));
}
Related
Solution at the end.
I have a hard time finding informations about a youtubeplayer in uwp following the MVVM pattern.
What are the differences between <MediaElement> and <WebView> in this context and what would be better/easier to use?
How do I handle the events of the Player in my VM?
VS2017 tells me that i can't use the MediaPlayerElement
Error Message
I tried other versions/builds of VS2017 but get the same error.
Are there other ways to do this?
TY
Edit:
<WebView> seems to be pretty easy. Are there any downsides using it?
<WebView x:Name="webView" Width="300"
Height="225" Source="https://www.youtube.com/watch?v=2Rg1XmzzrTM"
RelativePanel.AlignHorizontalCenterWithPanel="True"
RelativePanel.Below="linkYT"/>
Edit2:
Thanks to Aditya Sharma I got on the right Track and found this Question
So I ended up with the following:
View:
<MediaElement x:Name="ytPlayer"
AreTransportControlsEnabled="True"
Source="{Binding Test1, Mode=OneWay}"
Width="600"
AutoPlay="True"
Height="400"/>
VM:
public void doSomething()
{
...
test1 = new Uri(convertLink(currentMovie.TrailerSource));
...
}
private string convertLink(string link)
{
IEnumerable<VideoInfo> videoInfos = DownloadUrlResolver.GetDownloadUrls(link, false);
VideoInfo video = videoInfos
.First(info => info.VideoType == VideoType.Mp4 && info.Resolution == 720
);
return video.DownloadUrl;
}
Where Test1 is of Type Uri and currentMovie.TrailerSource is a string
For this to work I had to get the NuGet YouTubeExtractor.
Hope this Helps somebody get it done MVVM.
So here is the thing, We have 1. WebView and 2. MediaElement
Let's take up a deep dive into these:
WebView: is basically a phone in app browser. you can give it a link and it'll navigate to the webPage. You can use it for your youtube screening but there will be downsides:
You won't be able to use native controls like pause/play/seek locally. All the controls will be handled by the website rendered in a WebView.
You have no control on the UI as well. You'll see the basic embedded youtube UI in your app WebView that might just break your UI and might also just provide a pixelated view when scaled.
MediaElement on the other hand is quite convenient, it has a source property that takes a Uri datatype as well so the great thing is that you can pass in your Uri as the embedded link for the youtube vid, the MediaElement will handle everything for you plus, it'll give you some additional advantages like control over your UI, Play/Pause or even custom styling and autoplay/playRate options.
So In my opinion, I would say use a MediaElement over the webView as it'll provide you with more control over whats happening and also provide a native experience to the user.
You can find some more information on it here
in this question and in it's comments section.
Also, since you'll be using mvvm on windows 10, I would recommend you x:bind the Source property of the MediaElement to a Uri DataType property in a oneWay Mode in your ViewModel
I am trying to detect the url that is being sent back by this url when it is being played by a webview, however I am unable to find how to do this.
The app is recieving dmevent urls and i want to be able to catch them, does anyone have any idea how to do that?
here is my code:
XAML:
<WebView x:Name="DmWebView"
Width="600" Height="300"
/>
c#:
DmWebView.Source = new Uri("http://www.dailymotion.com/embed/video/x285bo8?html=1&controls=1&autoplay=1&api=location");
Windows message I am getting in the simulator:
So I to answer my old question, the only way for your JavaScript to be able to communicate with your XAML WebView correctly all of the events that are fired from your JavaScript side must be warped in this: window.external.notify("your value"); This is the only way that I have found to resolve this issue.
I have a simple WP8 app with 2 pages. In MainPage the user can navigate to Page2 to see a couple of images from the net. To do this I use a WebClient
WebClient myWebClient;
myWebClient = new WebClient();
myWebClient.DownloadStringAsync(mywebsite);
myWebClient.DonwloadStringCompleted += new DownloadStringCompletedEventHandler(myWebClient_Completed);
Afther that, I display the images in a StackPanel wrapped inside a ScrollViewer that looks like this
<ScrollViewer>
<StackPanel x:Name= myPanel/>
</ScrollViewer>
When i try to navigate back and forth between the pages, the app crashes after several times. I believe this is a memory leak.
My question is: What are the steps that need to be done when navigating away from Page2?
I tried to unhook the event handler:
myWebClient.DonwloadStringCompleted -=myWebClient_Completed;
and tried to free the Images from the StackPanel:
foreach(var theImage in myPanel.Children){
theImage.Source=null;
}
But it's no use. What am I missing? or maybe the syntax isn't right?
Thanks for help in advance.
I am creating a windows phone quiz app. it also displays short videos as questions which the users answers on. i have been able to use this code to display videos from a local directory. but my app package file gets so large if i will have to include too many videos locally. so i decided to try loading from internet once the users needs it.
this is my XAML code:
<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
<Grid HorizontalAlignment="Left" Height="186" Margin="10,132,0,0" VerticalAlignment="Top" Width="436">
<Core:SMFPlayer PositionLiveBuffer="0:0:9" EstimatedLiveDuration="0:0:30" VolumeLevel="0.9">
<Core:SMFPlayer.SelectedAudioStream>
<Media:StreamMetadata/>
</Core:SMFPlayer.SelectedAudioStream>
<Core:SMFPlayer.Playlist>
<Media:PlaylistItem x:Name="media" DeliveryMethod="ProgressiveDownload" MediaSource="Assets/Kedike.wmv" MediaType="Entertainment" Title="song" FileSize="2413589" FrameRate="1045" VideoHeight="268" VideoWidth="512" Description=" vodeo" JumpToLive="True"/>
</Core:SMFPlayer.Playlist>
</Core:SMFPlayer>
</Grid>
</Grid>
This code works when the videos are loaded from a local source i.e /videos/kedike.wmv. i saw this code online and it actually was able to get a video with this:
mediasource = "http://ecn.channel9.msdn.com/o9/content/smf/smoothcontent/bbbwp7/big buck bunny.ism/manifest"
But to do this from the net, the DeliveryMehod property is set to ="AdaptiveStreaming"
i wondered what file type is that and i tried replacing the source with a youtube video link and a facebook video link. none of these works.
I need help in doing this.
Then i want to change the mediasource programatically. i.e through the xaml.cs file. i think declaring
media.MediaSource = new Uri("http://....", UriKind=Relative);
Dont know if this will work.
I tried doing this since i have been able to load videos locally but i get error that i have not initialised or created a new instance of the media element (not the windows phone xna media)
i got some other errors while trying to change some other things.
my C# CODE IS:
private void secondvideo()
{
media.MediaSource = new Uri("Videos/kedike2.wmv", UriKind.Relative);
}
i want to play a second video with this code and i get error. this is the link to where i got the code.code link
You can't just use any kind of link in MMPPF due to its limitation. You need to have the exact URL of the video.
Youtube videos' URL(the exact ones) are generally too large. If you really want to load youtube videos in MMPPF(though I think it's not legal to use Youtube videos in your own Media Player) use this which is available via NuGet.
You can use this toolkit to fetch the exact youtube video URL and use it in your own player.
I need to create a Windows8 application but there are multiple elements like progress bar, same app bar and other components that are been used over and over again. In previous application i have been applying these elements in every page. Is there some approach by which I can make a master page and inhert an use it in every page. As we can do in ASP.Net Master page concept?
You have to deal with frames :
<Page x:Name="MainPage">
<Grid x:Name="LayoutRoot">
<Frame x:Name="BasicLayout"/>
<Frame x:Name="SpecificLayout"/>
</Grid>
</Page>
Use BasicLayout to show components that are been used over and over again.
Use SpecificLayout to show your page-specific content (So you don't directly navigate from the "master" Frame, but from the SpecificLayout one).
Here is nice tutorial how to create master page for Windows 8 application
Windows 8 master page tutorial