Pubcenter Ad is not clickable - xaml

I'm bashing my head with weird problem, the ads from microsoft pubcenter are not clickabkle when
application uses D3D/XAML interop.
BUT I see many games on windows store that have pubcenter ads and clearly uses d3d/xaml - how to make those two to work together ?
Simple steps to reproduce the problem:
(VS2013 - with all the latest updates, pibcenter ctrl also updated to latest version)
VS2013 -> New -> Project -> (Visual C++ / Store Apps) -> DirectX and XAML App (Windows phone)
(NOTE: This is Windows phone 8.1 app, NOT windows phone 8.1 silverlight app)
when the project is created, just go to DirectXPage.xaml
and edit it to look as follow:
<Page
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:AdTest"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:UI="using:Microsoft.Advertising.Mobile.UI"
x:Class="AdTest.DirectXPage"
mc:Ignorable="d">
<SwapChainPanel x:Name="swapChainPanel">
<!-- Grid definition, to place ad on bottom (may remove if no ads) -->
<Grid.RowDefinitions>
<RowDefinition Height="*"/>
<RowDefinition Height="50"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<TextBlock Text="Hello from XAML!"
HorizontalAlignment="Right"
VerticalAlignment="Top"
FontSize="30" />
<UI:AdControl Grid.Column="0" Grid.Row="1" x:Name="adBanner" AutoRefreshIntervalInSeconds="60" ApplicationId="xxxxxxxxxxx" AdUnitId="xxxxx" HorizontalAlignment="Right" Height="50" IsAutoRefreshEnabled="True" Margin="0,0,0,0" VerticalAlignment="Bottom" Width="320"/>
</SwapChainPanel>
<!-- Uncomment this if using the app bar in your phone application.
<Page.BottomAppBar>
<CommandBar>
<AppBarButton Icon="Play" AutomationProperties.Name="Sample Button"
AutomationProperties.AutomationId="SampleAppBarButton" Click="AppBarButton_Click" />
</CommandBar>
</Page.BottomAppBar>-->
</Page>
replace xxxxx with real app / unit ids and run the sample - now when the banner shows up, try to click on it -- it does not work :/
Is there any way to make it clickable ? (it's not covered by any other controll, it gets it's input properly, so I do not know what the issue may be).

Have you solve your problem?
IT seems that this is related with it being a c++ app, I am also with a lot of problems with it.
One workaround that I found was to ad the method Tapped into the control:
adPubcenter->Tapped += ref new Windows::UI::Xaml::Input::TappedEventHandler(this, &OpenGLESPage::OnAdTapped);
void OpenGLESPage::OnAdTapped(Platform::Object^ sender, Windows::UI::Xaml::Input::TappedRoutedEventArgs^ e){
And then
void OpenGLESPage::OnAdTapped(Platform::Object^ sender, Windows::UI::Xaml::Input::TappedRoutedEventArgs^ e){
//Handle touch yourself (ie. opens a game that you have)
Windows::System::Launcher::LaunchUriAsync(ref new Uri("http://www.windowsphone.com/s?appid=bb8d4ce2-1853-47b6-9b0d-bb1af5a07436"));
}
At least this way the ad does something when clicked.

Related

Issues with child page's display when using Frames

Problem
This is the layout of my main pane:
<Page
x:Class="Communities.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:Communities"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d" Loaded="Page_Loaded" DataContext="{Binding RelativeSource={RelativeSource Mode=Self}}">
<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<Grid.RowDefinitions>
<RowDefinition Height="48" />
<RowDefinition Height="*" />
<RowDefinition Height="auto" />
</Grid.RowDefinitions>
...
<SplitView Grid.Row="1" Name="hamburgerMenu" OpenPaneLength="200" PaneBackground="#F02A2A2A">
<SplitView.Pane>
<ListView ItemsSource="{Binding}" IsItemClickEnabled="True" ItemClick="HamburgerItemClick">
... </ListView>
</SplitView.Pane>
<Frame Name="frame" />
</SplitView>
<Grid Grid.RowSpan="3" Name="popupArea" />
</Grid>
</Page>
the frame is where I load all my pages, so that the layout is always consistant.
Now, in most of my child pages I have defined AppBar control and attached it to the BottomAppBar property of that child page:
PostView.xaml
...
<Page.BottomAppBar>
<CommandBar>
<AppBarButton Label="Back" Icon="Back" Click="TryGoBack" />
<AppBarButton Label="Refresh" Icon="Refresh" Click="TryRefreshComments" />
<AppBarButton Label="Go to Community" Icon="Go" Click="TryOpenCommunity" />
</CommandBar>
</Page.BottomAppBar>
...
Here's where the trouble starts. It works fine on PC, as the layout is mostly static on desktop. There are no software keyboards required most of the time etc. On mobile it's more problematic: Screenshots
My thoughts
It seems like the frame that is used to display the child page is causing all sorts of problems. When the AppBar is defined in the main page it positions correctly.
I'd like to avoid the keyboard covering the textbox as well as the AppBar but I don't want to get rid of the frame control. I'd also prefer it if the page got "squished" when the keyboard shows up, instead of getting pushed upwards, but I'm not sure how to display the keyboard on the frame level, instead of the entire MainPage, default level.
What would be the best way to solve this situation?
Cheers!
As you know, if we set the Page.BottomAppBar in the root of the Page, there is no issue with Touch keyboard. It seems it is the best way to add the Page.BottomAppBar.
If you want to add the Page.BottomAppBar in the other page in the Frame, you should be able to customize your UI. The UWP provides similar behavior on the appearance of the touch keyboard by handling the Showing and Hiding events exposed by the InputPane object.
We can use the InputPaneVisibilityEventArgs.OccludedRect to get the region of the application's window that the input pane is covering.
For example:
public PostView()
{
this.InitializeComponent();
InputPane.GetForCurrentView().Showing += PostView_Showing;
InputPane.GetForCurrentView().Hiding += PostView_Hiding;
}
private void PostView_Hiding(InputPane sender, InputPaneVisibilityEventArgs args)
{
MyTextBox.Margin = new Thickness(0, args.OccludedRect.Height, 0, 0);
}
private void PostView_Showing(InputPane sender, InputPaneVisibilityEventArgs args)
{
MyTextBox.Margin = new Thickness(0, 0, 0, args.OccludedRect.Height);
}

Trying to implement color picker in uwp

I'm trying to implement color picker in uwp using below link
[1]: http://www.c-sharpcorner.com/article/coding4fun-colorpicker-control-in-uwp-with-xaml-and-c-sharp/
but while following process and implementing colorchange event it is giving error "unable to add event handler".Any idea would be appreciated
XAML
xmlns:my="using:Coding4Fun.Toolkit.Controls"
<my:ColorPicker x:Name="W_Paints"
Margin="216,203,-6,0" Height="40"
Width="40" VerticalAlignment="Top"
HorizontalAlignment="Left"/>
I tried to create a color picker with Coding4Fun package by following the above link and the color picker is successfully created with no error on my side.
I used version 2.1.8, and also test version 2.1.7 which also worked. My uwp app target version is build 14393, but I also test with target version 10240. So if you created a uwp app with "Coding4Fun Toolkit - Controls" 2.1.7 or 2.1.8 should be able work well. Here is the demo completing code.
XAML Code
<Page
x:Class="Coding4fun.MainPage"
...
xmlns:my="using:Coding4Fun.Toolkit.Controls" >
<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<TextBlock x:Name="tblTitle" HorizontalAlignment="Left" Margin="419,42,0,0" TextWrapping="Wrap" Text="Code4Fun ColorPicker control Demo" VerticalAlignment="Top" Height="37" Width="427" FontSize="24" FontWeight="Bold" />
<Button x:Name="btnCPopen" Content="Open Color Picker" HorizontalAlignment="Left" Margin="110,113,0,0" VerticalAlignment="Top" RenderTransformOrigin="-5.01,1.529" ToolTipService.ToolTip="Open color Picker for changing Background" Click="btnCPopen_Click" />
<Border x:Name="BorCP" BorderBrush="Black" BorderThickness="1" HorizontalAlignment="Left" Height="378" Margin="838,113,0,0" VerticalAlignment="Top" Width="354" />
<my:ColorPicker x:Name="CPtest" HorizontalAlignment="Left" Height="358" Margin="284,113,0,0" VerticalAlignment="Top" Width="374" ColorChanged="CPtest_ColorChanged" Visibility="Collapsed" />
</Grid>
Code behind
private void btnCPopen_Click(object sender, RoutedEventArgs e)
{
CPtest.Visibility = Visibility;
}
private void CPtest_ColorChanged(object sender, Windows.UI.Color color)
{
BorCP.Background = new SolidColorBrush(color);
}
I also upload the demo here you can download for testing and compare what's wrong with your project.

How to show ProgressRing in UWP app with Hub control

I have a UWP app that needs to get SQL data from a webservice hosted on a .Net server in the cloud as well as some extra data from a web API and I want to show an indeterminate Progress Ring control while it's loading.
I have the control bound to a boolean in my MainViewModel that I set to true at the start of the whole update process (done via an awaited async method which works perfectly) and then to false when all data is downloaded but the ring just never becomes visible. I can see PropertyChanged is getting raised but it makes no difference - the progress ring just never displays.
Here's the thing though - the progress ring IS working, but because I can't get it to display in front of my Hub control it just appears not to be working. I know this because if I move the Hub down 100 pixels and set the vertical alignment of the progress ring to Top I can then see the ring and it behaves exactly as expected. But as I obviously don't want to waste 100 pixels I need to get it to display at the front of all content as you'd expect any progress control to do.
I have also tried putting the ring in the grid of the data template's grid for the middle hub section (there are 3 side by side at 640px each) and in the DataTmeplate itself (the second one in Page.Resources below) but it still won't display it so I am tearing my hair out.
I know this has got to be the simplest XAML issue but I've tried everything I can think of and searched the web so I'm hoping someone else can help me get the progess ring to display in front of the Hub?
Here's a cut down version of my XAML page - I can post the lot but it's a big page.
<Page
x:Class="TVTracker.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:TVTracker"
xmlns:vm="using:TVTracker.ViewModel"
xmlns:model="using:TVTracker.Model"
xmlns:hlp="using:TVTracker.Common"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
RequestedTheme="Light">
<Page.DataContext>
<vm:MainViewModel/>
</Page.DataContext>
<Page.Resources>
<!-- styles and other resources here -->
<!-- gets displayed in first of 3 hub sections 640 wide -->
<DataTemplate x:Key="ShowListTemplate" x:DataType="model:TVShow">
<Grid Width="640" Height="Auto" Margin="5" HorizontalAlignment="Stretch" RightTapped="ShowsList_RightTapped">
<!-- ...etc etc... -->
<\DataTemplate>
<!-- gets displayed in second of 3 hub sections 640 wide -->
<DataTemplate x:Key="DetailsTemplate" x:DataType="model:TVShow">
<Grid Width="640" Margin="0,20,0,0" Height="Auto" VerticalAlignment="Top" HorizontalAlignment="Stretch">
<!-- ...etc etc... -->
</Grid>
</DataTemplate>
<!-- gets displayed in second of 3 hub sections 640 wide -->
<DataTemplate x:Key="EpisodeListTemplate" x:DataType="model:Episode">
<Grid Width="640" Margin="0,20,0,0" Height="Auto" VerticalAlignment="Top" HorizontalAlignment="Stretch">
<!-- ...etc etc... -->
</Grid>
</DataTemplate>
</Page.Resources>
<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<ProgressRing Name="pgbLoadingShow" IsActive="{Binding LoadingShowData}" Width="100" Height="100" VerticalAlignment="top" Foreground="{StaticResource Medium}"/>
<Hub SectionHeaderClick="Hub_SectionHeaderClick" Margin="0,0,0,0" HorizontalContentAlignment="Stretch" Background="{StaticResource Dark}">
<Hub.Header>
<TextBlock Text="ShowTracker" FontSize="14" Foreground="{StaticResource Bright}"/>
</Hub.Header>
<HubSection Name="hsShows" MinWidth="640" Padding="20" VerticalAlignment="Top" Background="{StaticResource Dark}" >
<!-- ...etc etc.. -->
</HubSection>
<!-- two other hubsections here -->
</Hub>
</Grid>
</Page>
Have you tried putting the ProgressRing after the Hub in your XAML?
<Hub/>
<ProgressRing/>
Generally it will be displayed in the order which you put them in, so the ProgressRing element will be behind the Hub with your code.

XAML button click or tap event not raised in usercontrol

I have a XAML user control with a collection of buttons.
My XAML is as follows:
<UserControl
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"
mc:Ignorable="d"
d:DesignHeight="300" Width="85"
>
<Grid Background="#7F010305" HorizontalAlignment="Left">
<Grid.RowDefinitions>
<RowDefinition Height="*" />
<RowDefinition Height="*" />
<RowDefinition Height="*" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Button x:Name="Zoom" Grid.Row="0" Grid.Column="0" Width="40" Height="40" Margin="15,0,15,15" Click="OnClicked" Tapped="OnClicked" />
<Button x:Name="Pan" Grid.Row="1" Grid.Column="0" Width="40" Height="40" Margin="15,0,15,15" Click="OnClicked" Tapped="OnClicked" />
<Button x:Name="Contrast" Grid.Row="2" Grid.Column="0" Width="40" Height="40" Margin="15,0,15,15" Click="OnClicked" Tapped="OnClicked"/>
<Button x:Name="Brightness" Grid.Row="3" Grid.Column="0" Width="40" Height="40" Margin="15,0,15,15" Click="OnClicked" Tapped="OnClicked"/>
</Grid>
Somehow the click or the tap event is not getting raised. I tried various options but the Click or Tapped event is not getting fired.
Any hints?
From looking at your code I notice that you have both the Click and Tapped event handlers are pointing to the same method ("OnClicked"). These events, however, have different signatures for delegates. The Click event expects a method with signature (http://msdn.microsoft.com/en-us/library/windows/apps/windows.ui.xaml.controls.primitives.buttonbase.click.aspx):
void ClickDelegate(object sender, RoutedEventArgs e)
while the Tapped event expects a method with signature (http://msdn.microsoft.com/en-us/library/windows/apps/windows.ui.xaml.input.tappedeventhandler.aspx):
void TappedDelegate(object sender, TappedRoutedEventArgs e)
So the signatures of the two methods aren't equivalent and it seems unlikely that you would be able to use the same method for both events since they require different delegate signatures (The code that runs behind the scenes to merge the logic in your xaml to your code behind should be looking for a method void OnClick(object, RoutedEventArgs) for your Click handler and a method void OnClick(object, TappedRoutedEventArgs) for your Tapped handler). Also if the runtime doesn't find a matching handler method (at least for wirnt in 8.1) I have found through testing that the event handler hook up will silently fail rather than throwing an exception (I am pretty sure that for WPF this causes an error, which makes it slightly confusing).
Long story short without being able to see your code behind my best guess is that OnClick doesn't have a signature that matches the delegate types of either the Clicked or Tapped event. Beyond that I am also wondering why you hooked into both Tapped and Clicked. Tapped is the generalized event that basically does the same thing as Clicked and then some (see Are Click, Tapped, and PointerPressed synonymous in WinRT-XAML?). I can't say for sure whether or not hooking into both of them may cause some weird issues (such as both the Clicked and Tapped being called for a single press) but it seems like you would probably just want to be subscribing to the Tapped event.
EDIT:
Just to add another point. Sometimes I have had it happen that even if you do everything right (where right here equals you have painstakingly double checked everything and it is all correct as far as you can tell) the event handler still doesn't work. Honestly I have only ever seen this happening when there are much more intricate combinations of components than what you have (such as those involving pretty much every custom type of thing you can imagine... custom panels, datatemplateselectors, itemtemplateselectors, etc) and am not sure if I am just constantly overlooking something from time to time or if there are legitimate bugs in the Microsoft code.
Anyway, the workaround is always to avoid hooking it up the event handler in the 'normal' way (like what you are doing here). To do this give the button a name and add the handler in the code behind (either by directly using the name if the button isn't in a template or by using GetTemplateChild from OnApplyTemplate to grab it if it is in a template). Then you can just do something like this for a button named 'foo':
foo.Tapped += (sender, args) => { /*do something here */ };

Windows Store App: Forwarding Mouse Events

I have a full-screen Bing map control. Over the top, I want to overlay various other controls.
<Grid>
<maps:Map x:Name="Map" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" />
<Grid Style="{StaticResource LayoutRootStyle}" Background="Transparent"
x:Name="InnerGrid">
<Grid.RowDefinitions>
<RowDefinition Height="132" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="700" />
<ColumnDefinition Width="350" />
</Grid.ColumnDefinitions>
... Content ...
The trouble is that the InnerGrid consumes the mouse events which I need the map control to receive instead. Setting the background to transparent has done nothing useful.
So, I found the RoutedEvents stuff:
internal sealed partial class PageCodeBehind : Page
{
public PageCodeBehind()
{
InitializeComponent();
InnerGrid.AddHandler(PointerPressedEvent, new PointerEventHandler(OnPointerPressedEvent), true);
InnerGrid.AddHandler(PointerMovedEvent, new PointerEventHandler(OnPointerMovedEvent), true);
}
private void OnPointerPressedEvent(object sender, PointerRoutedEventArgs pointerRoutedEventArgs)
{
// I can hit a breakpoint here...
var peer = FrameworkElementAutomationPeer.FromElement(GigMap) as MapAutomationPeer;
peer.RaiseAutomationEvent(...);
So - I can capture the event, but I have no idea how to trigger the event on the Map control. Having looked at the automation peer stuff - it seems like they are concerned with higher-level concepts than mouse-down, such as open tool-tip etc.
Any idea how I forward all events from my InnerGrid control to the Map control?
Many thanks for any help,
Jon
Ok - I found a work-around. Setting Background="{x:Null}" on the InnerGrid makes it forward events. Beautifully undocumented as always on MSDN :-)
I'd still like to know any other methods available though if anyone knows more information.
Many thanks,
Jon