This is a migrated thread and some comments may be shown as answers.

Issue when adding user controls programmatically

4 Answers 113 Views

WrapPanel

This is a migrated thread and some comments may be shown as answers.

This question is locked. New answers and comments are not allowed.

Stephan asked on 12 Jun 2013, 09:56 PM

Hi Telerik Team,

I found an issue with the RadWrapPanel that occurs when adding a bunch of user control instances. The exception that is thrown is System.ArgumentException: Value does not fall within the expected range. I googled a little bit and found one other stackoverflow post where the same issue occurs. The suggestion is to remove all x:Name attributes from the user control. Unfortunately, I can't do this in my project because of dependencies to properties (or at least I don't know how ;) ).

Here is my code that adds some items to the wrap panel:

var rnd = new Random();

for (int i = 0; i < 100; i++)

{

var tag = new Tag()

{

TagName = rnd.Next(0, 1000).ToString(),

HorizontalAlignment = HorizontalAlignment.Left

};

System.Diagnostics.Debug.WriteLine("Creating tag: " + tag.TagName);

RadWrapPanelIssue.Children.Add(tag);

System.Diagnostics.Debug.WriteLine("Tag successful created");

}

The class Tag is a user control

<UserControl x:Name="UserControlTag"

x:Class="WrapPanelIssue.Tag"

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"

FontFamily="{StaticResource PhoneFontFamilyNormal}"

FontSize="{StaticResource PhoneFontSizeNormal}"

Foreground="{StaticResource PhoneForegroundBrush}"

HorizontalAlignment="Left"

VerticalAlignment="Top"

d:DesignHeight="60" d:DesignWidth="140" Width="{Binding Width, ElementName=LayoutRoot}" Height="60">

<UserControl.Resources>

<Style x:Key="ButtonInfoBoxStyle" TargetType="Button">

<Setter Property="Background" Value="Transparent"/>

<Setter Property="BorderBrush" Value="{StaticResource PhoneForegroundBrush}"/>

<Setter Property="Foreground" Value="Black"/>

<Setter Property="BorderThickness" Value="{StaticResource PhoneBorderThickness}"/>

<Setter Property="FontFamily" Value="{StaticResource PhoneFontFamilySemiBold}"/>

<Setter Property="FontSize" Value="{StaticResource PhoneFontSizeMediumLarge}"/>

<Setter Property="Padding" Value="3,3,3,3"/>

<Setter Property="Template">

<Setter.Value>

<ControlTemplate TargetType="Button">

<Grid Background="Transparent">

<VisualStateManager.VisualStateGroups>

<VisualStateGroup x:Name="CommonStates">

<VisualState x:Name="Normal"/>

<VisualState x:Name="MouseOver"/>

<VisualState x:Name="Pressed">

<Storyboard>

<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" Storyboard.TargetName="ContentContainer">

<DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneBackgroundBrush}"/>

</ObjectAnimationUsingKeyFrames>

<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background" Storyboard.TargetName="ButtonBackground">

<DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneForegroundBrush}"/>

</ObjectAnimationUsingKeyFrames>

<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="BorderBrush" Storyboard.TargetName="ButtonBackground">

<DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneForegroundBrush}"/>

</ObjectAnimationUsingKeyFrames>

</Storyboard>

</VisualState>

<VisualState x:Name="Disabled">

<Storyboard>

<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" Storyboard.TargetName="ContentContainer">

<DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneDisabledBrush}"/>

</ObjectAnimationUsingKeyFrames>

<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="BorderBrush" Storyboard.TargetName="ButtonBackground">

<DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneDisabledBrush}"/>

</ObjectAnimationUsingKeyFrames>

<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background" Storyboard.TargetName="ButtonBackground">

<DiscreteObjectKeyFrame KeyTime="0" Value="Transparent"/>

</ObjectAnimationUsingKeyFrames>

</Storyboard>

</VisualState>

</VisualStateGroup>

</VisualStateManager.VisualStateGroups>

<Border x:Name="ButtonBackground" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" CornerRadius="0">

<ContentControl x:Name="ContentContainer" ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}" Foreground="{TemplateBinding Foreground}" HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" Padding="{TemplateBinding Padding}" VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"/>

</Border>

</Grid>

</ControlTemplate>

</Setter.Value>

</Setter>

</Style>

</UserControl.Resources>

<Grid x:Name="LayoutRoot" Margin="10" HorizontalAlignment="Center">

<Grid.Background>

<SolidColorBrush Color="Transparent"/>

</Grid.Background>

<Grid.ColumnDefinitions>

<ColumnDefinition Width="Auto"/>

</Grid.ColumnDefinitions>

<Polygon x:Name="PolygonLeft" Points="20,0 0,20 20,40" StrokeThickness="0" Fill="#959595" Grid.Column="0"/>

<Rectangle x:Name="RectangleMiddle" Grid.Column="1" Fill="#959595"/>

<TextBlock x:Name="TextBlockTagName" HorizontalAlignment="Center" Grid.Column="1" Text="{Binding TagName, ElementName=UserControlTag}" FontSize="26" Foreground="Black" TextAlignment="Center" Margin="5,0,5,0"/>

<Rectangle x:Name="RectangleRight" Grid.Column="2" Fill="#959595"/>

<Button x:Name="ButtonTagRemove" BorderThickness="0" Style="{StaticResource ButtonInfoBoxStyle}" Width="32" Height="32" Grid.Column="2" Margin="5" Visibility="{Binding RemoveButtonVisibility, ElementName=UserControlTag}">

<Button.Background>

<ImageBrush ImageSource="/Icons/appbar.cancel.rest.black.png" Stretch="None"></ImageBrush>

</Button.Background>

<Button.Foreground>

<ImageBrush ImageSource="/Icons/appbar.cancel.rest.black.png" Stretch="None"></ImageBrush>

</Button.Foreground>

</Button>

<Button x:Name="ButtonTagDelete" BorderThickness="0" Style="{StaticResource ButtonInfoBoxStyle}" Width="32" Height="32" Grid.Column="2" Margin="5" Visibility="{Binding DeleteButtonVisibility, ElementName=UserControlTag}">

<Button.Background>

<ImageBrush ImageSource="/Icons/appbar.delete.rest.black.png" Stretch="None"></ImageBrush>

</Button.Background>

<Button.Foreground>

<ImageBrush ImageSource="/Icons/appbar.delete.rest.black.png" Stretch="None"></ImageBrush>

</Button.Foreground>

</Button>

</Grid>

</UserControl>

As you can see I need the x:Name for the user control in order to bind the properties to the controls.

BTW: I'm using the Q1 2013 (trial) release of the WP controls.

Any help is highly appreciated.

Kind Regards,
Stephan

4 Answers, 1 is accepted

answered on 14 Jun 2013, 08:41 AM

screenshot.png

Hello Stephan,

Can you please attach your app so that I can debug it (you can attach files in the support ticket)? Copy/pasting the xaml and C# that you provided did not cause an exception to be thrown (see screenshot).

Regards,
Victor
Telerik

Have a suggestion or face a problem - you can use the Ideas & Feedback portal to submit ideas, feedback and vote for them.