Dear JS-Support,
Please, find bellow the cripped sample code -and see the attached complete solution as a zip file:
Solution/Project name: CSHTML5_v10_PopUpPositionBUG
XAML:<Page
x:Class="CSHTML5_v10_PopUpPositionBUG.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:CSHTML5_v10_PopUpPositionBUG"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d">
<StackPanel x:Name="firstContainerAfterPage">
<Button x:Name="toggleButtonShowHidePopup" Content="Show / Hide Popup" Click="toggleButtonShowHidePopup_Click"/>
<TabControl Margin="0,30,0,0">
<TabItem Header="TabItem 1 -small content in summa Height">
<StackPanel>
<Button Content="sample button on Tab 1"/>
<Button Content="sample button on Tab 1"/>
<Button Content="sample button on Tab 1"/>
</StackPanel>
</TabItem>
<TabItem Header="TabItem 2 -LOT of content in summa Heigh">
<StackPanel>
<Button Content="sample button on Tab 2"/>
<Button Content="sample button on Tab 2"/>
<Button Content="sample button on Tab 2"/>
<Button Content="sample button on Tab 2"/>
<Button Content="sample button on Tab 2"/>
<Button Content="sample button on Tab 2"/>
<Button Content="sample button on Tab 2"/>
<Button Content="sample button on Tab 2"/>
<Button Content="sample button on Tab 2"/>
<Button Content="sample button on Tab 2"/>
<Button Content="sample button on Tab 2"/>
</StackPanel>
</TabItem>
</TabControl>
<Popup x:Name="popup" Height="150" Opacity="0.9" HorizontalOffset="50" VerticalOffset="20">
<StackPanel>
<Thumb x:Name="thumb" DragDelta="thumb_DragDelta">
<Thumb.Template>
<ControlTemplate>
<Border Margin="3,3,3,0" Padding="10" Background="Yellow" CornerRadius="5,5,0,0" Opacity="0.9">
<StackPanel Orientation="Horizontal" HorizontalAlignment="Stretch">
<Button Content="Some Content - UP UP You shoud move popup by Draging Upper Yellow Part UP UP" Margin="10" Padding="10"/>
</StackPanel>
</Border>
</ControlTemplate>
</Thumb.Template>
</Thumb>
</StackPanel>
</Popup>
</StackPanel>
</Page>
C# code behind:using System;
using System.Collections.Generic;
using System.IO;
using System.Linq;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;
namespace CSHTML5_v10_PopUpPositionBUG
{
public partial class MainPage : Page
{
public MainPage()
{
this.InitializeComponent();
}
bool IsChecked = false;
private void toggleButtonShowHidePopup_Click(object sender, RoutedEventArgs e)
{
IsChecked = !IsChecked;
popup.IsOpen = IsChecked;
}
private void thumb_DragDelta(object sender, Windows.UI.Xaml.Controls.Primitives.DragDeltaEventArgs e)
{
popup.HorizontalOffset += e.HorizontalChange;
popup.VerticalOffset += e.VerticalChange;
}
}
}
Recommended way to reproduce the behaviour of bug:
1., first: do not touch any TabItem ! Play only with "Show / Hide Popup" button -remember the position of it,
2., secondly: click to ""TabItem 1 -small content in summa Height"" tabitem: Play with "Show / Hide Popup" button -see the position of it:
if the popup comes visible again it position has changed comparing point 1. (the bug popped up)
3., thirdly: click to "TabItem 2 -LOT of content in summa Heigh": tabitem: Play with "Show / Hide Popup" button -see the position of it:
if the popup comes visible again it position has changed a lot comparing point 1 and 2. (the bug popped up)
4., at last: you can Drag & Drop the popup by dragging yellow thumb of to see the bug again.
Important: the bug comes when the popup.IsOpen comes true (I mean if it is visible it will not JUMP to the incorect position).
Important 2: same behaviour in Simulator and in real Browser
Please, inform about the progress.
+1: sorry for a small bad news at the end: we have found another bug during this investigation: -if you put a Button as a FIRST element of CANVAS => Click event
never hitted !
To reproduce this issue, try to change : <StackPanel x:Name="firstContainerAfterPage"> to <Canvas x:Name="firstContainerAfterPage">
Thanks in advance,
Have a nice day!
Péter