What's wrong with Windows Phone 8.1 Pivot? (WinRT - not Silverlight) - windows-phone-8

So I've decided to migrate from Windows Phone 8.0 to Windows Phone 8.1 API - not the silverlight one.
The reason was that I wanted to use Win2D drawing library which is not supported for Silverlight 8.1 or WP 8.0
The weird things are happening.
Simple Pivot view is incredibly laggy and also it is not displaying views properly.
I am using latest Visual Studio 2015. On the video I linked you can see the result of following Page XAML code (just for testing):
<Page
x:Class="Apptest2.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:Apptest2"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<StackPanel Grid.Column="0">
<Button Content="Go"
/>
</StackPanel>
<Pivot Grid.Row="1"
x:Name="PivotView"
Margin="10,0,10,15"
CacheMode="BitmapCache"
VerticalContentAlignment="Stretch">
<PivotItem Header="item1">
<Grid Background="BlueViolet" />
</PivotItem>
<PivotItem Header="item2">
<Grid Background="BlueViolet" />
</PivotItem>
<PivotItem Header="item3">
<Grid Background="BlueViolet" />
</PivotItem>
<PivotItem Header="item4">
<Grid Background="BlueViolet" />
</PivotItem>
<PivotItem Header="item5">
<Grid Background="BlueViolet" />
</PivotItem>
<PivotItem Header="item6">
<Grid Background="BlueViolet" />
</PivotItem>
</Pivot>
</Grid>
</Page>
Is anyone able to tell what is going on here? Should I use some pivot analogs from 3rd parties or maybe just forget about using it in new os?
Pulling my hair out.
Any solution would be hugely appreciated!
Link to video

The problem is you are using CacheMode="BitmapCache" on your Pivot. Remove this line and the performance should be good after.
First of all the caching is applied to the element and all of it’s child elements and BitmapCaching should be used in scenarios where you are blending, transforming (translating, stretching, rotating). If you need BitmapCaching then try not to use it on root controls, use it on the children that really need BitmapCaching.
Misuse of the CacheMode feature can hurt performance, so you need to really think through what you are doing. If your visual tree is interleaving cached and un-cached elements, you are effectively causing multiple rendering surfaces to get created behind the scenes. The un-cached surfaces are rendered in software and the cached surfaces are rendered in hardware. Your performance will be best if you can minimize the total number of rendering surfaces and get the hardware to do work where it can.
Reference from another StackOverflow answer. I hope it helps.

Related

WP8 webview missing reference

Im trying to add webview inside xaml. It gives this error. I ve searched but couldnt find the answer. Is it possible to add webview inside WP8 page.
<Grid x:Name="todaysGrid" >
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<WebView x:Name="webView1" Grid.Row="0" Height="800"/>
</Grid>
Error 1 The type or namespace name 'WebView' could not be found (are you missing a using directive or an assembly reference?)
Thanks.
The control is called WebBrowser.

Crop image in windows phone 8

I try to crop image in windows phone 8 App.
I use following namespace
xmlns:y="clr-namespace:System.Windows.Media.Imaging;assembly=Microsoft.Phone"
And write content panel like this.
<!--ContentPanel - place additional content here-->
<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
<Image HorizontalAlignment="Left" Height="200" Margin="97,153,0,0" VerticalAlignment="Top" Width="200">
<Image.Source>
<y:CroppedBitmap
SourceRect="30 0 75 50">
<y:CroppedBitmap.Source>
<BitmapImage UriSource="/Assets/image.jpg"/>
</y:CroppedBitmap.Source>
</y:CroppedBitmap>
</Image.Source>
</Image>
</Grid>
Error is occurred.
error : The tag 'CroppedBitmap' does not exist in XML namespace 'clr-namespace:System.Windows.Media.Imaging;assembly=Microsoft.Phone'.
If anyone can solve this or do this using another way. please help me.
Use WriteableBitmapExtension library instead which has inbuilt crop functionality.
http://writeablebitmapex.codeplex.com/

How to convert HTML codes to XAML in Windows Phone

I am creating Windows Phone Application, I am getting HTML codes from web service response,
like
" ,<br>"
how do I convert them in xaml?
is there any static method available?
because I have tried HttpUtility mehtod but not getting the converted result
There is no built-in functionality to do this. You'll need to manually map the content to a <RichTextBox /> and insert the necessary <Paragraph /> and <Run /> elements as necessary.
Maybe you could use this HTML to XAML FlowDocument converter: http://blogs.msdn.com/b/wpfsdk/archive/2006/05/25/606317.aspx
Then you could use a custom control, here's an example:
<ControlTemplate TargetType="{x:Type local:ReplyBoxControl}">
<Border BorderBrush="Black" BorderThickness="1" Background="#F0E0D6" MaxHeight="320" Width="300">
<FlowDocumentScrollViewer VerticalScrollBarVisibility="Auto" MaxHeight="320" Height="Auto"
Document="{TemplateBinding TestText2, Converter={StaticResource HtmlToFlowDocumentConverter}}" />
</Border>
</ControlTemplate>

Can SwapChainBackgroundPanel be added as a sub control?

I created a sample app with mono wizard "MonoGame Windows Store(XAML) Project".
it created page GamePage.xaml
<SwapChainBackgroundPanel
x:Class="Mono.GamePage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:Mono"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="200"/>
</Grid.ColumnDefinitions>
<StackPanel Grid.Column="1" Background="LightGray">
<Button Content="Stop" x:Name="btnStartStop" Click="btnStartStop_Click"/>
</StackPanel>
</Grid>
</SwapChainBackgroundPanel>
However, I want to add this SwapChainBackgroundPanel into another xaml page (example BlankPage.xaml).
But, when I run the app. it report an exception
WinRT information: Cannot add instance of type 'GamePage' to a collection of type 'Windows.UI.Xaml.Controls.UIElementCollection'.
So, Can anyone tell me what's wrong with this? and How can I do this? I want to add SwapChainBackgroundPanel as a sub control of other page.
Can SwapChainPanel be added as a sub-control (your question) == yes.
Can sub-controls be added to a SwapChainPanel? (your code) == no.

In WinRT XAML App ListView.CanDragItems enables drag only in one direction when using touch

See the following very basic XAML. I run it in simulator in touch mode. I can drag the item right or left, but cannot down. It does work great when using mouse mode. After some googling I saw this thread (http://social.msdn.microsoft.com/Forums/en-US/winappswithcsharp/thread/8bb5e423-4517-448b-89ce-179a978e9e2d/), but it did not help me out.
<Page
x:Class="App3.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:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d">
<Grid Background="{StaticResource ApplicationPageBackgroundThemeBrush}">
<Grid.RowDefinitions>
<RowDefinition/>
<RowDefinition/>
</Grid.RowDefinitions>
<ListView Background="AliceBlue"
AllowDrop="True" CanDragItems="True" SelectionMode="None" CanReorderItems="False"
IsItemClickEnabled="False" IsSwipeEnabled="True"
ScrollViewer.HorizontalScrollBarVisibility="Disabled"
ScrollViewer.VerticalScrollBarVisibility="Disabled"
Margin="10">
<ListView.ItemsPanel>
<ItemsPanelTemplate>
<VirtualizingStackPanel Orientation="Horizontal" />
</ItemsPanelTemplate>
</ListView.ItemsPanel>
<ListView.ItemTemplate>
<DataTemplate>
<Border Background="Blue" Width="100" Height="100"/>
</DataTemplate>
</ListView.ItemTemplate>
<x:String>s1</x:String>
<x:String>s2</x:String>
<x:String>s3</x:String>
</ListView>
</Grid>
</Page>
This is something so basic and it is strange that it does not work for me.
Does somebody know any solution or workaround?
Thanks
Meir
I might be wrong but AFAIK using touch you can only tear off items perpendicular to the scrolling direction. The same has been mentioned in the forum post you're linking to. If you set IsSwipeEnable=False you disable this behavior as well.
If you want your ListView to scroll horizontally instead, since you've already changed the orientation of ItemsPanelTemplate, you need to add the following to your ListView:
ScrollViewer.HorizontalScrollMode="Enabled"
ScrollViewer.VerticalScrollMode="Disabled"
Now tear off will work vertically instead of horizontally which should be more intuitive given your current layout.