I have a user control that I am working on, and it works fine, but when it is a grid where the width is set, I get errors such as:
Finishing redefining the layout of the Microsoft.Windows.Design.Platform.SilverlightViewProducer + SilverlightContentHost element should not return PositiveInfinity as the desired size, even if Infinity is passed as the available size.
These errors occur only in my application, not in my test harness, but I can not publish it here, but there may be something here that I am missing, may be able to compensate for the problem, but if someone can help, it was would be great
Here is the class code:
public class UXImage : Control
{
#region Private Constants
private const string RightImageControl = "RightImage";
private const string MiddleImageControl = "MiddleImage";
private const string LeftImageControl = "LeftImage";
#endregion
#region Private Members
private int sourceHeight;
private int sourceWidth;
private int middleWidth = 1;
WriteableBitmap crop;
TransformGroup transform = new TransformGroup();
TranslateTransform position = new TranslateTransform();
ScaleTransform scale = new ScaleTransform();
private Image image = new Image();
private Image rightImageControl;
private Image middleImageControl;
private Image leftImageControl;
#endregion
#region Dependency Properties
public static readonly DependencyProperty SourceProperty =
DependencyProperty.Register("Source", typeof(BitmapSource),
typeof(UXImage), null);
public static readonly DependencyProperty RightCapWidthProperty =
DependencyProperty.Register("RightCapWidth", typeof(int),
typeof(UXImage), null);
#endregion
#region Public Properties
public BitmapSource Source
{
get { return (BitmapSource)GetValue(SourceProperty); }
set
{
SetValue(SourceProperty, value);
}
}
public int RightCapWidth
{
get { return (int)GetValue(RightCapWidthProperty); }
set
{
SetValue(RightCapWidthProperty, value);
}
}
#endregion
#region Public Methods
public override void OnApplyTemplate()
{
base.OnApplyTemplate();
sourceHeight = Source.PixelHeight;
sourceWidth = Source.PixelWidth;
image.Source = Source;
rightImageControl = (Image)GetTemplateChild(RightImageControl);
crop = new WriteableBitmap(RightCapWidth, sourceHeight);
position.X = -sourceWidth + RightCapWidth;
crop.Render(image, position);
crop.Invalidate();
rightImageControl.Source = crop;
rightImageControl.Width = RightCapWidth;
middleImageControl = (Image)GetTemplateChild(MiddleImageControl);
crop = new WriteableBitmap(middleWidth, sourceHeight);
position.X = -sourceWidth + RightCapWidth + middleWidth;
crop.Render(image, position);
crop.Invalidate();
middleImageControl.Source = crop;
middleImageControl.Height = sourceHeight;
leftImageControl = (Image)GetTemplateChild(LeftImageControl);
crop = new WriteableBitmap(sourceWidth - RightCapWidth - middleWidth, sourceHeight);
position.X = 0;
crop.Render(image, position);
crop.Invalidate();
leftImageControl.Source = crop;
leftImageControl.Height = sourceHeight;
this.Height = sourceHeight;
this.Width = sourceWidth;
}
public UXImage()
{
DefaultStyleKey = typeof(UXImage);
}
#endregion
}
Generic.xaml
<ResourceDictionary
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:vsm="clr-namespace:System.Windows;assembly=System.Windows"
xmlns:local="clr-namespace:UXLibrary">
<Style TargetType="local:UXImage">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="local:UXImage">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="Auto"/>
</Grid.ColumnDefinitions>
<Image x:Name="LeftImage" Stretch="Uniform" Source="{TemplateBinding Source}" Grid.Column="0"/>
<Image x:Name="MiddleImage" Stretch="Fill" Grid.Column="1"/>
<Image x:Name="RightImage" Stretch="Uniform" Grid.Column="2"/>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</ResourceDictionary>
Using:
<ux:UXImage RightCapWidth="10" Source="Images/example.png"/>
I have not seen such a control in Silverlight, based on the UIImage from iOS and Android 9-Patch, which I heard about, but did not see. Can anyone help? Is there an alternative to doing what I am doing to make it as a single image element that can stretch in the middle if that is the solution.