Dynamic Control Template in Silverlight

silverlight

I'm trying to make a button in Silverlight use a control template to change the way it looks.

I need to do this dynamically in code (not xaml markup).
The Button object has a Template property to which you can assign a ControlTemplate.

But how do you stuff UI elements into the ControlTemplate?
(In WPF, there is a VisualTree property but no such property exists in Silverlight)

Best Answer

I'm not sure if this helps, but just in case. To create buttons using a control template in code behind (not XAML) I've done it like this:

load the control template from an xml definition (below is a link to the source)

    byte[] bytes = ReadBytesFromStream("BestBuyRemix.BL.buttontemplate.xml");
    string buttonTemplate = "";
    UTF8Encoding encoding = new UTF8Encoding();
    buttonTemplate = encoding.GetString(bytes.ToArray(), 0, (int)bytes.Length);

create the button and add it to the visual tree (in this case a wrap panel)

string onebutton = string.Format(buttonTemplate, mnu.CatItemName, mnu.CatItemImage, "{StaticResource buttonStyle1}", "{StaticResource CatItemNameBlock}", "{StaticResource ThumbNailPreview}", ictr.ToString()); ictr += 1;

        Button bt = (Button)XamlReader.Load(onebutton);
        bt.Tag = mnu.CatItemPageUri;
        bt.Click += new RoutedEventHandler(bt_Click);

        Wrappable.Children.Add(bt);

I wrote a post on my blog about the Best Buy Remix API which uses this to build a product list in the details page. It has a link to the Silverlight source. In case you're interested.
blog post link

Related Solutions

R – Silverlight Control Template Color Property

It's possible Silverlight doesn't have it available but you should be able to use templatebinding:

<Path Fill="{TemplateBinding BackgroundColor}" />

Then you can use

<Button Background="Blue" />
<Button Background="Red" />
<Button Background="Green" />
<Button Background="Yellow" />

HTH

R – Can you override just part of a control template in silverlight

I've found a way to do this, by inheriting off the control and overriding the OnApplyTemplate. It's not ideal, but I think it's better than having to copy the entire control template. Here's an example of creating a borderless textbox, essentially disabling the mouse over visual state by always clearing the storyboard:

using System.Windows;
using System.Windows.Controls;
using System.Windows.Media.Animation;

namespace SilverlightTestApplication
{
    public class BorderlessTextBox  : TextBox
    {
        public BorderlessTextBox()
        {
            BorderThickness = new System.Windows.Thickness(0);
        }

        public override void OnApplyTemplate()
        {
            base.OnApplyTemplate();

            //Get the mouse over animation in the control template
            var MouseOverVisualState = GetTemplateChild("MouseOver") as VisualState;

            if (MouseOverVisualState == null)
                return;

            //get rid of the storyboard it uses, so the mouse over does nothing
            MouseOverVisualState.Storyboard = null;
        }
    }
}

Best Answer

Related Solutions

R – Silverlight Control Template Color Property

R – Can you override just part of a control template in silverlight

Related Topic