Enlarging Control - c#

Hi I am currently building a flash card productivity app which has has a user control that i have made. On making the control i realized that it was too small for to be displayed well or rendered well on my phones display. So i then began to enlarge the user control by increasing the width and height of the control and also increasing the size of the text of all the controls contained in the user control .Only when i one try to run the control i get given this exception :
An exception of type 'Windows.UI.Xaml.Markup.XamlParseException' occurred in SuperCards.exe but was not handled in user code
WinRT information: Failed to create a '%1' from the text '%0'. [Line: 12 Position: 48]
Additional information: The text associated with this error code could not be found.
Here is the xaml code for the user control :
<UserControl
x:Class="SuperCards.CardPackItemListView"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:SuperCards"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
d:DesignHeight="125"
d:DesignWidth="400" >
<Border CornerRadius="2" BorderThickness="1" BorderBrush="White">
<Grid Background="White" Height="Auto" Width=" Auto">
<TextBlock x:Name="cardPackItemNameDisplay" HorizontalAlignment="Left" VerticalAlignment="Top" Width="Auto" Height="Auto" Text="(Sample) Periodic Table" Foreground="Gray" Margin="9,9,0,0" FontSize="30" />
<Grid HorizontalAlignment="Stretch" VerticalAlignment="Bottom" Margin="9,30,9,9" Width="Auto" Height="9" Background="gray" >
<Rectangle HorizontalAlignment="Left" VerticalAlignment="Stretch" Fill="Red" Width="46"/>
</Grid>
<TextBlock HorizontalAlignment="Right" VerticalAlignment="Top" Text="36" Foreground="Gray" Margin="0,9,9,0" FontSize="30"/>
</Grid>
</Border>
and here visual studios notified that the exception was not handled at the initializing component inside the constructor of the user control.


The following attribute on line 12 corresponds with the line in the error message; remove the leading space within the quotes:
Width=" Auto"
This may also cause problems if color names in WinRT are case sensitive; best to capitalize the G in Gray just in case:
Background="gray"

Related

Changing size of User Control

I'm having a problem with determining which element is responsible for a size misalignment. Here is a picture to illustrate it: click here to see it
The light grey area is the element size which I am trying to change, but cannot. The overall area is a User Control, the area inside the Tab is a WPF (as an element Host). I've tried changing both, but with no effect on the grey area (the other tabs are also affected by this). Here is the code for the hosted element (WPF):
<UserControl x:Class="SlideAnalyzer.DisplayAnalysis"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:local="clr-namespace:SlideAnalyzer"
mc:Ignorable="d"
d:DesignHeight="150.8" d:DesignWidth="201.2">
<Grid Name="displayGrid" Height="64" VerticalAlignment="Bottom" HorizontalAlignment="Center" Width="160" Margin="10,0,31.6,9.4" RenderTransformOrigin="0.496,0.94">
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<Expander x:Name="expander" Grid.Row="0" Header="Titel zu lang" HorizontalAlignment="Left" VerticalAlignment="Top" Width="180" Background="Red" Margin="-10,-56,0,0">
<Grid Background="AliceBlue">
<TextBlock TextWrapping="Wrap"
Margin="5"><Run Text="This is some text content."/></TextBlock>
</Grid>
</Expander>
</Grid>
The host itself is a normal User Control. I cannot seem to get the right size of the hosted element so that the preview really reflects reality (because when I run the Add-In, the size of the WPF differs)
I tried changing the Properties of the UserControl and I found that AutoSize has a big impact when True (by default False)
Thanks!

Can't get any Transitions to work with Popup in UWP

I trying to change the appearance of a Popup in a UWP App but I'm having trouble using any Transitions. Basically, the XAML parser throws an exception whatever Transition I use.
Please can someone help tell me what I'm doing wrong?
Here is some example XAML that blows up:
<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<Popup x:Name="popup" IsOpen="True">
<Popup.Transitions>
<PopupThemeTransition FromHorizontalOffset="100"/>
</Popup.Transitions>
<Border Background="Red" Width="100" Height="100"/>
</Popup>
</Grid>

The type of UIElement.Transitions property value should be TransitionCollection. We cannot directly give a PopupThemeTransition to Popup.Transitions. You code snippet is lacking of the TransitionCollection element. Right using as follows:
<Popup x:Name="StandardPopup" >
<Popup.Transitions>
<TransitionCollection>
<PopupThemeTransition FromHorizontalOffset="100"/>
</TransitionCollection>
</Popup.Transitions>
<Border Background="Red" Width="100" Height="100"/>
</Popup>

Get Fill Color of Rectangle in Coded UI for Windows Phone

I'm writing some Coded UI tests for a simple application and cannot seem to get the code to find Rectangle objects. In the specific case I have the color of the rectangle presents whether two strings match or not based on the fill color.
When trying to find the rectangle using the Coded UI Test Builder the parent object is being found instead of the rectangle. I am also seeing that the code returns that it is unable to find the rectangle when I have it search manually.
Below is the XAML for the page I am trying to test against:
<Page
x:Class="TestApp.ButtonTester"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:TestApp"
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 x:Name="LayoutRoot">
<Grid.ChildrenTransitions>
<TransitionCollection>
<EntranceThemeTransition/>
</TransitionCollection>
</Grid.ChildrenTransitions>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<!-- Title Panel -->
<StackPanel Grid.Row="0" Margin="19,0,0,0">
<TextBlock Text="{StaticResource AppName}" Style="{ThemeResource TitleTextBlockStyle}" Margin="0,12,0,0"/>
<TextBlock Name="pageTitle" Text="Button Tester" Margin="0,-6.5,0,26.5" Style="{ThemeResource HeaderTextBlockStyle}" CharacterSpacing="{ThemeResource PivotHeaderItemCharacterSpacing}"/>
</StackPanel>
<!--TODO: Content should be placed within the following grid-->
<Grid Grid.Row="1" x:Name="ContentRoot" Margin="19,9.5,19,0">
<StackPanel Name="buttonValidator">
<TextBlock Name="verifyText" Text="Hi" HorizontalAlignment="Center" Style="{StaticResource LargeText}"/>
<Button Name="changeText" Content="Change Text" HorizontalAlignment="Center" Click="changeText_Click"/>
<TextBox Name="guessText" Text="Enter Text From Above" TextAlignment="Center" GotFocus="guessText_GotFocus" KeyDown="guessText_KeyDown"/>
<Button Name="verifyMatch" Content="Verify" HorizontalAlignment="Center" Click="verifyMatch_Click"/>
<Rectangle Name="matchAlert" Height="50" Width="50" Fill="Black" HorizontalAlignment="Center"/>
</StackPanel>
</Grid>
</Grid>
And here is the test code I currently have:
[TestMethod]
public void TestVerifyIncorrect()
{
UITestControl verifyMatch = new UITestControl(myApp);
verifyMatch.TechnologyName = "UIA";
verifyMatch.SearchProperties.Add("ControlType", "Button");
verifyMatch.SearchProperties.Add("AutomationId", "verifyMatch");
Gesture.Tap(verifyMatch);
UITestControl matchAlert = new UITestControl(myApp);
matchAlert.TechnologyName = "UIA";
matchAlert.SearchProperties.Add("ControlType", "Rectangle");
matchAlert.SearchProperties.Add("AutomationId", "matchAlert");
var fillColor = matchAlert.GetProperty("Fill");
}
I am also seeing the Test Builder unable to detect a rectangle even when it is being used as a control.
I also looked into the Rectangle class vs the Button class and it appears the first common link in their inheritance chains is with Windows.UI.Xaml.FrameworkElement. I'm unaware of what type of ojects the Coded UI is able to detect to know if that may be the cause of the issue.

Accessing the BorderBackground of a user control in WinRT application

I have a project consisting of two pages. One page is having th XAML of a User control developed by me.
The another page has the logic of cropping the image that is present in the image box on that page. I want to use my control on that page and assign the border background of the user control to the image cropped .
The following code is of my UserControl XAML ! The cs file for this page has no code implementation
<UserControl
x:Class="controlMagnifier.MagnifierUsercontrol"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:controlMagnifier"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
d:DesignHeight="300"
d:DesignWidth="400">
<Canvas x:Name="controlCanvas" x:FieldModifier="public" Margin="112,0,108,0">
<Canvas.RenderTransform>
<RotateTransform>
</RotateTransform>
</Canvas.RenderTransform>
<Grid Height="250" Width="176" Canvas.Left="41" Canvas.Top="40" Margin="-40,0,0,0">
<Border x:FieldModifier="public" x:Name="imgBorder" Width="150" CornerRadius="50,50,50,50" Margin="13,25,13,97">
<Border.Background>
<ImageBrush x:Name="image1" ImageSource="/Assets/images.jpg" />
</Border.Background>
</Border>
<TextBlock x:Name="txtreading" Height="30" Width="80" Margin="0,-145,0,0" FontWeight="Bold" Foreground="Red" FontSize="20" Text="ABC" TextAlignment="Center" />
<!--<Image Height="120" Width="150" Margin="0,-50,0,0" Source="Assets/SmallLogo.scale-100.png" ></Image>-->
<Path x:Name="MagnifyTip" Data="M25.533,0C15.457,0,7.262,8.199,7.262,18.271c0,9.461,13.676,19.698,17.63,32.338 c0.085,0.273,0.34,0.459,0.626,0.457c0.287-0.004,0.538-0.192,0.619-0.467c3.836-12.951,17.666-22.856,17.667-32.33 C43.803,8.199,35.607,0,25.533,0z M25.533,32.131c-7.9,0-14.328-6.429-14.328-14.328c0-7.9,6.428-14.328,14.328-14.328 c7.898,0,14.327,6.428,14.327,14.328C39.86,25.702,33.431,32.131,25.533,32.131z" Fill="#FFF4F4F5" Stretch="Fill" Stroke="Black" UseLayoutRounding="False" Height="227" Width="171" />
</Grid>
</Canvas>
</UserControl>
In the user control XAML , we can see that I have set the
to a static image. I want to access this user control to another page and want to assign the element to the cropped image output on the other page. The other page MainPage.Xaml has the code for image cropping.
Any help would be appreciated

Dynamically changing coloration of TextBlock

I have Windows 8 application and trying to create landing view for it. It's still needs to spupport Windows 8, so Hub control is unavailable. But it looks similar. First section will contain darker picture and second one will contain GridView like elements on almost white background. And during scrolling application title should stay in place.
But as a result I have a problem with title TextBlock. While it's placed over an image it should be white, but after scrolling further it should invert color of the text part over white background.
Here is a sample markup:
<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<ScrollViewer ZoomMode="Disabled" VerticalScrollMode="Disabled"
VerticalScrollBarVisibility="Disabled" HorizontalScrollBarVisibility="Auto">
<StackPanel Orientation="Horizontal">
<Rectangle Width="500" Fill="Purple"/>
<Rectangle Width="5000" Height="500" VerticalAlignment="Center" Fill="LightCyan"/>
</StackPanel>
</ScrollViewer>
<TextBlock Text="Application Name" Foreground="White"
FontSize="32" FontFamily="Segoe UI"
FontWeight="Bold" Margin="48 24 0 0"
HorizontalAlignment="Left" VerticalAlignment="Top"/>
</Grid>
Maybe someone has ideas on how it should be implemented?

Categories

Resources