How to reference image in controltemplate - silverlight

Question

I have a usercontrol named ItemGrid with a button with an image, I moved the image to a controltemplate so I would be able to size it right:
<Button x:Name="btnOrder" Click="btnOrder_Click" HorizontalAlignment="Right" Width="48" Height="48" Margin="0,0,0,100">
<Button.Template>
<ControlTemplate>
<Image x:Name="imgOrder" Source="/Images/dark/appbar.food.png" Stretch="None"/>
</ControlTemplate>
</Button.Template>
</Button>
In the MainPage I want to set the right image depending on the currently selected them (Dark / Light)
private void detecttheme()
{
Visibility v = (Visibility)Resources["PhoneLightThemeVisibility"];
if (v == System.Windows.Visibility.Visible)
{
uri = new Uri("/Images/light/appbar.food.png", UriKind.Relative);
imgSource = new BitmapImage(uri);
ItemGrid.imgOrder.Source = imgSource;
}
else ....
That gives me: UserControls.ItemGrid' does not contain a definition for 'imgOrder' after I moved imgOrder to the controltemplate
I've tried to use findname but that gives a nullreference exception too for img
//Use FindName because we cannot directly reference the image because it's in a control template
Image img = ItemGrid.FindName("imgOrder") as Image;
img.Source = imgSource;
I also tried putting the findname in the OnApplyTemplate of the control but that doesn't seem to get fired at all?
public override void OnApplyTemplate()
{
base.OnApplyTemplate();
Image i = this.FindName("imgOrder") as Image;
}
I hope somebody has an answer to this?
Kind regards,
Mike

Answer 1

I think in this case you can find it by using the VisualTreeHelper class - there's a thread on this in WPF here, but in case you don't feel like reading it:
make this method:
/// <summary>
/// Finds a Child of a given item in the visual tree.
/// </summary>
/// <param name="parent">A direct parent of the queried item.</param>
/// <typeparam name="T">The type of the queried item.</typeparam>
/// <param name="childName">x:Name or Name of child. </param>
/// <returns>The first parent item that matches the submitted type parameter.
/// If not matching item can be found,
/// a null parent is being returned.</returns>
public static T FindChild<T>(DependencyObject parent, string childName)
where T : DependencyObject
{
// Confirm parent and childName are valid.
if (parent == null) return null;
T foundChild = null;
int childrenCount = VisualTreeHelper.GetChildrenCount(parent);
for (int i = 0; i < childrenCount; i++)
{
var child = VisualTreeHelper.GetChild(parent, i);
// If the child is not of the request child type child
T childType = child as T;
if (childType == null)
{
// recursively drill down the tree
foundChild = FindChild<T>(child, childName);
// If the child is found, break so we do not overwrite the found child.
if (foundChild != null) break;
}
else if (!string.IsNullOrEmpty(childName))
{
var frameworkElement = child as FrameworkElement;
// If the child's name is set for search
if (frameworkElement != null && frameworkElement.Name == childName)
{
// if the child's name is of the request name
foundChild = (T)child;
break;
}
}
else
{
// child element found.
foundChild = (T)child;
break;
}
}
return foundChild;
}
and use it to find your image:
Image img = FindChild<Image>(btnOrder, "imgOrder");
Hopefully that works (I'll admit I haven't tested this yet)...and as for why OnApplyTemplate() doesn't work, I believe it's only called if you subclass the Button to make your own Custom button.