Get multiple WebViews in my Win8 app to share focus - c#

I'm building a Windows 8 prototype for a large touch enabled 4K screen. My client has a library of existing HTML5 games (the game source is unavailable) they want multiple people to be able to play these browser games on the 4K display at once.
I've inserted 2 WebViews into my app and the games load fin; but only one game can have focus at once, forcing every other game into it's pause screen (automatic behavior in the game when the browser doesn't have focus).
My question is: Is their a way I can prevent the WebView from losing focus or prevent it from knowing that it lost focus? My existing XAML looks like this:
<Grid x:Name="MainGrid">
<Grid.ColumnDefinitions>
<ColumnDefinition Width=".5*"></ColumnDefinition>
<ColumnDefinition Width=".5*"></ColumnDefinition>
</Grid.ColumnDefinitions>
<WebView Name="LeftBrowser"
Grid.Column="0"
Source="{Binding LeftBrowserURL, ElementName=browserWin8Window}"/>
<WebView Name="RightBrowser"
Grid.Column="1"
Source="{Binding RightBrowserURL, ElementName=browserWin8Window}"/>
</Grid>
Tldr: I have mutiple WebViews in my Windows Modern app, is there a way I can make them all think they have focus at once?
P.S.: if this is easily done in something else that runs on Windows, please tell me.

If anyone else needs to do something like this in the future, I solved my problem using the WPF version of CefSharp with a custom IWpfFocusHandler.

Related

UWP Window content doe not resize with window

I started to develop my first UWP App (just for fun). While debugging I noticed that the content would not adapt correctly when resizing the window. I started over with an empty app to see, if it was a general problem: it is.
TL;DR:
Why does this happen when resizing the window larger (beyond 1246x936 px)? Notice the issue on the very right.
That's the XAML code:
<Page
x:Class="App2.MainPage"
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:local="using:App2"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
HorizontalAlignment="Stretch"
VerticalAlignment="Stretch"
mc:Ignorable="d">
<Grid Background="White">
<Grid.ColumnDefinitions>
<ColumnDefinition />
<ColumnDefinition Width="3*" />
</Grid.ColumnDefinitions>
<Grid Grid.Column="0" Background="Blue" />
<Grid Grid.Column="1" Background="Red" />
</Grid>
</Page>
Little late but for posterity as this issue still comes up:
This behavior is most likely related to UWP and your video drivers. I have had this issue and it also extended into official Microsoft Windows Store UWP apps (Weather, Calc, etc) verifying it was not something I caused.
If you're lucky and have video driver updates, install them and it will likely fix the issue (it did for me on two different computers, one with an AMD card the other with Intel graphics). If your video drivers are out of support there may not be a path forward (although the app would work on workstations whose drivers did render it correctly).
There are a few tips on this thread that -may- work for workarounds for yourself (but aren't ideal if you're distributing your program and actually need it to render consistently).
https://superuser.com/questions/1376099/windows-10-uwp-not-rendering-fully
Run Performance Options (SystemPropertiesPerformance.exe) and uncheck "Show window contents while dragging". Then reboot.
Resize the window, then close and reopen the application, and it might then be of the right size.

MediaElement1 is playing, but MediaElement2 isn't. | C#

I'm using MediaElements to play Local Sound Files In a WP7 Application (MP3's)
I'm using this system for Background Music (Ambience) and Button Clicks (User interaction) so there is no need for users to pause/rewind/restart this sound.
These are "play and forget" sounds, and I'd like two or three sounds to be playing simultaniously -- but right now that doesn't happen.
--
When I attempt to play My 'ButtonClick' mp3 file through the MediaElement, it works, and it can also be stopped and then restarted if the user clicks the button again.
I have it set up so when a button is clicked, the sound plays - which it does.
Problems:
However, my second MediaElement that is set up to play the Ambience track at the same time doesn't even play, as if it is broken, or the track cannot be found. Despite asking it to play in my code, and checking the code.
Is there any way to make two MediaElements play Simultaniously? I actually think I did it before, but I forgot how I actually achieved it.
Current Code:
XAML
<MediaElement Height="120"
HorizontalAlignment="Left" Margin="89,263,0,0"
Name="mediaElement2" VerticalAlignment="Top"
Width="160" Source="Audio/ButtonClick.mp3" AutoPlay="False" />
<MediaElement Height="120"
HorizontalAlignment="Left" Margin="89,263,0,0"
Name="mediaElement1" VerticalAlignment="Top"
Width="160" Source="Audio/OverviewMusic.mp3" AutoPlay="False" />
C#
mediaElement2.Stop();
mediaElement2.Play();
Only One MediaElement can play at any given time.
Xna has functions which allow for more sounds to be playing at once, however XAML and CS don't come with this as default.

Keeping Window "Docked" In Same Place C#/Wpf

I'm working on a windows wpf app to do fluid modeling using an open source engine called epanet. There is already an open source UI written in Pascal, we are trying to create one like it with added features and usability.
I want the app to start and have a main window with a couple tool bars and 2 separate sub-windows inside, as in the original epanet UI software (take a look at some of the screen shots in the link below). What is the best way to go about this?
http://engineering.wayne.edu/wsuwater/hydraulics/epanet.php
I tried using "popup" from this forum post:
http://social.msdn.microsoft.com/Forums/en-US/wpf/thread/bf51e572-b41e-487b-99d0-95262899ef2c/
It was far to finicky and hard to control. Instead, I just created a new window and had it open after the MainWindow() class is loaded.
InitializeComponent();
DrawingArea Init_Canvas = new DrawingArea();
Init_Canvas.Show();
This works great, other than that the user has to manually adjust it to the right size and placement every time.
How do I go about getting it stay tidily tucked in the corner?
I'm not positive I understand the question but it seems like you need to display controls on top of one another. I too ran into problems with popups too and used this code as an alternative:
<Grid>
<Canvas Grid.Row="0" Grid.Column="0">
<TextBlock FontSize="55">One</TextBlock>
</Canvas>
<Canvas Grid.Row="0" Grid.Column="0">
<TextBlock FontSize="55">Two</TextBlock>
</Canvas>
</Grid>
Basically you set both controls to be row=0 and column=0 and they will display on top of one another. Maybe this doesn't meet your needs, but it is a nice trick.

How can I pop a control out of it's container to make it full screen when clicked in Silverlight/Wp7?

So I have a Panorama control and the PanoramaItems are programmatically added to the control using the following template.
<UserControl>
<Grid x:Name="LayoutRoot">
<controls:PanoramaItem Name="sitePanoramaItem" Header="{Binding Name}">
<Controls:DockPanel VerticalAlignment="Stretch">
<StackPanel Orientation="Horizontal" Margin="0,10,0,0" Controls:DockPanel.Dock="Top">
<Image Source="../Images/action.png" Width="64" />
<TextBlock Text="{Binding Stats, Mode=TwoWay}" FontSize="45" Margin="15,0,0,0" />
</StackPanel>
<Grid x:Name="graphCanvas" HorizontalAlignment="Stretch" Margin="10,10,10,10"> </Grid>
</Controls:DockPanel>
</controls:PanoramaItem>
</Grid>
</UserControl>
When I click on graphCanvas what I'd like to do is sorta pop the graphCanvas out and display that fullscreen then when I click again restore it to where it was. I've been all over this site and Google and can't find anything similar to what I'm looking for.
I would still like to maintain the Panorama control functionality so that the graphCanvas is still the only one visible but you can cycle through them. Currently I have it sorta working in that I remove the Grid from the DockPanel and put it directly in the LayoutRoot while making the sitePanoramaItem collapsed. However, it's not fullscreen as the Panorama name is still visible (I guess I could hide that as well...) When I put the graphCanvas back int he DockPanel the size of the canvas is all screwed up.
I was hoping there was a simpler way.
Is it even possible?
It is possible to create the UI you describe but it's not going to be simple. You're on the right track with removing it in code and adding it the LayoutRoot and making the Panorama hidden. However you would have to code the scrolling behavior yourself and that is going to be quite tricky - especially making it feel the way to panorama does.
One trick you could try is actually layer a PivotControl on top of your Panorama and have it be collapsed by default. Also edit it's template to remove all default content eg: remove the header control, set margins to 0, etc). Then when you want to go full screen you can remove all the graphCanvases from the Panorama items and and add them to new PivotItems in the PivotControl. Then hide the Panorama and show the Pivot. This will give you scrolling capability for free and the illusion of full screen.
Having said all that I'm not sure I would recommend this. The more common approach would be to simply be to navigate to another page when the user selects an item and handle the full screen aspects there (possibly using the Pivot control again for scrolling). And when you want to leave "fullscreen" mode simply navigate back to the first page. Handling Tombstoning of the fullscreen state will be much easier with this approach for one thing.
You can try making the graphCanvas a Page and putting it in a different XAML. Then add a frame (name it InnerFrame for example) in the same place where you have the graphCanvas right now and navigate to that page with InnerFrame. When the frame is clicked, you navigate with the RootFrame of the app to your graphCanvas page. When you decide to close it, just navigate back with the RootFrame.
Hope it's clear enough :)
Edit:
Navigation in WP7 works very similar as the standard navigation in Silverlight 4, but it's a bit more restrictive. Just throw a PhoneApplicationFrame in your XAML like this:
<phone:PhoneApplicationFrame x:Name="Frame" />
This is basically the same as a Silverlight frame. All the pages you create inherit from PhoneApplicationPage by default, so they can be showed in a frame without any changes.
Your whole application actually runs on a PhoneApplicationFrame. If you take a look at your App class you will see this:
public PhoneApplicationFrame RootFrame { get; private set; }
Here's the MSDN documentation for the navigation system on WP7

Code examples for a wallpaper app?

I would like to write a C# app that runs like an overlay on the desktop wallpaper. Similar to the way that desktop widgets or Rainmeter(rainmeter.net) runs; behind other apps but on top of the desktop wallpaper.
I cannot find any C# examples of this kind of behavior. Can someone point to me to some code?
Here is an example of what I am interested in creating: http://jabz.us/uploaded_images/screenCaptureRainmeter.png
Why not just use WPF windows that are borderless (and therefore static, but you can move them again by using this code), transparent and below all other windows? You may have to poll each window under the rest every 100ms or so incase the user accidentally clicks it. I have made a little test with just some labels and it looks fine.
For example, use this code and poll the "below all other windows" method every so often.
<Window x:Class="WpfTest.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="LearnWPF.BorderlessWindow" Height="200" Width="200"
WindowStyle="None" ResizeMode="NoResize" AllowsTransparency="True"
Background="Transparent"
>
<Border Padding="5" BorderBrush="#feca00"
BorderThickness="3" Width="150" Height="150">
<TextBlock>Learn WPF!</TextBlock>
</Border>
</Window>

Categories

Resources